20210108-0111 TIL
·
BootCamp_Codestates/TIL
0108한일 Basic Web Hiring Assessment 진행 0111한일 Cmarket Redux sprint 진행 (페어 프로그래밍) Redux 개념 블로그 정리 Full Stack Mern Project Clone Coding(-34:55)_Client, Server 구축 학습내용 및 성취 Achievement goals 상태 관리 라이브러리가 왜 필요한지 이해할 수 있다. Redux (혹은 Flux Pattern)에서 사용하는 Action, Reducer 그리고 Store의 의미와 특징을 이해할 수 있다. Redux의 3가지 원칙이 무엇이며, 주요 개념과 어떻게 연결되는지 이해할 수 있다. Presentational 컴포넌트와 Container 컴포넌트의 개념을 이해할 수 있다. Redux ..
10. Redux
·
BootCamp_Codestates/IM Tech Blog
Achievement goals 상태 관리 라이브러리가 왜 필요한지 이해할 수 있다. Redux (혹은 Flux Pattern)에서 사용하는 Action, Reducer 그리고 Store의 의미와 특징을 이해할 수 있다. Redux의 3가지 원칙이 무엇이며, 주요 개념과 어떻게 연결되는지 이해할 수 있다. Presentational 컴포넌트와 Container 컴포넌트의 개념을 이해할 수 있다. Redux hooks(useSelector, useDispatch)를 사용해 store 를 업데이트할 수 있다. Redux 란? 상태 관리 라이브러리 목적? React 특성인 불필요한 렌더링을 보완하기 위함. React 렌더링 조건이라 하면, 1. State 가 변경된 경우 2. State 변경으로 인해 Prop..
20210107 TIL
·
BootCamp_Codestates/TIL
오늘한일 Cmarket solo 스프린트(using hooks) 진행 및 완료 학습내용 및 성취 react-router-dom을 이용해 Client Side Routing하는 방법을 학습합니다. useState 를 이용해 상태를 사용하는 방법을 학습합니다. 쇼핑몰 애플리케이션의 주요 기능을 구현했다. [장바구니 담기] 버튼을 이용해 장바구니에 해당 상품이 추가되도록 구현하세요. 장바구니 내 [삭제] 버튼을 이용해 장바구니의 상품이 제거되도록 구현하세요. 장바구니의 상품 갯수의 변동이 생길 때마다, 상단 내비게이션 바에 상품 갯수가 업데이트되도록 구현하세요. 구현모습 느낀점 Class 컴포넌트로 구현하는 것보다 훨씬 간결하다.
20210106 TIL
·
BootCamp_Codestates/TIL
오늘한일 Recast.ly + AJAX 스프린트 진행 및 완료- youtube api 로 데이터 fetch. React.ly + AJAX 복습 및 스프린트 리뷰 학습내용 및 성취 특정 검색어를 입력한 후, 버튼을 눌렀을 때 검색어에 해당하는 youtube 데이터를 fetch 해 오는 일련의 과정을 익힐 수 있었다. state를 사용할 때, 어떤 데이터 혹은 상태를 state로 두어야 하는지에 대해 고민을 했다. 각 동작이 실행될 때의 동작 프로세스(데이터의 흐름 등)에 대해 공부했다. 느낀점 프리코스의 첫 페어님과 오랜만에 만나 스프린트를 진행하니 반가웠고 즐거운 시간이었다.
8-1. React 데이터흐름 & State 끌어올리기
·
BootCamp_Codestates/IM Tech Blog
Must know concepts recast.ly 스프린트에 등장하는 컴포넌트에 대해 컴포넌트 트리를 그려볼 수 있나요? recast.ly 스프린트에서 App이 클래스 컴포넌트인 이유가 무엇인가요? recast.ly 구조 상 어떤 컴포넌트가 서로 상호작용을 하고 있나요? React 에서의 데이터 흐름 1. 프로토타입에서 컴포넌트 찾기 리액트는 컴포넌트 단위 기준으로 상향식으로 앱을 만든다. 이는 테스트가 쉽고 확장성이 좋다. 기획자나 PM, 또는 UX 디자이너로부터 앱의 디자인을 전달받고 나면, 이를 컴포넌트 계층 구조로 나누는 것이 가장 먼저 해야 할 일 2. 트위틀러 예시로 진행 1) 컴포넌트 컴포넌트 단위로 나누는 이유? 단일 책임 원칙 즉, 하나의 컴포넌트에 하나의 일만 시키기 위함. 컴포넌트는..
20201231-20210103 IL
·
BootCamp_Codestates/TIL
한일 스프린트 코드리뷰 [x] ChatterBox Client [x] ChatterBox Server [x] Refactor Express [x] Twittler React 토이 problem 리뷰 - bubbleSort 학습내용 및 성취 Client, Server, Server Refactor(express), Twittler React 구현 차이점을 익힐 수 있었다. bubbleSort 를 풀었다. 느낀점 개념은 이해가 가는데, 구현하는 것이 어색하다. bubblesort 문제.. 레퍼런스 코드의 간결함에 멋쩍음을 느꼈다.