로드맵 - JavaScript 공부하기

11 Dec 2013

C와 Java로 개발하는 회사에 다니다가, 처음으로 웹개발 하는 회사에 들어와 자바스크립트를 공부하면서 찾은 사이트들입니다. 직접 이용해보고 좋아서 여기저기 다른사람에게 소개했던 사이트이기도 합니다. 예제 위주로 되어 있어서 책을 읽는것 보다 훨씬 빨리 익힐 수 있는 점이 좋습니다. 대신에 정확한 개념 이해를 돕는 책을 곁하여 공부하는 것을 권해드립니다.

1 단계 - 자바스크립트 기본 문법, DOM

http://www.w3schools.com/js/

영어로 된 사이트인데, 예제위주로 보면 됩니다.

2 단계 - jQuery

http://www.w3schools.com/jquery/default.asp

같은 사이트입니다.

크로스 브라우징 신경 덜쓰고 개발하려면 jQuery 는 필수.

고급 문법이 여기저기 섞여 있는데, 여기서는 너무 깊이 파시지 마시고 이렇게도 쓰는구나 하는 식으로 이해하시기 바랍니다.

즉, 예제 위주로 보시면 됩니다.

3 단계 - 자바스크립트 고급 문법 이해

http://ejohn.org/apps/learn/

여기서부터는 약간 어렵습니다.

자바 스크립트에서 함수의 역할, new 연산자, this 키워드, 객체, 프로토타입, 클로져(Closure), call() 과 apply() 등 약간 난해한 주제를 다룹니다.

4 단계 - jQuery 플러그인 만들기.

http://learn.jquery.com/plugins/basic-plugin-creation/

http://learn.jquery.com/plugins/advanced-plugin-concepts/

자신이 이해한 것에 대한 실습 차원에서 개인적으로 jQuery 플러그인을 만들어볼 것을 추천합니다.

어느 정도 자신감이 붙으면 jQuery UI 등에 있는 플러그인들도 분석해보고, 비슷하게 만들어보세요.

고급 문법 이해를 돕기위한 추가 자료들.

http://stackoverflow.com/questions/19980922/can-the-referred-object-of-this-keyword-change-without-a-new-operator-or-calli

https://hotohoto.github.io/2013/12/%EB%A1%9C%EB%93%9C%EB%A7%B5-javascript-%EA%B3%B5%EB%B6%80%ED%95%98%EA%B8%B0/

http://book.naver.com/bookdb/book_detail.nhn?bid=6931122

P.S.

요즘 node.js 도 뜨고 있지만, 간단한 줄 알았던 자바스크립트는 사실 활용 가능성도 높고, 이해해야할 깊이가 만만치 않은것 같습니다. 저도 아직 가야할 길이 한참 멀지만, 지금까지 공부했던것 정리차원에서 공유합니다.

그리고, 개발자에게 영어공부는 필수.