본문 바로가기
프론트엔드 개발/커리어

01. 프론트엔드 입문, 4개월 간의 여정

by cozyzoey 2020. 12. 17.

프론트엔드 신입 개발자 취업에 대한 기록을 남겨보려 합니다.

 

저는 비전공자입니다. 나이도 적지 않구요.

쉽지 않은 선택들을 하면서 기록을 남기는게 의미도 있고 재밌을거란 생각이 들었어요.

 

저는 학부에서 기계공학을, 대학원에서 디자인을 전공했어요.

한번은 대학원에서 자율주행 배달 로봇을 만드는 프로젝트를 하게 되면서 개발에 발을 들여놓게 됐죠.

지금 생각해보면 개발 체질을 단련할 수 있던 계기였던거 같아요.

로봇을 계속 할까 하다가 어차피 개발이라면... 프론트엔드 분야가 더 끌리더라고요.

 

2020년 8월 중순부터 프론트엔드로 커리어 전환을 결심한지 4개월이 흘렀네요.

 

결정을 내리고 본격적으로 공부에 돌입하기 앞서 여러 선택지들에 고민이 되더라구요.

국비지원교육, 유료 인강,  코딩부트캠프...

그런데 당시 코로나 때문에 오프라인 교육도 온라인으로 전환되는 추세였어요.

그리고 저는 특별히 React와 Node를 하고 싶은데 코딩부트캠프는 너무 비싸고...

국비지원교육은 그런 교육과정이 없더라구요.

 

 

그러면 그냥 독학으로 하자.

 

 

고민 끝에  독학을 결정했지요.

다행히 개발 관련해서 참고할수 있는 자료가 정말 많더라고요. 특히 해외 자료들.

udemy 인강, 유튜브, 각종 블로그 글과 웹사이트를 참고했어요.

 

HTML과 CSSINTERNETING IS HARD(www.internetingishard.com/)와 FreeCodeCamp(www.freecodecamp.org/)에서 익혔어요.

JavaScriptFreeCodeCamp의 챌린지들이 도움이 많이 됐어요. 막히는 문제는 다른 사람들 코드를 참고했는데 그러면서 많이 배웠죠. 웨스 보스의 JavaScript 30(javascript30.com/)도 좋았구요.

공부하면서 배운 내용은 Joplin이라는 노트 앱에 기록했어요. 

정리를 해놓으니 든든하고 그때그때 참조자료로 활용을 잘 하고 있어요.

 

이후에는 udemy 강의들 큰 도움이 됐어요.

안젤라 강의로 풀스택 웹개발에 대한 전체적인 기본기를 다지고, 스테판을 통해서 React와 Redux를 배우고, 조나스를 통해서 Advanced CSS와 Responsive Design과 SASS를, 브래드를 통해서 MERN(MongoDB, Express, React, Node) 스택을 사용한 풀스택 프로젝트를 했어요.

1-2만원에 이런 강의를 들어도 되나 싶을 정도로 좋더라고요.

어려운 개념들이나 더 공부하고 싶은 것들은 youtube나 각종 블로그 글들을 참고하면서 병행했구요.

 

 

www.udemy.com/share/1013gG/

 

The Complete 2020 Web Development Bootcamp

Become a full-stack web developer with just one course. HTML, CSS, Javascript, Node, React, MongoDB and more!

www.udemy.com

www.udemy.com/share/101WcY/

 

Modern React with Redux Training Course

Master React v16.6.3 and Redux with React Router, Webpack, and Create-React-App. Includes Hooks!

www.udemy.com

www.udemy.com/share/101Wkw/

 

Advanced CSS and Sass: Flexbox, Grid, Animations and More

The most advanced and modern CSS course on the internet: master flexbox, CSS Grid, responsive design, and so much more.

www.udemy.com

www.udemy.com/share/101WIo/

 

MERN Stack Front To Back: Full Stack React, Redux & Node.js

Build and deploy a social network with Node.js, Express, React, Redux & MongoDB. Fully updated April 2019

www.udemy.com

 

 

마지막에 들은 브래드의 MERN 풀스택 강의는 온라인 쇼핑몰을 만드는 것이었는데 양이 상당히 방대했어요.

회원가입, 회원관리, 상품관리, 결제, 상품리뷰...

수업 자체도 코딩, 코딩, 코딩이다보니 지루하기도 했어요.

그래도 마치고 나니 뿌듯하고 전체적으로 정리가 된 느낌이 들더라고요.

또 강의에서 Postman을 사용해서 API Request 테스트를 많이 했는데 유익했어요.

 

 

이제 내 프로젝트를 만들어보자!

 

 

MERN 수업까지 들었는데 나도 뭔가 만들어야 하지 않을까 근질근질하더라고요.

가장 먼저는 출석체크 앱을 만들어 봤어요.

매주 교회에서 출석 보고를 하는데 번거러워서 필요한 서비스라고 느꼈거든요.

Node.js를 제공하면서 무료로 웹사이트를 배포할 수 있는 heroku에서 배포했지요.

페이지를 넘기면서 폼을 작성하는 wizard form을 구현해보고 싶어서 Formik이라는 리액트 라이브러리를 적용해봤어요.

 

 

durein.herokuapp.com/

 

DURE인

 

durein.herokuapp.com

 

초기에는 개발 공부도 재밌고 걱정보다는 기대감이 컸던거 같아요.

그런데 공부기간이 길어질수록 문득문득 미래에 대한 불확실, 불안함에 사로잡힐 때가 있었어요.

그럴수록 더 공부에, 지금 해야 하는 것에 집중하려고 노력했던거 같아요.

 

이제 차근차근 제 포트폴리오도 채워나가고 채용공고도 살펴보려 합니다.

댓글