코드스테이츠_S1_회고

윤뿔소·2022년 9월 16일
기술면접마인드코드스테이츠회고
0

CodeStates

목록 보기
16/47
post-thumbnail

오늘로서 섹션1은 끝났다.. 오늘은 면접에 대해 체험하고 한달동안 했던 공부 회고를 통해 또다시 학습하는 시간을 가져보겠다.

기술면접

⭐️ 네이버 클라우드에 답 있음 꼭 보면서 정리하자!
우리는 어떠한 작품, 즉 포트폴리오를 만들고 그것에 대해 설명할 줄 알아야한다. 가장 큰 포인트는 '왜 여기서 이것을 사용했는가'이다.

  • 개발에 필요한 지식을 정확하게 숙지
    • 각 기술 스택 / 프로그래밍 언어를 왜 사용하는지 숙지
    • 기초 웹 개발 지식 (HTTP 통신, 네트워크)에 대한 이해
    • HTML / CSS / JavaScript에 대한 이해
    • 본인이 사용한 기술에 대한 이해

등등이 필요하다.
하지만 어렵다. 왜냐면

  • 해당 개념어에 대해서 코드로 칠 줄은 아는데, 무엇이라고 설명해야 하는지 잘 모른다.
  • 어렴풋이 들어만 봤고 실제 그 개념에 대해서 공부해본 적이 없다.
  • 인터넷 블로그 몇 개 읽고 나서 나도 모르게 불명확한 개념을 당연히 받아들이고 있다.

등의 이유로 면접에서의 설명이 불충분하거나 요점이 흐려질 수도 있어 이미지를 깎아먹는다. 그래서 이런 원인을 잘 알고 미리미리 방지해야한다.

정의

'프론트엔드 개발자로서 기술적 직무 역량을 충분히 갖추었는지 판단하는 모든 면접 형태'

  • 이력서 기반 질문형 : 비즈니스에서 기술적 성취가 없는 신입에게 특히 해당, 보통 개발 프로젝트에서 어떤 성취를 이뤘고 과정을 물어봄
  • 기본 개념 질문형 : 면접자가 과연 진짜 이 개념을 잘 알고 응용할 수 있는가? 해당 질문과 관련된 이상의 정보를 답해주는 것도 좋음
  • 알고리즘 문제 해결형 : 알고리즘을 푸는 과정을 관찰해 판단
  • 간단한 실무 문제 해결형 : 실무 관련 문제(JSON 데이터를 브라우저에 보여주기, debounce 구현하기 등)을 제시해 판단
  • 미니 프로젝트 제작형 : 면접 보기 전 2~3일 전에 과제를 제시해 결과물 보기

즉, 같이 일할 수 있는가? 정말 잘 아는가? 정말 잘 하는가?를 판단한다는 거고, 면접자 입장에선 내가 정말 잘 아는지, 잘 하는지 간단명료하게 설명할 수 있나?가 주된 목표이다.

면접 준비 방법

  1. 제시되는 단답형 질문이나 본인이 작성한 프로젝트 기술 면접 질문에 대한 짧은 정답을 작성
    • 스코프에 대해서 설명하세요: 변수가 접근할 수 있는 범위, 어떤 스코프에 외부 스코프의 변수는 접근 가능, 내부는 불가능
  2. 해당 질문의 꼬리 질문 예상
    • function scope, block scope의 차이
    • lexical scope와 dynamic scope의 차이
    • var 키워드는 어떤 스코프를 가지게 만드나?
  3. 다른 사람의 답변을 보고 학습
    • 구글링을 통한 정리보기
    • 물론 당연히 거를 건 걸러야겠지? 보고 블로깅하며 기록하기

실습

아래 실제 질문들을 통해서 정리해보자

HTML

  • 일반적으로 CSS를 불러오기 위해 <link> 요소를 <head> 요소의 자식 요소로 하고, JavaScript를 불러오기 위해 <script> 요소를 <body> 요소가 끝나기 직전에 위치시키는 이유가 무엇인가요?
  • <li> 요소는 왜 <ul> 요소의 자식 요소여야만 하나요?
  • id 속성과 class 속성의 차이에 대해서 설명해주세요.

CSS

  • CSS box model에 대해서 설명해주세요.
  • 간단한 로그인 폼 컴포넌트를 가운데 위치시키려면 CSS를 어떻게 작성해야 하나요? (centering)
  • 간단한 블로그에서 아래와 같은 레이아웃을 구성하려면 CSS를 어떻게 작성해야 하나요?
div.author-container
+--------+------+------+
|  글쓴이 | 빈칸  | 공유 |
+--------+------+------+

JavaScript

  • 스코프에 대해서 설명해주세요.
  • 배열, 객체를 const로 선언했는데 요소나 속성을 추가할 수 있는 이유에 대해서 설명해주세요.
  • 원시 자료형과 참조 자료형에 대해서 설명해주세요.
  • 얕은 복사와 깊은 복사에 대해서 설명해주세요.

