Web Story for Makers

웹을 짓는 네 가지 모험, 어디부터 떠날까요?

정적 문서를 엮던 시절부터 컴포넌트, 디자인 시스템, Jamstack, AI 도구까지. 웹을 만드는 일은 계속 영역을 넓혀 왔습니다. 이 허브에서는 “구조 · 스타일 · 인터랙션 · 제작 도구”라는 네 갈래를 소개하고, 세부 타임라인으로 안내합니다.

각 시리즈는 불편(Problem) → 필요(Need) → 해결(Fix) 순서로 이야기를 풀어, 초보자도 큰 흐름을 따라갈 수 있도록 구성했습니다.

먼저 전체 발자국을 훑고 싶다면 아래 카드에서 대략의 내용을 읽고, 관심 있는 타임라인으로 들어가 더 깊은 사건과 모달 이야기를 펼쳐 보세요.

네 가지 웹 제작 연대기

웹을 만든 사람들은 같은 시대에 서로 다른 질문을 던졌습니다. 구조는 어떻게 정리할지, 화면은 어떻게 꾸밀지, 움직임은 어떻게 자연스럽게 할지, 도구는 어떻게 협업을 도울지. 각 카테고리는 그 질문에 대한 연대기입니다.

HTML 태그의 탄생부터 반응형 레이아웃, 웹 컴포넌트까지. “문서를 어떻게 구조화할까?”라는 고민을 시대별로 정리했습니다.

CSS, Flexbox, Grid, 디자인 시스템, 컨테이너 쿼리까지. 화면을 더 읽기 좋게 만들려는 실험을 모았습니다.

JavaScript, Ajax, SPA, Service Worker, WebAssembly, WebGPU까지. 웹이 앱처럼 반응해 온 순간을 따라갑니다.

Dreamweaver와 FTP에서 npm, Webpack, Vite, AI 도구까지. “더 빠르게 만들고 배포하려면?”이라는 질문의 답을 모았습니다.

구조를 정돈한 사람이 있었기에 스타일링이 단단해졌고, 훌륭한 인터랙션이 나오자 제작 도구가 생겨났습니다. 네 갈래 중 어디서부터 읽어도, 다음 걸음은 다른 연대기가 알려 줄 거예요. 필요하다면 언제든 허브로 돌아와 새로운 길을 골라 보세요.

아래 자료는 네 가지 연대기를 설계할 때 참고한 대표 아카이브입니다.