면접을 준비하면서 알게 된 것

모든게 다 알쏭 달쏭하다.

이번 면접은 과제 면접 이후에 기술 면접을 보게 되었다.

1. 과제면접
   • vue나 jquery를 이용해 주어진 이미지를 보고 일주일 안에 페이지 구현하기
2. 기술면접
   • 내가 짠 코드 설명하기
   • 자바스크립트 기초 지식
   • 회사에 궁금한거 질문

처음 보는 면접이다 보니 과제 면접부터 모든 것이 다 알쏭 달쏭했다. 처음에 jquery를 이용해서 프론트 앤드를 만들라고 했을때, 바로 질문이 하나 생겼다.

이 회사는 jquery를 계속 사용할껀가?

이전 회사에서도 햄버거 메뉴를 만들라길래 바닐라 자바스크립트로 짰더니, jquery 복사해서 붙여 넣으면 될것을... 이라는 핀잔을 들은 터라 뭔가 더 거부감이 들었다. jquery를 가져다 붙여 넣으면서 입이 대자로 나왔었다. jquery를 사용하는 것에 대한 거부감이 아니라 복사 붙여넣기를 하라는 말이 너무 싫었다. 대학교에서 시험 볼 때도 항상 말미에 내 생각을 쓰곤 했는데...(편지도 내 생각이다. 물론 D를 맞았다.) 그래서 한번도 사용해보지 않은 vue를 부랴부랴 펼쳐놓고 최대한 바닐라로 작성하려고 했다. 하지만 pug와 scss를 사용해서 html과 css를 관리했다. 어쨌든 부랴부랴 과제를 제출하고 드디어 기술면접을 보게 되었다. 머리가 터질듯 아파왔다. 도데체 뭘 어떻게 어디서부터 시작해야하는걸까?

구글하기

구글을 바로 시작했다. 일단 프론트 앤드 면접을 검색해서 무엇을 물어볼지 예상 질문을 찾는 것부터 시작해야했다. 예상 질문을 보고 좀 멍했다. 내가 지금까지 배웠던 자바스크립트의 지식을 대부분 물어봤다. 그런데 문제는 제대로 설명할 수 있는게 몇 개 없었다.

그냥 공부하지 않고 대략적으로 설명할 수 있었던 것들

• 이벤트 루프
• 싱글 스레드
• 바벨, 폴리필, Nodejs, NPM, ESLint, Prettier란?
• SPA과 SSR, CSR

들어는 봤고 공부도 했지만 사용해 본적이 없고 전혀 설명할 수 없었던 것들

• 함수, 객체 지향 프로그래밍이란?
• bind, call, apply
• 스코프 체인과 클로저
• RESTful API
• SEO

사용은 해봤지만 원리를 생각해보지도 않았고 설명도 못하는 것들

• 이벤트 등록, 동작 방법, 이벤트 위임이란?
• map, filter, reduce
• DOM이란? 가상 DOM이란?
• 콜백, 프러미스, async, await란?
• CORS(SOP, ACAO)
• 쿠키와 세션
• 로컬 스토리지, 세션 스토리지란?
• 화살표 함수란?
• 브라우저 동작 원리
• HTTP
• this란?
• 웹팩이란, 모듈 번들러가 뭔지?

들어본적도 없는 것들

• CI, CD란?

기본적인 질문이지만 생각이 많이 필요했던 질문

• 1분 자기소개
• 퇴사 이유
• 프론트 앤드 개발자가 되려는 이유
• 학습 방법과 정리하는 방법
• 웹 서비스를 만들어본적이 있나? 사용성 개선을 위해 고민해봤던 것은 무엇인가?
• 자바스크립트 프레임워크를 써봤는지, 무엇을 쓰는지, 그것의 장점과 단점은?
• 프런트 앤드 성능 최적화란? 프런트 앤드 성능 최적화 경험이 있는지?
• 기획, 디자인, API개발 프런트 앤드 개발의 서비스 절차에서 프런트 앤드 개발자의 역할은?
• 웹 서비스를 기획부터 베포까지 모두 스스로 해본 경험이 있는가?

질문들을 보고나니까 머리가 하얗게 질렸다고 해야하나. 나 그래도 개발자가 알아야하는 33가지 자바스크립트 개념이라는걸 보면서 열심히 공부했다고 생각했는데 생각보다 설명할 수 있는거나 자신있게 대답할 수 있는게 없었다. 휴... 나 뭐하는거지?