DOM

  • innerHTML 메서드와 textContent 메서드의 차이에 대해서 설명해주세요.
  • event.preventDefault 메서드는 언제, 왜 사용하는지 설명해주세요.

예시

  • 위에 쓴 면접 준비 방법을 통해 어떻게 기록할지! 무조건 간단 명료하게!
  • 제일 첫째는 결론 + 자세한 설명임
  1. 답변을 한마디로 작성
    • 클로저 설명하세요 : 함수와 함수가 선언된 어휘적 환경의 조합입니다.

2.해당 질문 중요한 포인트, 추가 정보 기술

  • 어휘적 환경이 뭐죠?

    함수가 선언된 주변 환경을 의미합니다. 주로 외부 함수(outer function)의 변수가 내부 함수(inner function)의 어휘적 환경에 포함됩니다. 그래서 내부 함수가 리턴되어도 나중에 클로저의 어휘적 환경에 접근하여 외부 함수의 변수에 접근할 수 있습니다.

  • 그래서 클로저를 언제 쓰나요?

    클로저는 사실 자바스크립트의 어떤 함수든 가지고 있습니다. 어떤 함수든 전역 변수에 접근할 수 있기 때문입니다. 그래서 언제나 쓰이고 있습니다.
    자바스크립트에서 private 메서드를 구현하기 위해서도 클로저를 활용할 수 있습니다. 클로저 내에 있는 변수는 외부에서 접근할 수 없기 때문에, 클로져 내에 있는 변수를 활용 할 수 있는 private 메서드만 따로 노출시켜서 인터페이스처럼 사용할 수 있게 됩니다.

  1. 무조건 면접 답변 직접 녹화하고 스스로 피드백
    • 처음엔 답변을 슬쩍 보며, 익숙해졌다 싶음 질문과 답변 키워드만 보며 기술, 마지막엔 질문만 보며 숙지하며 기술
  2. 체크리스트: 참고
    • 잘 모르는 내용에 대해서 모르는 부분을 인정하고 아는 부분까지는 최선을 다해 설명하려고 노력했나요?
    • 추측성 단어(~같아요.)가 아닌, 자신감 있는 단어(~입니다.)로 답변하고 있나요?
    • 한 번 들었을 때, 이해하기 쉬운 답변인가요?
    • 몸을 베베 꼬거나 다른 데를 보거나 하는 나쁜 자세를 취하지 않았나요?
    • 질문을 잘 이해하고, 질문의 요지에 정확하게 답변했나요?
    • 해당 개념 설명이 간단 명료한가요?
    • 개념 설명과 예시가 단순 암기가 아니라 자신의 언어로 충분히 풀어 설명 되었나요?
    • ⭐️두괄식으로 개념을 설명하고, 그에 따른 예시를 풀어서 설명하고 있나요?
    • 개념 활용 예시가 구체적이고 풍부했나요?
    • 잘 모르는 내용에 대해서 불명확하게 설명한 부분이 있었나요?
    • 정확한 CS 용어(ex. 변수를 만들어서 값을 넣어요. → 변수를 선언하고 값을 할당합니다. 등) 를 사용해서 답변했나요?

회고

노션에 작성해 놓았다. 댓글도 꼭 보자 힘이 된다.

소감 : 인생 쓰다

뭐 했다고 벌써 섹션 1이 끝났다. 내가 뭘 배운거지 싶기도 하면서도 배우느라 힘든 하루였다.

나는 상경 계열에 다양한 경험이 없는 사람이기에 나에겐 엄청 썼다. 안그래도 직종을 아예 바꿨을 뿐더러 이제 전역하고 뭐 좀 하겠다고 하는 데 불안감도 들고 그랬었다.

하지만 이번 섹션 1을 하면서 코딩을 배우며 얻는 성취감, 몰입을 통해 불안감이 조금 해소 됐고, 내가 나태해질까 걱정했던 것보다 집중하는 내 자신이 대견하면서 뿌듯함을 느껴 더더욱 이 길로 정하는 마음을 다졌다.

물론 코플릿, 과제, 스터디원 분들과 알고리즘 공부, 나 혼자 프로젝트 등등 많은 이벤트들을 겪어내며 좋은 것만 있진 않았다. 생각보다 어려운 난이도에 ‘말리꽃’처럼 지쳐 쓰러질 때도 있었고 ‘이걸 몰랐냐 난 바보다.’라는 자조적인 마인드를 가질 때도 있었다. 겨우 한달 공부했는데 이따구 마인드면 뭘 해먹고 사냐만은 그래도 그런 마음이 들때가 있었다.

하지만 내 인생에서 이렇게 열정적으로 몰입한 적은 얼마 없었다. 또 내가 지금 느끼는 감정은 부정적인 감정보다 긍정적인 것이 더더욱 크다. 공부하는데 이랬던 적은 처음이라 신기하기도 하다.

이제 그동안 했던 이벤트들에 느꼈던 나의 감정과 아쉬움, 계획을 써보겠다!

Section 1 회고

