웹 개발자 기본 커리큘럼 정리

2018-07-13 글 내용 전체 수정

본래 이글은 HTML에 관련된 내용이 포스팅 되어 있었으나 세상에는 더 좋은, 그리고 정확한 내용의 문서가 아주 많기 때문에 더이상 적을 필요가 없다는 생각이 들어서 거꾸로 웹 개발자가 되기 위해 올바른 기본 지식을 정리해 놓는 것이 좋겠다는 생각을 하게 되었다.

나 또한 올바르고 기본이 탄탄한 개발자가 아니었고.. (현재도 아닐수도 있겠지만) 모자른 부분을 점점 채워 나가고 나의 올챙이적 시절 어려움을 누군가는 빠르게 해결해 나갔으면 하는 바람으로 이 글을 수정하게 되었다.

  

 

일단 이글은 Web Developer Roadmap - 2018 이라는 문서를 보고 그에 기반해서 정리하게 되었다.

말 그대로 누군가가 웹 개발자라면 거쳐갈 로드맵을 마늘어서 정리 해놓았는데.. 그 내용이 생각보다 괜찮다고 느껴져서 정리하게 되었다.

이 로드맵이 최단거리이거나 정답은 아니지만 적어도 틀린 길은 아니라는 뜻

프론트 엔드

1~3

https://developer.mozilla.org/ko/docs/Learn/Getting_started_with_the_web

웹 개발자의 가장 기초가 될 수있는 항목인데. 가장 보편적이면서도 심플하면서 정확한 내용은 MDN에 있었다

다른 생활 코딩이라던가 인프런 같은 플랫폼도 좋지만.. MDN은 내가 본 기초 강좌중 가장 간결하고 심플하면서도 초심자에게 꼭 필요한 내용이 전부 들어있다고 생각한다. 강추

 

기본 소프트 웨어는 크롬이나 파이어폭스 정도를 쓰고, IDE는 atom이나 vscode 정도면 되고.. 따로 서버를 설치할 필요는 없을듯. 

4 

https://developer.mozilla.org/ko/docs/Web/Guide/CSS/Media_queries#%EB%AF%B8%EB%94%94%EC%96%B4_%ED%8A%B9%EC%84%B1

반응형 웹 사이트는 이제 트렌드가 아닌 거의 필수가 되어 버린 느낌인데. 생각보다 이에 대한 방법은 잘 정리된 곳이 없기 마련이다.

물론 상당히 어려운 기술은 아니라 보여지지만 이걸 적재적소에 잘 사용해서 UI를 만들기란 어렵다. (개념 자체는 쉬운데 잘 조합해서 좋은 UI를 만들기는 어렵다는 뜻)

반응형하면 bootstrap - jQuery 순으로 의식의 흐름이 이어질텐데 요즘의 웹은 jQuery가 생산성은 좋으나 가독성이 떨어지고 웹을 무겁게 만든다고 여겨져서 잘 쓰지 않으려는 추세다. (그럼에도 여전히 인기있는 js 라이브러리지만)

결론은 이런 bootstrap과 jQuery를 이용하지 않고 아주 초보적이더라도 반응형 웹을 만들어 보라는게.. 이 로드맵의 의도 일 것이다.

반응형 웹을 만들기 위해선 CSS의 media query를 이용하면 된다.  이에 대한 내용도 역시 MDN에 잘 기술 되어 있다. 대략 원리는 사용자의 브라우저 가로 px단위를 이용해서 데스크탑인지 모바일인지를 구별해서 UI를 가변적으로 처리하는 것이다. 가로 폭이 좁으면 모바일로 인식하고 사이드 바 같은걸 보여주고 원래 있던 메뉴바를 숨김 처리 한다던지.. 

사실 나도 bootstrap으로 이걸 적용 시켜본게 전부라.. 해봐야한다.

5, 6

https://rogerdudler.github.io/git-guide/index.ko.html

Git은 선택이 아닌 필수다. 우리나라의 SI가 웹을 잘못 양산하고 있다고 생각한다. 물론 모든 웹 사이트가 최신, 혹은 모던 Language를 쓰고 최신 스택을 써야할 이유는 없지만.. 더 이상 업데이트를 지원 받지 못하는 서서히 걷어내야 한다는건 분명히 잘못된 생각이 아니다.

또한 기존의 기술을 더 좋은 방향으로 발전시켜 나온 기술이라면 도입 하는게 맞다고 생각한다. 그중 하나가 SVN이고.. 이것은 Git에 이미 대체 되고 남아야할 기술이라고 생각한다. 여튼 말이 길었지만 현재 환경과 인프라가 SVN을 쓰고 있다해도 Git은 무조건적으로 배울 가치가 잇으며 그냥 필수라고 봐야한다.

개인적으로 Git을 가장 잘 정리한 곳은 이 사이트라고 생각한다. 조금은 어렵고 딱딱하게 느껴질만한 내용을 가볍게 잘 풀어낸듯.

물론 Git의 내용은 무궁무진하게 많지만 초심자라면 저정도 기능에선 충분히 일상적인 task처리는 다 하고도 남을듯.

여기까지 왔다면 프론트 엔드는 어느정도 됫고. 백엔드의  1~4번 항목까지 해보고 나면 스스로 간단한 웹 서비스 혹은 TODO List 혹은 게시판 정도는 만들수 있을거라 생각된다. 

아 물론 여기에는 SQL이 빠져 있고 기본적인 네트워크, 라우팅 같은 것이 빠져 있다. 이정도 초석을 다진 뒤.. 생활 코딩에서 DataBase 혹은 SQL에 관련된 걸 배우고. 백엔드(서버)에 대한걸 배운 뒤.. 

간단한 웹 페이지를 만들고 데이터베이스와 서버를 연동시켜서 CRUD (Create, Read, Update, Delete) 기능을 하는 간단한 웹 페이지를 만들어보길 바란다.

개인적으로 갓 웹 개발자로 입문을 생각하고 그 시기가 요즘(2018)이라면 너무나도 당연하게 js(javascript) 풀 스텍 개발자가 되기를 강력 추천한다.

그 이유는 모든 웹 개발자가 각자의 언어를 배우고 추가적으로 DOM을 조작하기 위해 Javascript르 필수로 배우는데.. 구글을 필두로 js가 어마어마한 속도로 발전을 해서.. 현재는 감히 자바스크립트로 못하는 일이 없는 수준에 와있기 때문이다.

하나의 언어로 모든 걸 만들고 커버하려는 움직임이 포착되고 있는게 그것이 js라니 더이상 다른 추천이 필요없지 않나 싶다.