면접 준비

이것도 구글해야한다. 보통 한개의 개념을 설명하기 위해서 아티클 3-4개정도 보고 유튜브 동영상도 2-3개씩 봤다. 덜 완성된 모자이크 창문에 다시 반짝이는 유리들을 붙여서 아름다운 스테인 글라스 창문을 만드는 과정이었다. 공부하면서 한숨만 나올줄 알았는데, 막상 한개씩까서 이해한 것들을 정리하는 과정이 재미있었다.
예를 들어서 this를 공부하면 자바스크립트의 this가 다른 언어와 다르다는 것을 알게 되고, this의 동작 원리를 이해할 수 있게 되었다. 당장 this를 쓰고싶은 충동이 들었다.(ㅋㅋ) 그리고 화살표 함수에 this와 일반 함수에서 this와 다르게 동작 하는 것을 알았지만 왜 그런지는 잘 몰랐다. 사실 지금도 그냥 화살표 함수에는 this가 없다정도만 알 뿐이다. 그래서 스코프 체인 안에서 화살 표함수의 this는 항상 달라지는 정도만 안다. 뭐 어쨌든 예전부터 bind, apply, call도 궁금했는데 세트로 공부할 수 있었다. this를 아직 활용해본적은 없지만 어쨌든 this를 쓰면 그래도 엉망으로 급급하게 작동하는 것에 맞춰서 쓰지는 않을 것 같다.

내가 회사에 하고 싶은 질문들

실재로 했던 질문과 준비는 했지만 물어보지 않은 질문이 있다. 물어본 질문은 그냥 모두가 생각할법도 하고 평이한 질문이라고 생각한다. 생각은 했지만 안한 질문은 회사 면접에서 탈락한다고 하더라도 뭔가 힌트를 얻거나 지금 내가 개발자로 고민하고 있는 부분이라 물어보고는 싶었다. 하지만 거기까지...

실재로 했던 질문

• jquery 계속 쓸껀지.
• 프론트 앤드 개발자는 몇명인지
• 회사의 회의는 몇회정도 있는지, 회사의 의사 결정 구조는 어떤지 등
• 회사의 자랑할만한 복지는 무엇이 있는지(구인, 구직란에 다 나오지만 그냥 분위기를 풀어 보고싶어서 질문했다. 그런데 뭔가 꼬인느낌...)
• 기술 지식 공유는 어떻게 하는지, 코드 공유는 어떤 방법으로 이루어지는지
• 회사가 현재 개발하고 있는 서비스에 대한 질문 한가지
• 회사 기술 블로그 읽고 궁금했던거 한가지
  • 이 질문을 한 이유는 내가 회사에 들어가면 개발 부서에서 어떤 일을 하게 될지 궁금해서 했다. 데이터를 이미지화 해야하는 일을 하는지 버튼이나 UI의 형상을 만들고 관리하게 되는지 등등...

이거 말고도 물어볼께 정말 많았지만 물어봐도 되는건지 좀 말설여진 질문들도 있다. 그리고 그렇게 많이 질문을 해도 되는건가 싶기도 했다. 사실 그렇게 되면 고민 공유하는 것 같은 느낌이 되기 때문이다. 또 다른 질문은 정말 그냥 내가 홈페이지를 만들다가 들었던 질문이라 어떻게 해결할 수 있을지 궁금했지만 물어보면 '그건 지원자님이 고민해야하는 문제인것같은데...'라거나 '아니 프론트앤드 개발자가 백앤드 지식을 더 물어보네?'라고 생각할 수도 있을 것같아서 걍 접었다.

생각은 했지만 안한 질문

• 좋은 코드를 만들기 위해서 어떻게 공부해야할까?
• 새로운 기술이 계속 물밀처럼 쏟아지는데 어디서 정보를 얻고 회사에 적용할 때는 어떤 과정을 거쳐 적용할지 말지를 결정하게 되는지
• 프론트 앤드 개발자로써 회사를 떠나야할 때는 언제라고 생각하시는지
• 어느 분야의 PM이 되기 위해서는 어느정도의 능력을 갖춰야하는지 (단지 연차 짬으로 PM이 된다고 생각하지 않아서)
• 디자인 패턴은 신입이 어느정도까지 알아야하는지
• 알고리즘과 자료구조는 계속 공부는 하고 있는데 실무에서 어느정도나 사용되는지
• 코드 피드백은 어떻게 이루어지는지
• express에서 구조가 계속 반복되는데 개인적으로 이게 너무 비효율적이라고 생각하는데 이러한 부분은 어떻게 관리를 해야하는 건지, 객체화나 함수로 추상화가 가능한건지(경험이 없으니까 궁금하긴하다. 반복되는 try{}catch{}가 정말 짜증나긴 한다.) 궁금하다.

