코딩 공부에 유용한 사이트들

1. HTML5 Open Reference

 

 

http://html5ref.clearboth.org/

 
사실 웹표준 공부에 도움이 될만한 사이트는 거의 해외사이트가 대부분입니다.
하지만 이 사이트는 고맙게도 HTML5의 레퍼런스를 한글로 제공하고 있구요, 사전처럼 필요할 때 찾아 쓰기 좋습니다.
사이트 설명 : HTML5 오픈 레퍼런스는 HTML5 명세를 좀 더 쉽게 이해하고, 웹 제작자들이 빠르게 요소와 속성을 찾아볼 수 있도록 하기 위해 클리어보스 HTML5 그룹에서 만들었습니다

 2010년 11월에 시작하여 2011년 11월 1일 베타 버전을 공개하였고, 2012년 HTML5 명세가 표준 권고안으로 확정되면 변경된 내용을 반영하여 베타를 떼어낼 계획입니다.

 

2. The Code Player

 

 

http://thecodeplayer.com/

 
The Code Player는 동영상강좌를 보는 것처럼 코딩과정과 그 결과를 실시간으로 보여줍니다.
좌측이 코드에디터 영역이고 우측이 그 결과를 보여주는 브라우저와같은 역할을 합니다.
영상을 진행하는 도중 왼쪽 에디터에 코딩을 직접 작성하게 되면 우측에 바로 반영되어 보여주기도 합니다. 마치 누군가 코딩하는 과정을 처음부터 끝까지 지켜보는 느낌이 들기 때문에 감각을 익히는데 많은 도움이 됩니다.
3. codrops

 

 

http://tympanus.net/codrops/all-articles

 
codrops에서는 다양한 코딩 결과물들을 공유하고 그 소스를 다운받을 수 있는 사이트입니다.

 

4. codepen

 

 

http://codepen.io/

 
codepen 또한 코딩 결과물을 공유합니다.

주로 CANVAS태그나 미디어쿼리, 웹킷 등을 이용한 동적인 결과물들로 HTML로 이런 것까지 만들수 있다는 사실에 놀라게 됩니다.
The Code Player처럼 에디터에서 직접 코드를 수정해볼 수 있습니다.

 

5. Codeacademy

 

 

http://www.codecademy.com/
Codeacademy는 자바스크립트, HTML, PHP 등 여러 코딩 기술들을 배울 수 있는 사이트입니다.
스터디 방식은 웹사이트가 지시하는 순서대로 직접 코딩을 입력해야 하고 틀린 부분은 그 이유를 설명해 줍니다. 각 과정을 통과하면 기념 배지를 선물로 주기도 합니다.

 

코딩 공부를 위한 사이트는 제가 추천해드린 사이트들 외에도 유용한 사이트들이 얼마든지 있습니다. 하지만 이것들은 거의 해외사이트들이며 당연히 영문으로 만들어져 있습니다.
이렇게 남보다 한발 앞서 나가기 위해서는 국내에서 해외로 눈을 돌려야만 합니다.
아쉽지만 국내 사이트들에서 얻을 수 있는 정보는 그만큼 부족하고 뒤쳐진 것이 현실이기 때문이죠.

 

 

출처 : http://nalrarydesigner.tistory.com/entry/%EC%BD%94%EB%94%A9-%EA%B3%B5%EB%B6%80%EC%97%90-%EC%9C%A0%EC%9A%A9%ED%95%9C-%EC%82%AC%EC%9D%B4%ED%8A%B8%EB%93%A4

You may also like...

댓글 남기기

이메일은 공개되지 않습니다. 필수 입력창은 * 로 표시되어 있습니다.

다음의 HTML 태그와 속성을 사용할 수 있습니다: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>