1. 목표 회고

이 분야로 전환하기 전에는 나의 목표는 사실 ‘재미’다. 물론 지금도 같다.

상투적인 의미의 ‘재미’는 그다지 가벼워보이겠지만 나에겐 아니다.

이러한 ‘재미’는 사람마다 다르겠지만 나에겐 되게 무거운 주제이다. 설명하기엔 길어서 짧게 요약하자면 결국 ‘재미’는 내 자아실현으로 귀결된다.

그렇게 생각을 쌓아오던 도중 나는 이 분야를 아버지를 통해 발견했고, 거기에서 여러 재미를 느꼈다.

  1. 내가 직접 무언갈 만든다는 것, 그 것이 내 눈에 보인다는 것
  2. 프론트 엔드는 개발만 하는 것이 아니라 사용자, 디자인, 기획 다양한 측면에서 오는 개발을 하는 것

등등의 이유들로 ‘재미’를 느꼈고 결국 이 길로 들어서게 되는 계기가 됐다.

여기에서 나의 목표에 대한 결론을 도출해낸다.

나는 내가 만들고 싶어하는 걸 만들 때 가장 재미를 느낀다. 그러므로 나는

내가 생각한 것을 구현하여 가치를 창출하는 개발자가 되고싶다.

라는 목표를 정했다.

2. 유지 / 습관

그러면 목표를 위해 어떻게 유지(습관)했는지 알아볼 차례이다.

Good

  1. 복습
    나는 복습을 제일 싫어했는지라 수업시간에 빡세게 집중하고 끝나면 노는 사람이었는데 아니었다. 오늘 했던 내용을 다 끝내야 맘이 편하더라.
  2. 기록
    이건 공부하는 것 뿐만 아니라 전역하고 ‘나에 대해 기록을 해야겠다.’라고 다짐해서 쓰는 이유도 있다. 하지만 공부하기 시작하면서 많이 쓴 건 맞다.
  3. 카페
    카페는 시끄러워서 공부가 안된다고 생각했는데, 환경 측면에서 집과 카페을 구분지으니까 오히려 집보다 카페에서 공부하는 것이 더 도움되고 몰입도 잘된다. 그래서 스벅 자동충전했다!

결론 : 생각보다 몰입이 잘된다. 더더욱 효율적으로 몰입하게 만드는 환경과 요소를 더 개발해야겠다.

Bad

  1. 운동 부족
    일주일에 5번은 가던 운동을 1~2번밖에 안가게 됐다. 솔직히 공부 시작하며 공부한답시고 안간게 여러번이다. 알다시피 이건 핑계다.
  2. 정보성 글쓰기, 체계적인 글쓰기 부족
    생각보다 내 글쓰기 솜씨가 형편없다. 자세하거나 간단히 직관적이거나 컨셉을 잡고 정보 전달에 맞게 써야하는데 좀 부족한 경우가 많아 여러번 고쳐쓴다.
  3. 열정 부족
    솔직히 아직까지 열정 부족이다. 내 실력도 아직 부족한 거 같은 생각을 떨칠 순 없다.

결론 : 일단 열정 부족이 제일 크다. 끌어올릴 땐 더더욱 끌어올려 효율적으로 몰입하게끔 목표 잡자.

3. 결론 : 시도할 것들

내가 유지할 것과 포기해야하는 것들을 우선순위로 통해 계획을 세워보자

  1. 열정을 끌어올리기 위해 너무 큰 목표가 아닌 작은 목표들을 세워보자
    1. 나만의 아고라 스테이츠 기능 추가 (자주 커밋)
    2. 당근과 채찍으로 나만의 습관화 달성 (플스)
    3. 벨로그를 보며 내용 복습, 부족한 것에 대한 학습 (추가 학습)
  2. 효율적인 몰입을 위하여 수단과 방법을 가리지 말자
    1. 작은 규칙 세우기
    2. 규칙적인 몰입과 휴식을 가지기 (뽀모도로 타이머)
    3. 운동을 통해 체력을 키워 몰입의 질 올리기
  3. 그렇다고 나를 돌보지 않으면서 빡세게 하지말기
    1. 휴식은 제대로 취해주기(수면)
    2. 재밌게 공부하기
    3. 행복하기

마무리

이제 시작이다. 어차피 다 행복하자고, 나에게 좀 더 맞는 일 하자고 하는 거다. 고진감래다.

행복을 위해 나에게 책임을 다 할 용기가 있기를 바라며 글을 마친다.

잡설

다 이해하려고 하면 10년 이상은 걸리더라,, 그래서 사용법만 알고 넘어가는 게 중요하다. 또 그냥 넘어가는 것이 아니라 꼭꼭!! 뭘 모르는지 뭘 아는지 기록하는 것이 중요하다!!!@

🦏

profile
윤뿔소
코뿔소처럼 저돌적으로
이전 포스트

코드스테이츠_4주차_목, 금

다음 포스트

코드스테이츠_S2U1_5W_화

0개의 댓글