[7월 우아한테크세미나] 주니어 개발자로 성장하는 우아한 방법들


2020년에 FE개발자가 되기 위한 10가지 방법 by 코드스쿼드 윤지수

“웹은 계속 발전중이군” 이제 우리가 어떻게 대응할 것인가?

1. 현장 이해하고 대응하기

이 부분이 가장 중요하다.

  1. 3가지 특징
  • 함께 일하기
  • 분석, 개발, 테스트, 배포, 피드백, 개선
  • 제품과 서비스의 지속적인 운영
  1. 여기서 발생하는 문제
  • 커뮤니케이션의 어려움
  • 일의 순서 정리
  • 다양한 제약사항
  • 품질과 일정
  • 형상관리
  • 테스팅의 어려움
  1. 채용공고에 대한 우리의 대응 연습은 실전처럼!
  • 기초 프로그래밍 연습 > 미니 프로젝트 > 좀 더 큰 프로젝트 > 같이 할 수 있는 프로젝트
  • 프로젝트를 하면서 모르는 부분을 찾아보자
  • 인턴경험, 알바 경험 등등
  • 경력같은 주니어?

문제 해결 능력 향상

  • 다양한 방법으로 문제를 해결하고 회고하고
  • 디버깅 잘 이해하기 (실질적으로 중요함) 오류메시지를 잘 읽고 대응하고 오류가 발생할 땐 이런 상황에서 발생하는구나를 익히기
  • 다른 사람의 방법도 배우고(페어프로그래밍 등)

2. 프로젝트를 통해서 JS익히기

JS 공부하는 법

  • 책과 프로젝트의 거리감 줄이기
  • 프로젝트를 하면서 언어 책을 함께 공부하자
    • 이런게 prototype이구나
    • closure를 활용해서 이렇게 구현할 수 있구나
    • let, const의 차이가 이거구만

3. 향상된 UX를 목표로 개발하기

  • FE개발자는 사용자와 접점이 된다.
  • 완벽한 코드보다 사용성 향상작업(성능, 매끄러움 등)
  • 사용자가 쓰기에 불편함이 없는 인터랙션 개발
    • 애니메이션
    • 좀더 빠르고 좀더 직관적으로 UX고민, 개선
  • CSS3, DOM, Event, Animation제어, 비동기에 대한 이해

4. 함께 자라기

  • 난 프로젝트를 할 수준은 아닌데?

    • 함께 학습하기
    • 간단한 프로젝트 함께 만들어보기
    • 피드백
  • 피곤하지만 함께 맞춰보기

    • 업무를 분석하고 github issue/project로 일감 만들어서 관리하기
      • 프로젝트 기획서는 없지만 요구사항 분석해서 git issue에 올리기
      • ex) 배달의 민족을 만들겠다! 주문하기 기능 FE사용하기
    • PR 보내기
    • 코드리뷰하기
    • Git branch 전략세워보기
  • 주변에 사람이 없다고?

    • 커뮤니티를 활용해서 사람들과 함께 하기

5. 기초를 튼튼하게

자료구조와 알고리즘

  • 시간 재기
  • 쉬운 문제 많이 풀어보기
  • 같은 문제 다시 풀어보기
  • 다른 사람 풀이 부기

네트워크

  • 웹개발은 클라이언트와 서버 간의 커뮤니케이션
  • HTTP를 중심으로 공부하자. 개발자도구의 네트워크 탭을 다(ALL) 이해해보자
  • HTTP관련 책은 재미도 없고 방대하기 때문에 개발하면서 알게 되는 용어를 찾아서 공부하기 ex) GET, POST 차이 알기

백엔드 접해보기

  • Node.js를 중심으로 웹애플리케이션 서버와 연동해보기
  • DB, OS, 클라우드(AWS) 등의 지식 (우선순위는 낮음)

HTML, CSS에서 FE엔지니어로 점프하는 법!

  • Component 기반 개발이 표준이 된 세상
    • HTML, CSS, JS는 함게 개발해야하는 시대
  • React, Vue를 할 줄 안다고 FE개발자가 되기 어렵다.
    • 바닐라 프로그래밍이 먼저..(이거 더 중요)
  • 프로그래밍 사고 늘리기가 최우선!!!
    • 조건, 반복, 함수를 활용한 호출관계, 모듈을 만드는 방법 등
    • 알고리즘 문제, 쉬운 문제를 많이 그리고 꾸준히 푸는 연습이 필요
    • 자바스크립트 프로그래밍 연습
  • 원하는 웹 사이트 만들기! 꾸미는 재미가 있어야한다

6. 프론트..원래 이럼?

  • 로드맵? 그거 다 하다가 10년 지남
  • 주니어는 다 아는가?가 아니고 무언가를 찐~하게 대할 수 있는지가 더 중요
    • 찐~하게 : 깊이있게 다루기
  • 내가 하고 있는 분야를 깊게 파고 있는가?
    • 웹 사이트를 꾸준히 만들고 피드백을 받으며 개선
    • 많은 프로젝트보다 좀 더 사용성을 올리기 위해, 기능 수정, 속도 향상 등
    • 좀더 나은 코드품질을 위해서 다양한 리팩토링을 시도하고 실험하기

7. React, Vue, Angular

“겉보다 속”

  • 모두 다 할 필요는 없음
  • 바닐라로 훈련이 충분히 된 상태에서 접근
  • 이미 프레임워크를 다루었다면 바닐라로 프레임워크 흉내내보기(어려움)
  • 특정 프레임워크 비의존적인 부분에 대한 학습
    • 상태관리
    • 랜더링 원리
    • 모듈 관리
    • 성능에 유리한 코딩방식
    • 디자인패턴

8. 내가 선택한 길이 맞을까?

  • 열심히 그리고 즐겁게 개발하고 있다면? 틀린길은 없음
  • 나를 믿고 전진하기
  • 이것저것 왔다갔다 안하기
  • 피드백을 받을 수 있는 방법을 찾아보기
  • 다양한 멘토와 코드리뷰
  • 커뮤니티를 활용할 수도

9. 나를 알아봅시다

  • 이력서 써보기
  • 면접 기회 얻어보기

QnA시간에 나온 것

포토폴리오는 눈에 보이는 것보다 git 소스코드, isssue, 블로그 등이 더 중요하다. 현 서비스가 불편해서 개선해보았습니다도 좋다. ex) 쿠팡, 배달의 민족 등의 기능이 불편해서 개선

개발자가 읽으면 좋을 책

개발자 추천도서

느낀점

프로젝트를 진행하면서 많은 프로젝트를 하는 것이 더 중요하다고 생각했지만 한 프로젝트를 수정하고 유지보수하는 것도 중요하다라고 생각하게 되었다. JS를 어떻게 공부하는 지 감이 안 잡혔었지만 꾸준히 문제를 풀고 프로젝트를 진행하면서 공부해야하는 공부법과 웹과 거리가 멀어보였던 네트워크도 천천히 하나씩 꾸준히 배워가려고 한다. 마지막에 개발자가 읽으면 좋은 책들도 하나씩 읽어봐야겠다!!

  • 프로젝트하기
  • 알고리즘 자료구조 공부하기
  • 네트워크 공부하기
  • 책읽기

URL

우아한Tech 2020세미나