SSAFY 1학기를 마치고, 이제야 진로를 정하게 된 나는 새로운 마음가짐으로 공부를 해야겠다고 판단했다. 그래서 방학이 마무리되고 있는 오늘부터라도 프론트엔드 공부에 전념해야겠다... 이 글이 시발점이다!

📌 프론트엔드 개발에 필요한 기술

• HTML : tags & attributes, Semantic web
• CSS : Layout(float, flex, grid), transition/animation, 반응형 웹, Preprocessor(Sass, PostCSS), CSS 방법론, CSS 프레임워크
• 크로스 브라우징
• JavaScript : ES5, ES6, ES Next, DOM/Event, Ajax, 동작 원리(브라우저, 자바스크립트 엔진), node.js
• HTTP
• Tools : Git, Webpack, Babel, ESLint, npm...
• Library / Framework : SPA(Angular, React, Vue.js), TypeScript, JQuery, Lodash, Axios...
• TDD(Test Driven Development) : karma / jasmine, mocha, chai
• 알고리즘 / 자료 구조

✏️ 순서가 있다면...?

학습에는 다 순서가 있다!

• Frontend Roadmap
• poiemaweb

📌 초심자가 경험하는 3가지 어려움

1. 책이나 수업의 내용이 무슨 말인지 하나도 모르겠다. 주변 개발자의 말을 알아 들을 수 없다.

• 배경 지식 : 기본적 CS 지식 + 용어에 대한 이해 + 기본 상식

2. 어떻게 만들어야 할 지 감조차 오지 않는다.

• 문제 해결 능력 : 문제(해결과제)가 무엇인지 알아채는 능력 + Computational thinking + 알고리즘/자료 구조 + 경험
  • *문제 해결 능력 = 해결 과제(문제/요구사항)의 명확한 이해 → 복잡함을 단순하게 분해 → 자료를 정리하고 구분(Modeling) → 순서에 맞게 행위 배열

3. 어떻게 만들어야 할 지는 알겠는데 막상 코딩하려니까 한 줄도 못 짜겠다. 인터넷에서 긁어온 코드를 도무지 수정할 수 없다.

• 구현 능력 : 문법에 대한 정확한 이해 + 연습

📌 효율적인 프로그래밍 학습 방법

그런 것 없다! 의식적인 연습을 꾸준히 반복하는 만큼 성장한다.

단순 반복 != 의식적인 연습

• 라이브 코딩 감상과 예제 단순 타이핑은 연습이 아니다. 현재 자신의 능력으로 쉽게 해결 가능한 것을 반복하는 것도 연습이 아니다.
• 자신의 능력을 살짝 넘어서는 도전을 지속적으로 시도하는 것이 연습니다. 쉬운 도전은 지루하고 무모한 도전은 불안감만 준다.
• 시행착오(a.k.a. 삽질)은 "무엇을 알고 무엇을 모르는지"를 알게 하는 개발자의 벗이자 선생님이다.
• 무엇을 모르는지 알았다면 몰랐던 것을 알기 위해 "시도하고 실패하는 의식적인 연습을 반복"한다.
• 하지만 모르는 것이 너무 많다. 베이스가 되는 것부터 구체적인 목표를 수립하고 학습하고 작은 성취를 반복하자.
• 수박 겉핥기식 학습도 문제지만 본질에서 벗어난 학습도 문제다. 적절한 지점을 찾아내 균형을 잡는 것도 능력이다.
• 피드백에 겸손하고 적극적으로 반응하여 행동을 교정하라.

📌 마음가짐

• 서둘지 마라. 이제 출발선에 선 것이다. 성과를 내기엔 이르다.

• 두려워하지 말고 시도하여 실패하자. 실패는 영원하지 않다.

• 사람은 잘 착각하고 또 잘 잊는다. 기록하고 수정하자

• 기본기가 중요하다. 당신은 프로이다.

• 일을 좋아하자! 좋아하면 괴롭지 않다. 즐겁게 일하는 자를 이길 자 없다.

• 호기심을 갖자. 이유를 알고 싶지 않은가? 설명할 수 없으면 모르는 것이다.

• 꾸준히 하자. 평생