충청 ICT취창업 역량강화프로그램 개발일지(10/26)

오늘은 채팅방을 만드는 것을 배웠다.

 

 

 

채팅방에 있는 사람이 나와 내가 아닌 다른 사람 포함해서 두 명만 있게 한다. 

그리고 이미 채팅방이 존재하는지 확인한다.

 

 

 

 

콘솔창에 입력해보니 채팅방이 새로 만들어져졌고 그 다음엔 그 채팅방이 발견되었다고 뜬다.

 

 

 

 

그 후, 이런식으로 해서 간단한 채팅을 만들었따..

 

한 번 봐서는 이해가 안가지만,, 여러번 보고 다음에는 내가 혼자 만들어보려한다.

 

 

 

그 다음으로, 퀴즈를 내 주셨다.

 

*  - react hook 이 친구들의 각각 역할?

      ex)useState, useEffect

 *  - next.js 의 routing+dynamic routing, 이것을 하려면 폴더 구조 및 파일을 어떻게 처리해야 하나요?

*  - state management(상태관리)는 무엇이며, 왜 써야하나요?

 *  - zustand - 어떤 패턴을 기반으로 한 상태관리 라이브러리인가요? flux 패턴

 *  - '재활용'이라는 관점에서 componenent를 설명해주세요 

 *  - state와 props의 차이점을 설명해주세요

 

1번, react hook은 react에서 관리되는 데이터를 처리하는 위한 도구들로, useState는 state(변경되는 값)을 관리하는 hook이고 useEffect은 어떤 값을 observing해서 특정 로직을 수행하거나 라이프사이클 관련된 로직을 수행하는 hook인 것이다.

 

2번, 보통 페이지를 만들어서,,, 라우팅을 한다! 그리고  대괄호로 만들어서 다이나믹 라우팅을 만들어준다.

 

3번, 상태관리는 글로벌하게 사용되는 상태를 따로 관리해주는 것이다. 써야 하는 이유는 프로젝트의 규모가 커지고, 요구사항이 늘어남에 따라 컴포넌트 간 상태 교환도 증가한다면 개발과 유지보수하기가 어렵다는 것이다. 그러므로, 상태 관리에 관련된 코드를 컴포넌트에서 분리할 수 있도록 도와주는 것이 상태 관리 라이브러리라고 할 수 있다.

 

4번, flux 패턴으로 1-way이다. 이것은 한 곳에서만 데이터를 보관하고 view는 데이터를 내려받는다.

angular(2-way)나 MYC와는 다르다.

 

5번, 여기서 재활용이란 여러곳에서 컴포넌트를 사용할수있다는 의미로, 로직과 뷰의 분리를 위해서 컴포넌트한거다.
공통 조직화를 하면 좋은점은 유지보수가 유능하고 로직의 분리가 되어 좋음??

 

6번, Props 는 컴포넌트간 전달 되지만 State는 컴포넌트 안에서 관리 되고 시간이 지나면서 바뀌는 동적인 데이터다. 

 

 

혼자 찾아봐서 답을 냈지만 틀린 것도 있었고 맞힌 것도 있었다.

 

다시 강의듣고 나서 정답을 찾아봐야겠다.

 

 

마지막으로 .env에서 NEXT_PUBLIC이라는 것을 덧붙여주고 다시 실행하였다.

 

 

 

음.. 오늘 강의 듣고 마지막으로 질의응답시간이었는데,, 여러 가지 질문을 드렸다..

개발자라는 직업을 선택했지만 잘 할 수 있지에 대한 회의감이 들곤 했는데 나랑 적성이 어느 정도 맞는 것 같고,

이 공부하는 것이 즐거우니 그걸로 됐다는 생각이 들었다. 그만큼 가치가 있는 직종이고 매력이 있다는 걸 누구보다 아니까!!

리액트는 이번에 맛보기로 공부할 수 있었는데,, 시간이 나면 더 추가적으로 공부 해볼 생각이다.