프론트엔드

본 문서는 직접 면접을 응시한분들이 작성하는 문서이며, 기업 보안 관련 문제에 대한 이슈가 발생할 시 해당 기업의 내용을 제거할 예정입니다.

당근마켓(임동현)

note

면접시간: 1시간 20분

• 간단 자기소개
• MFA를 구성하는 과정에서 어떤식으로 구현했는지?
• MFA를 구성하면서 Code Split 같은 최적화 과정을 거쳤는지?
• 여러 디바이스에서 지원하는 서비스인거 같은데, 특정 디바이스에서 에러가 났을 때 따로 에러 모니터링 하는 툴이 있는지?
• Yarn Berry를 사용하면서 어떤 에러를 만났는지?
• 디자인시스템 버전을 changesets을 사용하여 버저닝 했던데 어떤식으로 구성한건지
• 디자인시스템 패키지중 컴포넌트를 제공하는 패키지에서 컴포넌트들이 웹접근성을 고려했는지?
• React-Query를 상태처럼 사용할 수 있는데 어떻게 사용하는지?
• React-Query staleTime과 cacheTime의 차이
• 이벤트 위임이란?
• Recoil을 사용하는 이유
• 당근마켓에 들어오고 싶은 이유
• 프론트엔드는 어떻게 접하게 됐는지?
• 스마트스쿨플랫폼을 개발하면서 여러 작업을 담당했을텐데 서로 역할분담은 어떤식으로 했는지?

당근마켓

note

면접시간: 30분

• 간단 자기소개
• 장 & 단점
• 협업하면서 힘들었던 점
• 전역 상태관리 라이브러리를 사용하면 사용자 입장에서 어떻게 좋은지
• Next.js 동작 구조
• Event Loop (setTimeout 0초 실행하면 내부적으로 어떤지)
• 지원 계기
• Vue React 차이
• 패키지 배포 경험 (오픈소스 좋아한다고 적었었음)
• 최근에 진행한 프로젝트
• 면접관에게 궁금한점

원티드랩

note

면접시간: 1시간 30분

• 간단 자기소개
• intersection observer를 사용한 이유와 장단점
• reflow repaint 최적화에 대해 설명
  • css별로 reflow인지, repaint인지도 설명
• 검색엔진 최적화 경험 과정과 결과 설명
• 프로젝트별 기술스택과 그것을 선정한 이유
• Next.js의 동작 구조
  • getInitialProps, getStaticProps, getStaticPaths, getServerSideProps
• Vue React 차이
• TypeScript 쓰는이유 및 장점
• 개발할 때 어려웠던 점
• 팀원간 갈등 사례와 해결 방안
• 코드스플리팅
  • dynamic import
  • React.lazy
• create-react-app 말고 webpack 직접 설정 경험
• useCallback, useMemo 차이와 쓰는 이유
• GitHub 코드 보고 왜 이렇게 짰는지 설명
• 어떤 개발자가 되고 싶은지
• 지원 계기
• 리펙토링 과제관련
  • 코드의 전반적인 설명
  • container, component 나눈 기준
  • useEffect로 데이터 불러오고 데이터를 리턴하는 커스텀 훅 라이브 코딩
• React 동작 원리
• 이전 면접과의 차이점
• 궁금한점
• next.config.js 구성할 때 withCss에서 클래스 이름에 해시를 적용하려면 어떻게 하는지
  • 해당 작업을 하지 않은 이유
• 이때까지 협업 중 가장 일하고 싶은 동료와 그렇지 않은 동료 (구체적 사례)
• fetch 말고 서버로부터 데이터 불러오는 방법

클래스101

note

면접시간: 1시간 50분

작성된 순서와 면접질문 순서는 비일치

• Redis가 LRU알고리즘을 사용하는 이유
• CS측면에서 메모이제이션
• React의 useMemo
• 자바스크립트에서 사용하지 못한 데코레이터를 타입스크립트에서 사용할 수 있는 이유
• Mobx의 @action
• AWS Lightsail과 EC2의 차이
• 커뮤니케이션의 문제로 힘들었던 경험
• 개발자로서의 자신의 강점/약점
• MVVM
  • MVVM의 모델의 역할
  • MVVM에서 모델과 인터페이스의 차이