작성한 코드를 설명해보세요.

순간 너무 당황했다. 수동적으로 질문해주는 것을 단순하게 답변하는 자리일 줄 알았기 때문이다. 노트북을 꺼내서 airplay에 연결하는 동안 어떻게 설명할지 고민했다. 결과는 횡설수설...

내 예상

• json-server를 사용한 이유?
• 왜 computed를 사용했나요?
• watch와 computed의 차이점은?
• component 구조를 저렇게 설계한 이유가 뭔가요?
• router에서 :id로 url을 넘기는데 왜 데이터가 id에 따라 변환되지 않는지
• 이미지 슬라이드는 트렌지션을 적용하지 않은 이유는?
• 구글맵을 구현할 때, npm 패키지를 사용한 이유는 무엇인지? 바닐라로 구현하지 않은 이유는 무엇인지?

실재로 대답한 것

• json-server로 데이터를 끌어온 이유
• 왜 vue3를 사용했는지
• components 구조(이건 설명하다 말았다. 완전 망했다.)

물어본것

• pug와 scss를 사용한 이유

결과는 탈락 그래도 만족한다.

집에 오면서 크리티컬한 질문들이 마음에 걸렸다. 사실 다른건 준비한것을 그냥 대답한 수준이었고, 실재로 사용해본 여부는 별로 궁금해하지 않으시는 것 같았다. 물론 중간에 내가 '그냥 궁금해하지 않았었지만 면접 준비하면서 새롭게 알게된 사실인데요...'라고 열면서 질문에 답해서 그랬을 수도 있다. 생각해보면 왜 그렇게 솔직하게 이야기했는지 모르겠다.

그밖에 회사 문화에 적응 가능한지 파악하는 질문을 몇개 하셨는데, 이 부분을 잘 대답하지 못했다. 이건 마인드 문제였다. 면접 끝나고 배웅을 받으며 걸어가는데 '100% 떨어졌구나'라는 생각이 들었다. 집에 오면서도 계속 생각났다. 그래도 내가 어떻게 어떤 거짓말로 포장해서 둘러댔어도 횡설 수설 했을 것이라고 생각한다. 크리티컬한 질문은 항상 준비가 필요하다. 그렇다고 합격해도 가고 싶은지도 불명확했다. 회사가 내 질문에 대답한 것들이 좀 의외의 대답들이 많았기 때문이다.

하지만 만족한다. 조금 더 나를 점검할 수 있는 시간이었다. 생각해보면 웹 서비스를 만들면서 '이랬으면 좋겠어'하는 것들을 만들지도 못한채 그냥 이렇게 하는게 맞지 않을까? 했는데 면접을 준비하면서 적용해보고싶은 것들이 생겨났다. 또 개념을 명확히 모르고 쓰는 것들이 너무 많았다. 지금까지 에러를 만나면 구글하거나 stackoverflow에서 보고 적용하기 바빴다. 하지만 작동 원리에 대해서 고민한것과 하지 않은 것은 명확한 차이가 있다. 고민해보고 찬찬히 뜯어본건 어느정도 내 것이 됐다.

앞으로 좀 막막하긴 하다. 대부분 경력자를 뽑거나, 회사가 개발하고 있는 서비스에 많은 흥미가 없거나, 진짜 들어가고싶다 하는 곳은 요구 사항이 높다. 예전에 멘토링 하면서 들었던말이 '좋은 개발자가 많이 없다.'는 말을 들었다. 양산형 프론트 앤드 개발자가 아니라 내가 작성하는 코드를 고민하고 앞으로 좋은 코드를 작성하는, 회사 생태계 교란종이 되지 않는 그런 개발자가 되고싶다. 그런데 내가 그런 개발자인지는 잘 모르겠다. 하지만 면접에서 떨어졌다고 좋은 개발자가 아닌것도 아니다.