💻 IT·개발 주소모음
코드 저장소, 기술 문서, Q&A, 무료 디자인 리소스까지. 개발자와 디자이너의 작업 효율을 높여줄 핵심 사이트를 모았습니다.
GitHub
코드 저장소·협업·오픈소스의 표준 플랫폼
Stack Overflow
개발 중 막힌 문제를 해결하는 Q&A 커뮤니티
MDN Web Docs
HTML·CSS·JavaScript 공식 웹 기술 문서 (한국어)
생활코딩
한국어 무료 프로그래밍 입문 강의
W3Schools
웹 기술 입문 튜토리얼과 예제
Can I use
웹 기능의 브라우저별 지원 여부 확인
CodePen
프론트엔드 코드 실험·공유 플레이그라운드
npm
JavaScript 패키지 레지스트리
Unsplash
상업적 이용 가능한 고화질 무료 사진
Flaticon
다양한 무료 아이콘·스티커 다운로드
Google Fonts
웹에서 바로 쓰는 무료 폰트 라이브러리
Vercel
프론트엔드·정적 사이트 무료 배포 플랫폼
Postman
API를 설계·테스트·문서화·협업할 수 있는 세계적인 API 개발 플랫폼으로 무료 플랜을 제공한다.
Figma
브라우저에서 바로 쓰는 협업형 UI/UX 디자인 도구로 프로토타이핑과 실시간 공동 작업을 지원한다.
Excalidraw
손그림 느낌의 무료 화이트보드로 다이어그램·플로차트·시스템 설계도를 빠르게 그릴 수 있다.
StackBlitz
설치 없이 브라우저에서 React·Node 등 풀스택 프로젝트를 바로 실행하는 온라인 개발 환경이다.
regex101
정규식을 실시간으로 테스트·디버그하고 각 패턴의 의미를 설명해 주는 무료 도구다.
DevDocs
100여 개 언어·프레임워크의 공식 문서를 한 곳에서 빠르게 검색하고 오프라인으로도 볼 수 있다.
OKKY
국내 최대 개발자 지식공유 플랫폼으로 기술 Q&A·아티클·커리어·IT 행사 정보를 제공한다.
프로그래머스
코딩테스트 연습과 개발자 채용·교육을 한 번에 지원하는 국내 대표 개발자 성장 플랫폼이다.
IT·개발 알아두기
IT·개발 카테고리에는 개발자와 기획자, 디자이너가 매일 들여다보는 자료를 모았습니다. 코딩 에디터와 버전 관리, API 문서와 프레임워크 공식 가이드는 물론이고 아이콘·폰트·이미지 같은 무료 디자인 소재까지 한자리에 묶었죠. 개발을 막 시작한 사람이든, 실무에서 자료를 급하게 찾는 사람이든, 화면에 쓸 시각 자료가 필요한 사람이든 한 번씩은 들를 만한 곳들입니다.
사이트를 고르기 전에 내가 뭘 하려는지부터 정해 두면 헤매는 시간이 줄어듭니다. 문법이나 사용법을 정확히 확인하려면 그 기술의 공식 문서를 먼저 보는 게 맞고, 막힌 문제를 풀어야 한다면 커뮤니티나 Q&A 사이트가 빠르게 도움이 되거든요. 디자인 소재는 다운로드 전에 상업적 이용이 되는지, 출처 표기가 필요한지 라이선스를 꼭 보고 받으세요. 같은 용도라도 한국어 지원이나 업데이트 주기, 자료의 최신성에 따라 쓸모가 갈리니, 마음에 드는 곳 한두 군데를 즐겨찾기에 두고 비교해 보길 권합니다.
여기 모은 사이트들은 학습→자료 검색→실무 적용으로 이어지는 흐름에 맞춰 섞어 쓸 때 빛을 봅니다. 새 라이브러리를 도입한다면 공식 문서로 개념을 잡고, 예제 코드와 디자인 소재로 화면을 짠 다음, 막히는 데는 검색과 커뮤니티로 메우는 식이죠. 외부 자료를 그대로 붙여 넣기 전에 버전 호환성과 라이선스, 보안만 한 번 더 짚어 보면 뒤탈이 줄어듭니다.
자주 묻는 질문
무료 개발도구와 디자인 리소스만으로도 실제 프로젝트를 진행할 수 있나요?
기본적인 개발과 디자인 작업은 무료 자료만으로 끝나는 경우가 꽤 많습니다. 다만 상업적 프로젝트라면 얘기가 달라지죠. 도구의 무료 사용 범위와 리소스 라이선스 조건은 시작 전에 짚어 두세요. 약관이나 가격 정책은 도구마다 다르니 공식에서 확인하면 됩니다.
공식 문서와 커뮤니티 자료 중 어느 것을 먼저 봐야 하나요?
함수 사용법이나 설정값처럼 틀리면 곤란한 내용은 공식 문서를 기준으로 잡으세요. 반대로 특정 오류를 잡거나 실무 팁이 필요할 땐 커뮤니티와 Q&A가 훨씬 빠릅니다. 단, 두 자료의 버전이 어긋나는 일이 잦으니 내가 쓰는 버전과 맞는지 같이 봐야 합니다.
디자인 리소스를 받을 때 라이선스는 어떻게 확인하나요?
대개는 자료 페이지나 다운로드 영역에 상업적 이용 가능 여부와 출처 표기 의무가 적혀 있습니다. 한 사이트 안에서도 자료마다 조건이 다른 경우가 있어서, 받으려는 항목의 라이선스 표기를 하나하나 직접 보는 편이 낫습니다. 조건이 애매하면 그냥 다른 자료를 찾는 게 마음 편하고요.
초보자가 개발 학습을 시작할 때 어떤 순서로 사이트를 활용하면 좋을까요?
배우려는 언어나 기술의 공식 입문 문서로 기본 개념을 잡은 다음, 예제 중심 자료를 보며 직접 코드를 따라 써 보는 걸 권합니다. 막히는 부분은 검색과 커뮤니티로 메우고, 손에 좀 익으면 작은 프로젝트에 디자인 소재를 얹어 완성도를 올려 보세요. 사이트마다 난이도와 한국어 지원이 제각각이니, 몇 군데 둘러보고 자기한테 맞는 곳을 정하면 됩니다.