• 가장 힘들었던 프로젝트
• 프로젝트를 하며 힘들었던 점 / 해결 방안
• 개발할때 이슈를 해결하려는 방식
• 사용자의 피드백을 통해 기능을 개선한 경험
• 여러가지 언어를 다루며 각각의 패러다임이 달라 익히기 힘든데 쉽게 적응한 본인만의 방법
• 웹을 배포하는 방법
• AWS S3의 동작 방식
• 캐싱
• private 접근한정자를 사용하는 이유
• 컴포넌트와 컨테이너에서 처리하는 로직의 차이
• 프론트엔드에서 단위테스트를 해본 경험
• 통합테스트를 해본 경험
• 본인이 개발할때 참고하는 매체
• SSR과 CSR의 차이와 각각의 장/단점
• 자바스크립트의 순수함수
• 싱글톤패턴
• 코드리뷰의 경험과 진행방식
• 타입스크립트의 enum과 const enum의 차이

피플펀드 컴퍼니

note

면접시간: 1시간 20분

작성된 순서와 면접질문 순서는 비일치

• 간단한 자기소개
• 지원한 이유
• 진행한 프로젝트에 대해 설명해 주세요.
• 전역으로 상태관리를 할때 어떤것을 주로 관리하였는가?
• 핀테크에 대해 잘 알고 있는가?
• MobX에 대해 설명해 보아라
• MobX가 다른 상태관리 라이브러리와 장 단점을 비교해 보아라
• 전역상태관리가 필요한 이유는 무엇인가?
• 문제에 대해 여러 시각으로 접근하여 그 문제를 해결해 본적이 있는가? 있다면 구체적 문제와 해결 답안을 설명해 보아라.
• 회사에 대해 잘 알고 있는가?
• 회사 서비스에대해 단점은 무엇이며 어떤식으로 극복할 수 있을것인가?
• 리엑트를 사용하는 이유
• 리엑트의 최적화 기법을 말해주세요.
• 리엑트의 장점 그리고 단점
• 리엑트를 사용하면서 함수형을 사용할때 장점은 무엇인가
• function() {} 과 () => {} 차이점을 말해주세요.
• 알고있는 자료구조를 설명해주세요.
• 회사에 대해 궁굼한 것을 말해보아라
• MobX를 사용한 이유
• CSS in JS 를 사용하면 어떤식으로 스타일이 적용되는지 말해보아라
• useState가 동작하는 방법
• 피플펀드 컴퍼니를 어떤 경로로 알게되었는가?
• P2P서비스의 장단점에 대해 설명해 보아라
• 서비스를 진행하면서 무엇을 얻었는가?
• 서비스를 진행하면서 힘든적이 있는가? 있다면 왜 힘들었고 그것에 대한 돌파구를 찾는 방법에 대해 설명해보아라
• 팀내에서 개발을 하면 어떤 느낌인가?
• 자바스크립트 동작 구조에 대해 설명해 보아라
• 커스텀 훅을 제작하여 사용해본적이 있는가?
• 협업을 할때 어려웠던 팀원이 있는가? 있다면 어떤 형식의 팀원이 맞지 않다고 생각하는가?

워시스왓

note

면접시간: 50분

작성된 순서와 면접질문 순서는 비일치

