본문 바로가기
WIL

[WIL] 개발일지: 항해99 4, 5주차

by 0sae 2021. 4. 9.

3월 넷째 주, 4월 첫째 주: 항해99 4,5주차

항해99 Chapter3 는 '3-1 주특기 기본' 과 '3-2  주특기 심화' 과정으로 나뉜다.

내가 고른 주특기는 프론트엔드의 꽃!!! 리액트(React)였다.

프론트엔드와 자바스크립트(javaScript)

프론트엔드는 단순히 HTML과 CSS를 사용해서도 웹사이트를 만들 수 있지만 자바스크립트를 더해주면 동적이고 사용자 친화적인 화면 구성이 가능하다. 하지만 이러한 동적인 유저인터페이스를 동적으로 나타내기 위해서는 수많은 상태를 관리해줘야 하는데, 이를 도와줄 수 있는 라이브러리 혹은 프레임 워크들이 존재한다. (대표적인 프론트엔드의 라이브러리에는 React Angular, Vue 가 있다. )

리액트(React)란?

리액트는 페이스북이 만든 라이브러리로 페이스북 개발자들이 라이브러리의 성능과 개발자 경험을 개선하기 위해 많은 연구를 한다. 이는 현업에서 인기있는 웹/앱(RN)의 view를 개발할 수 있도록 한다. 어플리케이션을 만들기 위해서는 사용자가 조작하기 위한 UI(User Interface), UI를 컨트롤하기 위한 로직, 데이터를 처리 비지니스 로직 등 크게 세 부분으로 개발이 필요하다. 그 중 React.js는 사용자가 조작하기 위한 UI를 만드는 것을 도와주는 라이브러리이다.

리액트 내에는 HTTP 클라이언트, 라우터 등의 기능들은 내장되어있지 않고, 따로 라이브러리가 있는 것도 아니어서 개발자는 원하는 스택을 입맛에 맞게 골라 사용할 수 있고 혹은 직접 라이브러리를 만들어 사용할 수도 있다. 리액트는 "컴포넌트" 개념에 집중되어 있다. 데이터를 넣으면 우리가 지정한 유저 인터페이스를 조립해서 보여주는 레고같은 친구이다.

 

- 선언형(Declarative)이다.

- 컴포넌트(Component) 기반으로 재사용성(Reusable)이 높다.

- 컴포넌트는 state와 props를 가딘다.

- Virtual DOM(가상돔) 기반으로 가볍다.

<항해 99 Chapter 3 리액트 커리큘럼>

1.  Chapter 3-1 주특기 기본

- "프론트엔드의 꽃 리액트(React)' 익숙해지기 - 임민영 튜터님

 

1)  React 개발환경 구성 방법, JSX, Component

2) Component: event, listener, react hook

3) Redux, React-router

4) keyframe, firebase, firebase + react

5) React 꼼수, AWS S3 로 배포하기

 

- 과제 : 캘린더 만들기

 

2. Chapter 3-2 주특기 심화 

- "리액트 심화반" - 임민영 튜터님

 

< 게시글 목록 페이지 만들기>

1) OAuth2.0을 비롯한 로그인 관련 이론

2) 자바스크립트 문법 & 이론

3) 로그인 기능 만들기(쿠키, 세션 방식)

4) Firebase Storage로 이미지 업로드하기

5) 프리뷰 만들기

6) 무한스크롤 만들기

7) 알림 기능 만들기 (파이어베이스 실시간 데이터베이스 사용)

8) 배포하기

9) SEO

10) 프리렌더링(pre-rendering)

 

- 심화 과제(매운맛): 매거진 만들기

- 난이도 조정 과제(순한맛): 나만의 단어장 만들기

 

 

단기간에 엄청난 양의 지식을 넣으려니 솔직히 많이 버거웠지만,

배운 걸 다 기억하려고 하기 보다는 '뷰 > 기능 > 연결' 의 순서와 흐름을 잘 파악하는 것이 중요하다고 하시던 튜터님의 말씀.

처음에는 부분에 얽매여 전체적인 흐름을 보지 못했는데 전체적인 흐름을 읽을 수 있게 되고나니 처음에 전혀 이해되지 않던 부분들도 '아하! 이럴 때 사용하는구나 !' 하고 재미를 느끼게 되었다.

 

 

'WIL' 카테고리의 다른 글

[WIL] 개발일지: 항해99 7주차  (0) 2021.04.19
[WIL] 개발일지: 항해99 6주차  (0) 2021.04.11
[WIL] 개발일지: 항해99 3주차  (0) 2021.03.22
[WIL] 개발일지: 항해99 2주차  (0) 2021.03.14
[WIL] 개발일지: 항해99 1주차  (0) 2021.03.07