자료실

1,500개 이상의 무료 웹 폰트를 제공하는 구글 서비스입니다. CDN으로 바로 임베드하거나 다운로드해서 쓸 수 있고, 한글 폰트(Noto Sans KR 등)도 잘 지원됩니다. 웹 프로젝트의 타이포그래피 선택에 필수 사이트입니다.

API 응답, 폼 입력, 환경 변수 등의 유효성 검증을 타입 안전하게 할 수 있는 라이브러리입니다. 스키마를 정의하면 TypeScript 타입이 자동으로 추론되어 중복 작성이 없어집니다. React Hook Form이나 tRPC와 함께 쓰면 시너지가 큽니다.

Redux가 복잡하게 느껴진다면 Zustand를 써보세요. 보일러플레이트가 거의 없고, 코어 코드가 수백 줄밖에 안 되는 초경량 상태 관리 라이브러리입니다. 소스 코드를 읽어보면 상태 관리 패턴의 본질을 이해할 수 있습니다.

D3보다 쉽게 차트를 그릴 수 있는 라이브러리입니다. 막대, 선, 파이, 레이더 등 기본 차트 타입을 간단한 설정으로 만들 수 있습니다. 대시보드에 기본 차트 넣을 때 가장 빠른 방법이고, 반응형도 기본 지원됩니다.

데이터를 SVG로 시각화하는 가장 강력한 라이브러리입니다. 학습 곡선이 높지만, 커스텀 차트나 인터랙티브 시각화가 필요하다면 이만한 도구가 없습니다. Observable 노트북과 함께 쓰면 프로토타이핑이 빨라집니다.

웹에서 3D 그래픽을 구현하는 가장 인기 있는 라이브러리입니다. WebGL의 복잡함을 추상화해서 비교적 쉽게 3D 씬을 만들 수 있습니다. examples 폴더에 수백 개의 데모가 있어서 3D 웹 개발 학습에 최고입니다.

WebSocket 기반 실시간 양방향 통신 라이브러리의 소스코드입니다. 채팅, 알림, 실시간 대시보드 등을 구현할 때 참고하기 좋습니다. 자동 재연결, 룸/네임스페이스 등의 구현 방식을 배울 수 있습니다.

Node.js 웹 프레임워크의 원조격인 Express의 소스코드입니다. 미들웨어 패턴의 원리를 이해하기 좋고, 코드 자체가 간결해서 읽기 수월합니다. Node.js 백엔드 개발자라면 한번쯤 소스를 들여다보면 좋습니다.

타입 힌트 기반으로 자동 API 문서화와 유효성 검사를 해주는 Python 웹 프레임워크입니다. 비동기 처리가 잘 되어 성능이 좋고, 코드 품질이 높아서 Python 프레임워크 설계를 배우기 좋은 소스입니다.

LLM을 활용한 애플리케이션을 만드는 프레임워크의 소스코드입니다. RAG, 에이전트, 체인 패턴 구현을 볼 수 있어서 AI 앱 개발의 레퍼런스로 좋습니다. Python과 JS 버전이 따로 있으니 주 언어에 맞는 걸 확인하세요.