• 간단한 자기소개
• 지원한 이유
• 워시스왓에 대해 아는것을 설명해보아라
• 의사소통의 부재로 어려웠던 점은?
• 상태관리 라이브러리를 사용하는 이유를 설명해보아라
• 상태관리 라이브러리를 사용해서 얻는 이점은 무엇인가
• 상태관리 라이브러리를 프로젝트에 어떤곳에 적용하였고 이로 발생한 이점은 무엇이었고 어려웠던 점은 무엇이었는가?
• 상태관리 라이브러리를 사용하면서 느낀점
• 프로젝트를 진행하기 앞서 가중치를 어떤식으로 나누었는가
• SPA중에 리엑트를 선택한 이유는 무엇인가
• 자기 자신에 대해 잘 알고 있는가?
• 미래에 나는 어떤 개발자가 되어있을 것인가?
• 좋은 개발자가 되기위한 조건은?
• 리코일과 다른 상태관리 라이브러리에 대해 차이점을 설명해 보아라
• 알고있는 자료구조를 설명해 보아라
• 알고있는 정렬 알고리즘을 설명해 보아라, 시간 복잡도
• 프로젝트를 진행하면서 맡았던 역할에 대해 설명해 보아라
• 회사에 들어오게 된다면 어느 서비스를 맡아 개발하고 싶은가?
• CS에 대해서도 물어본다.
• SCSS를 사용하는 이유
• 레거시 코드를 보면 어떤생각이 드는가
• Jquery를 사용하다 React를 사용하면 가장큰 둘의 차이점은 무엇이라 생각하는가?
• React에 대한 장점은 무엇이라 생각하는가?
• 가장 의미있었던 코드는 무엇이고 그 코드에 대해 설명해 보아라
• 가장 의미있었던 프로젝트는 무엇이고 그 프로젝트에서 무엇을 배웠는지 상세하게 설명해 보아라

팀윙크

note

면접시간: 50분

작성된 순서와 면접질문 순서는 비일치

• 간단한 자기소개
• 지원한 이유
• 시간복잡도에 대해 설명해라
• 프로젝트에서 상태관리 라이브러리를 사용한 이유
• 상태관리 라이브러리를 어떤 프로젝트에 적용했으며 적용한 이유는 무엇인가?
• 상태관리 라이브러리로 어떤 것을 전역으로 관리 했으며 이로 얻는 이점은 무엇이 있었는가?
• 상태관리 라이브러리로 전역으로 값을 왜 관리하는가?
• Recoil, Redux, MobX 에 차이점에 대해 설명해 보아라
• Recoil에 대해 어떤생각을 가지고 있는가?
• Recoil과 다른 상태관리 라이브러리들과의 차이점을 말해보아라
• Recoil이 어떤 장점을 가지고 있는가?
• 핀테크에 대해 잘 알고 있는가?
• SPA를 사용하면 장점은?
• 스타일 라이브러리를 따로 사용해 본적이 있는가? (부트스트랩, 머터리얼UI 등등...)
• SCSS를 사용한 이유는 무엇인가?
• 자바스크립트 엔진이 돌아가는 방법에 대해 설명해 보아라
• NodeJs가 동작하는 원리에 대해 설명해 보아라
• 스택과 큐에 차이점에 대해 설명해 보아라
• 알고 있는 자료구조를 말해보아라
• JS에서 linkedlist 구현하는 방법에 대해 설명해 보아라
• 팀내에서 역할은 무엇이었고 어떤 것을 진행했는지 설명해 보아라

엔젤스윙

note

면접시간: 1시간

사전 과제를 본 이후 면접을 봄

• 자기소개
• 많은 회사 중 왜 우리 회사?
• 회사에게 바라는 점
• custom hooks의 장단점
• react books 규칙
• MobX 단점
• MobX를 많이 쓴 이유
• redux 장점
• 서버 사이드 렌더링 도구들 설명
• Nextjs의 장점
• 성능 최적화 경험
• 와 React.Fragment 차이
• useMemo, memo, useCallback 쓰는 기준
• 주로 사용하는 프로젝트 구조
• model로 따로 파일 빼놓은 이유
• dependencies와 devDependencies 차이
• cra 말고 webpack 설정 경험
• javascript에서의 scope
• javascript에서의 this
• 마지막 협업 프로젝트 좋았던 점/ 아쉬운 점
• 블로그 글을 작성할 때 기준 / 레퍼런스 사이트
• 전역 상태관리 라이브러리 장점