2024. 05. 20 (월) 4주차 - Daily Coding - Day01

1강

웹 프론트엔드 개발자가 되려면 준비해야하는 것

1. HTML/CSS

2. JavaScript

3. 반응형 모바일(퍼스트 디자인)

4. 프레임워크 및 라이브러리

5. 버전 관리 시스템(Git 등)

6. APIs/REST/GraphQL => API 응용프로그램인터페이스(서버와 통신하는 방법)

7. 테스팅 및 디버깅

 

커리큘럼 소개

Web Frontend / Developer Roadmap

보편적으로 가지고 있는 채용의 기준 (Job Description)

 

 

브라우저 동작 원리 (요청-응답)

프로토컬 방식

HTML / CSS / JavaScript

 

 

JavaScript

- 연산자

- 타입

- let, cost, var

- 함수

- 배열

- 오브젝트

등등

 

React (Basic to Advanced)

-  컴포넌트

- JSX

- state 와 props

- 이벤트 핸들러

- useState, useEffect

- Context API

등등

 

Frontend Tools

- 디버깅 방법

- Redux

- HTTP Request

- React Router

- 인증

- 단위 테스트

등등

 

$git clone {{repository_url}}

$ cd {{repository_name}}

$ git checkout {{branch_name}}

 

 

2강

React

- 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리

 

전통적인 웹 사이트에서 페이지 이동

Client	------Request ->	Server
	<-HTML---------

 

           

React 특징 3가지

1. 선언형

- 필요한 컴포넌트만 렌더링

- 예측 가능하고 디버깅 용이

 

2. 컴포넌트 기반

- 컴포넌트에서 상태를 관리    ex) 버튼에 관한 스타일

- 재사용해서 생산성 향상

 

3. Virtual DOM

- 실제 DOM과 동일

- 리플로우/리페인트 최소화

 

 

프레임워크 - 규칙에 따라서 프로젝트에 따라서 진행

ex) 스프링

 

라이브러리 - 필요한 곳에 하나씩 뽑아서 기능을 사용 자유도가 높고 자유롭게 변경해서 사용이 가능

*배워야하는 부분이 많다는게 단점 (vue.js 는 빠르게 배울 수 있음)

 

 

3강

리액트 vs 바닐라 자바스크립트

https://github.com/dev-owen/javascript-es6-fundamental

 

명령형

- 어떻게(HOW)에 집중

- 하나씩 명령을 해 주는 방식

- 매번 바퀴를 만듦

- 추상화 수준이 낮음

- Vanilla javascript, jquery

 

선언형

- 무엇(WHAT)에 집중

- 컴포넌트에서 상태를 관리

- 재사용해서 생산성 향상

- 추상화 수준이 높음

- React, Vue

 

---

🧐 4주차 1DAY 

오늘부터는 주특기 수업에 들어가는 날이다.

내가 과연 끝까지 잘 마무리 할 수 있을지는 모르겠지만...

기초주차에서 받은 팀장님 프로젝트도 html, css까지만 했는데 언젠간 다 완성할 수 있는 날이 오겠지?!!

아자아자!! 새로운 도전은 항상 힘들다!!