Plain Vanilla - 바닐라 기술로 웹 개발하기

(plainvanillaweb.com)

빌드 도구나 프레임워크를 사용하지 않고 에디터, 브라우저, 웹 표준(순수 HTML/CSS/Javascript)만으로 웹 사이트와 웹 애플리케이션을 만드는 주요 기술에 대한 개요를 제공함
다루는 주제는 다음과 같음:
- Components: React나 Vue와 같은 프레임워크의 컴포넌트 접근 방식을 대체하기 위해 순수 HTML, JavaScript, CSS로 상위 수준의 프리미티브를 만드는 기본 구성 요소로 Web Components를 사용하는 것
- Styling: CSS Modules, PostCSS, SASS의 편의성을 대체하기 위해 현대 CSS의 능력을 최대한 활용하는 것
- Sites: 웹 컴포넌트를 기반으로 웹 프로젝트를 만들고 빌드 도구, 프레임워크, 서버 사이드 로직 없이 프로덕션에 배포하는 것
- Applications: 바닐라 기술로 싱글 페이지 웹 애플리케이션을 구축하는 방법, 라우팅 방법, 상태 관리 방법
이 튜토리얼은 HTML, CSS, JavaScript를 이미 알고 있는 사람들을 위한 것임. 웹 개발을 배우기 시작하는 단계라면 이 사이트는 아직 적합하지 않음

왜 그래야 할까?

현대 웹 개발 프레임워크는 풍부하고 잘 구조화된 웹 애플리케이션을 빠르게 개발할 수 있는 능력이 있지만, 이러한 풍부한 기능은 프레임워크와 도구의 복잡성을 대가로 하며 결과적으로 프로젝트는 보안과 최신 상태를 유지하기 위해 정기적인 유지 보수가 필요함
플레인 바닐라 스타일의 웹 개발은 다른 선택을 하여 단순성과 효과적으로 제로 유지 보수와 같은 장기적인 이점을 위해 단기적인 편의를 포기함. 이 접근 방식은 훌륭한 웹 표준 지원을 제공하는 현대 브라우저 환경에서 가능함
인기 있는 웹 개발 프레임워크 중 일부를 시도하고 왜 없이 하고 싶어하는지 배우고 프레임워크의 도움 없이 코드베이스를 구조화하는 방법에 대해 확신이 들 때까지 Plain Vanilla 접근 방식을 사용하지 말 것
브라우저가 제공하는 도구에 대해 더 잘 알고 싶거나 유지 관리가 필요 없고 매우 안정적이며 장기적으로 구축된 사이트나 애플리케이션을 구축하려는 경우 이 접근 방식을 사용할 것. 결국 여기에 설명된 기술은 웹 표준에만 의존하며 웹 표준은 수십 년 동안 지속됨