1교시
[진행상황 리뷰]
- 양채훈님 : Slate.js로 팝업에디터 구현한 것 리뷰. 리덕스 관련 설명 주셨는데 이해가 잘 가지 않음..(별도 공부 필요)
(중간투표) : 리액트 상태관리 도구로 좋다고 생각하는 것? redux, mobx, recoil - 유명환님 : redux, mobx, recoil 관련 차이점 설명해주심
면접관련질문 : 무언가를 설명한다는 것이 어려운 것 같긴 하다. 어떤 부분이 어려운가요??
이윤희님 : 어디서부터 설명해야 하고 어디까지 해야할지 잘 모르겠어요.
조남은님 : 저 같은 경우에는 잘 모를 때, 설명할 수 없을 때가 제일 말이 안 나오는 것 같습니다.
김경재님 : 100%이해하지 못했으나 그것에 대해 설명해야 할 때?
이기주님 : 설명을 하면서 깨닫게 되는 경우도 있는 것 같아요.
민태님 답변 : 글로 써본다 -> 말로 해본다 -> 정리한다 -> 반복 / 발표자료를 만들어보는 것도 좋다. 또 공식문서를 한번도 들어가 보지 않은 상태에서 기술을 구현한다?? 굉장히 안 좋은 것이다. (저작자의 의도를 파악하는 것이 중요하다.)
도중에 갑자기 QnA로 빠졌다. 테크러닝의 전통 다른 길로 빠지기~
2교시
[수업 이어서]
- thunk에 대한 토론...
이것을 왜 쓰는지, 어떻게 구현했는지 등등에 대한 리뷰시간 - 상태구성에 대한 설계를 어떻게 할 것 인가??
를 물어보다가 갑자기 수업 방식에 문제를 느끼고 설문조사 시작 - 설문
기존방식Keep, 잘하고 싶은데 잘 안된다, 그냥 강의나 듣고 싶다, 강의와 진행을 동시에 했으면 한다.
에서 강의와 진행을 동시에 해줬으면 한다가 가장 많음. - 다시 수업 진행에 대한 방법에 대한 설문
- 그리하여 무언가를 만들어와 보시기로 하셨다. 많이 부족해서 죄송하다 ㅠ
3교시
컴포넌트 설계 관련
2가지 정도 이야기해보면 좋을 것 같다.
1. 컴포넌트가 뭐지??
- 리액트에서만 아니고 소프트웨어 공학적으로 컴포넌트가 이미 있다. 근데 라이브러리나 프레임워크마다 컴포넌트의 개념이 약간씩은 다를 수도 있다.
- 이찬호님 : 컴포넌트에 대해서 고민중이다..
- 민태님 의견 : 진짜 컴포넌트와 리액트에서 설명하는 컴포넌트가 다르다. 그렇다면 진짜 컴포넌트는 뭘까?? 진짜 독립적인 기능을 하는 것이 컴포넌트다. 근데 리액트에서 얘기하는 검포넌트라고 하는건 스펙이 너무 부족하다. 리액트 프레임워크에서 완벽한 검포넌트 성의 기능을 제공해주고 있지 않다.
웹 컴포넌트라는 표준을 예로 본다. 이게 컴포넌트다 라고 정의한 건 아니지만 여기서 보면 하나의 독립적인 주체로서 모듈이 되러면 어떤 구조로 구성해야하는지를 더 자세하게 이해할 수 있을 것.
2. 그렇다면 컴포넌트를 어떻게 만들 것인가?
- 리액트에서의 컴포넌트는 UI에서의 최소의 조각 정도로만 이해하면 좋을 것 같다. 근본적으로 컴포넌트라고 부르기는 어렵다. 그래서 실제 컴포넌트의 형태로 설계하려고 하는 수준으로 리액트를 하려고 하면 시간이 매우 오래 걸릴 것이다.
- 하여 어느 정도 수준으로 구현을 할지에 대한 컨센서스가 필요하고, 그것에 따라 프로젝트 성으로 컴포넌트에 대해서 컨셉을 정립하고 리액트로 코딩하면 될 것 같다.
[오늘의 QnA]
- 조남은님 : 배민에서 어떤 프로젝트는 mobx를 쓰고 어떤 프로젝트는 redux를 쓰신다고 했는데, 사용하는 상태관리 라이브러리가 달라지는 이유가 있나요?
윤희님 답변 : mobx, redux의 단점에 대해 각각 설명
민태님 답변 : redux는 굉장히 단순한 툴, 핵심 코어 코드도 별 것 없고, 컨셉으로 먹고 산다. 그래서 컨셉을 확장하느라고 여러가지 코드가 많이 있는데 그 런것에 의미부여 하고 확장하고 하다보니 redux를 초기부터 쓰는 사람은 흐름의 맥락을 알고있어서 어렵지 않은데, 최근에 진입한 사람들은 거대한 성처럼 느껴질 것. 굉장히 어려운 느낌을 받게 하는 라이브러리다. 리액트가 프론트앤드 개발자에게 채택을 받는 이유가 개발의 자유로움이 라고 본다. 근데 redux는 반대로 개발의 맛이 없다? 그에 반해 mobx는 자유로움이 굉장히 크다. 배민에서 mobx를 하려고 했던 이유는 소속 엔지니어들이 사용하고 싶어하기도 했고, redux가 아키텍쳐가 너무 단단하다 보니 주니어 개발자들의 설계향상에 조금 도움이 되지 않는다. 그에 반해 mobx는 그런 부분에 있어서도 도움이 된다. - 익명 : 마인드맵으로는 회고를 안해봐서 그런데, 마인드맵으로 할 때도 정리가 잘 되셨나요? 블로그 글 쓰기 vs 마인드맵 개인적으로 어떤게 좋은가요?
민태님 답변 : 둘 다 장단점이 있다. 본인은 마인드 맵으로 정리하는 것을 선호한다. xmind와 위키를 쓴다.
근데 그거보다 중요한 것은 설명할 수 있어야 한다. 꼭 면접뿐만 아니라 언제든지 그러한 자리가 생길 것이다.
언제나 경쟁상태이기 때문에 본인의 역량을 PR하는 것이 굉장히 중요하다. - 김희정님 : 보통 인터뷰는 CS(컴퓨터 사이언스) 지식이 탄탄해야된다고 하는데, 어떻게 공부하는게 좋을까요?
민태님 답변 : CS의 범위가 굉장히 넓다. 볼륨이 좀 큰 회사들이 CS지식을 좀 더 깊게 물어본다. 볼륨이 조금 작은 곳은 지식보다는 당장 구현할 수 있는 기술에 집중한다. 탄탄까지라기보다는 CS지식이 탄탄한 사람의 비율은 많지 않을 것 같다. 본인이 생각했을때의 CS지식 수준은 그 분야에 맞는 관련된 지식이 적당히 잘 버무려져서 잘 있는가를 보는 것 같다. 예를 들어 컴퓨터 시스템에 대해 설명한 다면, 스레드, 메모리 등에 대한 부분을 전체적인 맥락정도는 설명할 줄 알아야 한다. 근데 만약 단순히 자바스크립트는 싱글 스레드 랍니다. 정도의 대답은 노노. 연결지을 줄 알아야 한다. - 익명 : Server side rendering, Client side rendering에 대한 민태님이 생각하는 장단점(?) 선택 기준(?)이 궁금합니다.
민태님 답변 : SSR과 CSR은 기술이라기 보다는 방식이어서, 좀 더 구체적인 서비스의 지향점이 정해지지 않은 상태에서 이것의 장단점을 논하는 것은 의미없다고 본다. 서비스에 목적에 맞게 가장 최적화된 방법을 찾는 것이다. 그 둘 중 뭐가 좋냐? 에 대한 대결구도는 좋지 않다. - 익명 : 면접 인터뷰에서 신입의 경우에는 무엇을 중요하게 보시고, 경력의 경우에는 어떤 것을 중요하게 보시나요?
민태님 답변 : 신입은 잘 성장할 수 있는가? 개발을 정말 좋아하는가? 물론 회사마다 케바케, 잘 성장할 수 있는가는 가지고 있는 지식에 대해 어떻게 설명하는지를 보고 유추한다. 경력의 경우는 그 경력의 내용을 얼마나 잘 성장시켜왔는지? 그리고 5년 이상이라면 문제를 풀어내는 능력 등, 리더십 등을 더 본다. - 조은남님 : 지난 기수 강의 중에 '이건 하길 잘했다', '이 강의의 반응이 제일 좋았다' 하는 강의가 있으신가요?
민태님 답변 : 글쎄요..? 지난 기수때 리액트를 미니멀하게 만들어 본 날이 있었다. 그게 재미있었다. 공식문서 읽어보기 << 이것도 반응이 좋았다. redux의 미들웨어 공식문서 파트. - 재사용되지 않는 요소라도 가독성을 위해 (한 파일/컴포넌트의 코드가 너무 길어지지 않게) 컴포넌트화하는 것은 어떻게 생각하시나요?
민태님 답변 : 케바케다. 코드를 봐야 피드백을 줄 수 있는 수준의 답변이 될 만한 질문이다.
[메모]
블루프린트 : UI프레임워크 https://blueprintjs.com/
Blueprint - A React-based UI toolkit for the web
A React-based UI toolkit for the web
blueprintjs.com
dependabot (디펜드봇) : 각 언어, 라이브러이의 업데이트 상황 체크하는 것
해커뉴스 : 개발관련 뉴스를 확인 할 수 있는 곳
'Project > 우아한테크러닝 4기' 카테고리의 다른 글
우아한테크러닝 4기 / 교육 수료 후기 (0) | 2021.07.03 |
---|---|
우아한테크러닝 4기 / 20210615 / 교육에 대한 기록 / 메모장 (0) | 2021.06.16 |
우아한테크러닝 4기 / 20210608 / 교육에 대한 기록 / 메모장 (0) | 2021.06.08 |
우아한테크러닝 4기 / 20210603 / 교육에 대한 기록 / 메모장 (0) | 2021.06.03 |
Git Repository & React & TypeScript 기본 세팅 (0) | 2021.06.03 |