오늘 한 일
기술 면접 질문
<잘한부분>
★회원가입 validation(유효성 검사)굿
★스와이퍼 이미지 움직이는거 굿
★css 굿
★마이페이지 내가 쓴글 팔로우 목록 잘 구현
★기술 선택 - typescript 안적어도 무방(디폴트임)
★맞춤 알고리즘 (설문조사 활용 맞춤추천 괜찮)
<보완해야할 부분> - 기능
★문의하기 - 관리자 입장에서 여러유저와 실시간 채팅을 할때 ui 쪽 보완하기
★좋아요 채팅부분 보완
★독립서점 디테일 ui 추가 필요 - 급하게 만든 느낌
★리덕스 json server 삭제 redux 삭제
★package json 간단한 관리 필요
(개발환경에서만 필요한 eslint 같은건 개발환경에서만 build될 수 있게)
(dev dependency)
★day js?( json? ) < 날짜 관련 로직(라이브러리) 표준처럼 사용하니 이걸로 사용
★type 파일 디테일하게 나누기
★asset 파일 빼기 -> 다 public안에
★meta tag 아직 없음 -> react snap / helmet으로 페이 지별로 @@
★next -> 최적화 측면 cra 라우터 측면에서 라이트하우스 퍼포먼스 점수 측정해보고 스냅샷찍고 최적화하고 그 점수 비교해보기 -> 이정도까지 발전이 있었다는 표본
(코드 스플리팅, 레이지 로딩 반영?)
★이미지 파일 -> png/jpg webp파일로 대체
페이지네이션 컴포넌트에서 페이지 넘버스 계산할때 컴포넌트 내부에서 for문하지말고 usememo사용해서 특정 state가 바뀔때만 계산할 수 있도록 최적화하기
<보완해야할 부분> - 발표
★비동기처리 - 리코일 - 클라이언트 전역상태 목적
★리액트 쿼리 - 서버 관리 목적성이 강함
(이미 저렇게 나온 라이브러리이기에 굳이 저 두개를 비교할 필요는 없음)
(아예 비동기처리하는 다른 라이브러리와 비교해서 설명하기)
(다른 라이브러리와 비교하든 장단점을 따져서 채택한 이유를 말하든 선택)
(관점을 바꿔서 어떤걸 고민했다로 말하는게 나음)
★수파베이스 비교는 진행이 안되어있음(ex firebase) 비교를 하는게 좋을듯
(rdbms-데이터베이스 구조 noSQL 차이 설명) - firebase와 비교
★수파베이스 스키마 erd 발표때추가 추천(구성 짜임새 있고 완성도 있어 보임)
★아키텍쳐 그릴 때 클라우드크래프트 사이트 활용해서 그리기(다이어그램 예쁘게 그릴 수 있는 툴)
면접 피드백
비슷한내용 줄이기
dom설명할때 가상돔은 최소한의 변경만해서 적용 실제돔보다 빠르고 효율적
리코일이란?
전역상태관리 라이브러리만 언급x atom selector 등등 실제 사용하는 과정도 설명
toolkit과만 비교했는데, zustand 추가적으로 라이브러리들이 잇지만 이걸 굳이 선택한이유는
가볍고 클라이언트사이트쪽에서 데이터가 방대하지않아서
왜 프론트엔드?
소통 - 중간쯤 ??
저는 어떤 능력이 있다고 먼저 말하기 그래야 충분한 근거(강점 먼저 말하기)
협업에서 도움이될만한 부분을 생각했다
말을 꾸며야 한다 - 유저가 직접사용하는 인터페이스, 웹사이트에대한 불편했던경험,편했던 경험
같은걸 경험삼아 만들어보고싶었다 직접
직접 회사 웹사이트 들어가서 로딩되는 시간, 네트워크 계산 이런걸 실제로 느껴서 적용해서 개선을 해보고싶었습니다(좀 더 와닿게) 왜 하고싶은지
6번 거의 필수 질문임 좀 더 디테일하게
유튜브 보고 좀 더 공부해서 상세하게 답변하기
~~입니다
setState관련 비동기적 업데이트 ,렌더링 제어 가능, setState사용해서 상태관리
next도 그래도 면접준비해야함
typescript는 언어
리액트가 라이브러리
next js vue js 프레임워크
라이브러리 프레임워크 차이
라이브러리 도서관 필요한기능구현할때 필요한것만 찾아서 사용 자유도 높고 가져다 써야함
프레임워크 틀이 고정되어있고 바꿀수잇는게 크게없고 거기안에서만 조작
spa 모든페이지로딩1번
map 각각에 페이지에 대한 '요청시' html응답
디자인패턴??같이 공부해야함(좀 더 백엔드적인 질문요소긴함 그래도 알아놔야함)
뭘 더 공부해야지? 할땐 디자인패턴 공부를 함
hoisting - var let const
number = 4
let number =
============불가능
호이스팅방지때메 재선언 불가능 (호이스팅 언급)
let 재할당 가능 const 재할당 불가능
[호이스팅, 재할당 언급]
~~하는데 사용하기 좋습니다, 사용합니다 문장 깔끔하게 말하기
git hub 제출하게되면 코드를 왜 이렇게 짯는지 물어볼 수도 있음
프로젝트가 뭐가 어려웠는지
앞부분은 간단하게 --가 어려웠다
소통이 어려웠고
디자인이 제대로 이뤄지지 않아서 힘들었다
팀 리더로써 분위기를 풀어보려고 ~~도하고 확실히 딱딱하게 의사전달도 하였다
상황을 잘 이해해주셨고 합의점을 잘 찾아서 기간안에 프로젝트를 잘 완수할 수 잇엇습니다
시간이 부족하면 답변먼저 준비하고 문장에 대한 모든 단어를 다 이해하고 코드에 대해서도 완전히 이해할 수 있어야함
계속 파고파고파고들어서 이해하기
모르는건 --> 이부분은 잘 모르겠습니다 솔직한 부분이 좋다
프로젝트 관련
