Categories
Javascript + jQuery 개발(Development)

JavaScript, jQuery 공부에 유용한 사이트들

회사 신입에게 JavaScript와 jQuery를 좀 알려줘야 할 일이 생겼다. 1:1로 붙어서 알려주면 좋겠지만 회사에서는 그러기 힘드니, 사이트를 몇 개 던져주고 공부시켰다(…). 궁금한 거 있으면 질문하라고 하며 틈틈히 체크해보는 방식으로 했는데, 꽤나 도움이 된 것 같아 공유차원에서 정리해보는 글.

Code School – JavaScript Path (영어)

CodeSchool - Javascript Path
CodeSchool – Javascript Path

기본적으로 많은 도움이 된 사이트가 바로 이 Code School이다. 위에 링크한 JavaScript Path에서는 자바스크립트 전문가가 되기까지 도움이 되는 지식들이 단계별로 구성되어 있다. JavaScript Road Trip Part 1과 Try jQuery는 무료로 체험해 볼 수 있고, 이후 과정은 등록(월 US $29) 이후 수강이 가능하다. 단계를 넘어갈 때마다 포인트가 누적되기 때문에 게임을 하는 기분도 들고 입력에 따라 인터랙티브한 피드백을 계속 받을 수 있기 때문에 배우는 과정도 재미있다. 무언가 새로운 언어를 배우고 싶다면 이곳을 강추한다. JavaScript 외에도 Ruby, iOS 등 다양한 과정이 있다. (전체 코스 보러가기)
* jQuery는 try.jquery.com 으로도 접속할 수 있다.

Learning Advanced JavaScript (영어)

John Resig의 Learning Advanced JavaScript
John Resig의 Learning Advanced JavaScript

jQuery의 창시자인 John Resig이 자신의 저서 Secrets of the JavaScript Ninja를 위해 공개한 예제 사이트. 조금 더 난이도가 있는 JavaScript 기법들을 익힐 수 있다. 책 없이 하려니 주석과 예제를 통해 내용을 파악해야 하지만, 그래도 인터랙티브한 환경을 제공하기 때문에 이것저것 즉석에서 확인해 볼 수 있는 점이 장점.

JSFiddle

JSFiddle
JSFiddle

간단하게 HTML, CSS, JavaScript 코드를 넣고 결과물을 확인할 수 있는 사이트. 한 눈에 모든 것을 볼 수 있어서 테스트가 필요할 때면 틈틈히 사용하고 있다. jQuery 등의 플러그인을 참조하여 사용할 수도 있어 유용하다. 결과물을 Save 한 경우 별도의 URL이 생성되는데, 이를 통해 중간 결과물들을 다른 사람들과 공유할 수도 있게 되어 있어 유용하다. 비슷하게는 JS Bin이란 곳도 있는 것 같다.


여기까지가 신입에게 알려준 사이트들. 한국어 사이트가 없다(…). 아무래도 인터랙티브하게 익힐 수 있는 곳을 찾다보니 위의 곳들을 알려주게 되었다. 한국어로 된 사이트 중 알고 있는 곳은 생활코딩이 유일한데, 인터랙티브한 환경을 제공하지는 않지만 한국어라는 점과 동영상 강의가 제공되니 듣기 편하다는 장점이 있다.
위의 사이트들을 보면, 이제는 뭔가 배우려고 할 때 더 재밌게 배울 수 있는 방법이 늘어나고 있다는 걸 느낄 수가 있었다. 가만히 주입식으로 배우기보다는 직접 만지고 따라해보면서 게임처럼 익힐 수 있는 곳들. 앞으로 이런 시장이 좀 더 커져서 원하는 것을 재미있게 배울 수 있는 길이 더 많아졌으면 좋겠다.
+ 2013/12/12 추가
한군데 더 생각나서 추가한다. jsPerf 라는 곳인데, JavaScript 코드들의 성능을 비교해볼 수 있는 사이트이다. 예시로 jQuery selector와 표준 selector를 비교한 페이지를 링크해둔다.