추천 사이트 목록

온라인 열람이 가능한 자료 및 사이트 목록을 공유합니다.

프로그래밍 일반

• GeekNews (주원님 추천)
  다양한 주제의 새로운 기술이나 트렌드를 큐레이션해주는 국내 사이트.

• HackerRank (울군님 추천)
  여러가지 난이도의 코딩문제를 풀어볼 수 있는 곳. 영어를 해야 문제를 이해할 수 있다는 단점이 있지만 30일 챌린지로 동기부여한다거나, 다양한 메서드를 사용해야만 풀 수 있다는 장점이 많아서 애용 중.

• 코딩도장
  HackerRank의 국내판 사이트

• W3SCHOOLS (클매님 추천)
  웹개발을 위한 온갖 언어의 튜토리얼과 문제들이 있다. 영문사이트이지만 난이도는 낮은 편이라 입문자에게 추천.

• Can I Use (슬비님 추천)
  특정 feature가 각 브라우저나 모바일 웹에서 호환이 되는지 검색해볼 수 있다. 이걸 여러번 사용하다보면 IE가 얼마나 나쁜지 알 수 있다.

Python

• Legally Free Python Books List
  영문이기는 하지만 무료로 제공되는 파이썬 책의 목록과 링크

• 파이썬 코딩 컨벤션 PEP8 (울군님 추천)
  파이썬 코딩 컨벤션과 관련해서 수업 중 말씀해주신 PEP8 관련 정리 블로그

• 파이썬과 다이아스포라 발표영상 (울군님 추천)
  파이썬에 있는 기능들이 어떻게, 왜 존재하는 것인지, 현재의 모습을 갖추게 된 경위를 알 수 있다.

HTML5 / CSS3

• CSS Grid Layout Guidebook (슬비님 추천)
  모던 레이아웃 기법인 Grid의 모든 것에 대해 잘 정리된 e-book

• Grid Calculator (슬비님 추천)
  Grid로 레이아웃 짤 때 너비와 거터 등을 필요한 column 수에 따라 계산해주고 미리 보여주며 background image로 깔고 작업할 수 있도록 파일까지 추출해주는 사이트

• A Complete Guide to Flexbox (슬비님 추천)
  CSS의 모던 레이아웃 기법인 Flex의 활용을 시각적으로 잘 이해할 수 있게 설명해둔 사이트

• Flexbox Froggy (슬비님 추천)
  Flexbox 속성과 값을 제대로 이해하기 위해 개구리 게임으로 만들어둔 사이트인데 한글로도 서비스되기도 하고 개구리가 나름 귀엽다.

• CSS Clip-path Maker (슬비님 추천)
  숨김콘텐츠 처리를 위해 clip-path로 좌표값을 다 0으로 주는 방법을 배우면서 알려주셨다. clip-path 속성을 이미지에 미리 적용해볼 수 있는 사이트

• Ultimate CSS Gradient Generator (슬비님 추천)
  gradient 속성을 배경색으로 적용할 때의 미리보기와, 해당 gradient를 각 브라우저에 적용할 때 호환이 되는 소스코드도 제공한다.

• Mastering the nth-child (슬비님 추천)
  CSS ‘구조선택자’에 대해 쉽게 이해할 수 있도록 그림으로 나타낸 사이트

• CSS - Transition Timing Function (슬비님 추천)
  animation이나 transition의 time-function 속성 값들을 잘 설명해둔 사이트

• cubic-bezier (슬비님 추천)
  위에 기술한 time-function 속성에 cubic-bezier를 값으로 부여함으로써 변화 속도를 더욱 다채롭게 할 수 있는데, 이 사이트에서 그 속도를 미리보기 할 수 있다.

• PoiemaWeb - Sass Basics 그리고 HEROPY Tech - Sass(SCSS) 완전정복 (슬비님 추천)
  Sass에 대한 이해와 사용법을 잘 정리된 글로 제공하는 블로그

기타 사이트

• git-flow cheatsheet (울군님 추천)
  git 으로 프로젝트 관리하기 용이한 git-flow의 설치와 사용 방법이 나와있다. 한국어로도 제공된다.

• Unsplash - freely-usable images
  무료 이미지 소스를 제공하는 사이트라 자주 이용하고 있다.

• Google Fonts
  웹폰트를 테스트해보고 폰트 소스를 가져올 수 있는 곳

• Fontello (슬비님 추천)
  원하는 아이콘을 폰트로 다운받아 사용할 수 있다.

• Emmet Cheat Sheet (슬비님 추천)
  Emmet 이라는 shorthand 툴킷의 표기법 모음

• keybr.com 영타연습 (울군님 추천)
  영타를 지배하는 자, 코딩을 지배한다…는 마음으로 연습하라고 추천해주셨는데 나는 영타 속도엔 자신있지만 오타를 내지 않기 위해 연습해야겠다.

(Last Updated 2021.04.29)