Next.js · React · TypeScript
빈 저장소가 아니라 정의된 아키텍처에서 시작하세요.
Foundation은 구성 우선 웹사이트 기반으로, 프레임워크에 독립적인 코어, 포트와 어댑터, 스키마로 검증되는 구성, 실제 검증 게이트를 갖추고 있습니다. 기반을 물려받고 만들려는 사이트에 실제로 고유한 부분에 시간을 쓰세요.
- Next.js App Router와 React Server Components
- 프로젝트 전반의 TypeScript와 스키마로 검증되는 구성
- 저장소에 단위, 아키텍처, 실제 브라우저 테스트 게이트가 있습니다
아키텍처 개요
의존 방향이 한 방향인 네 단계입니다. 가운데 두 단계가 기반이고 처음과 마지막은 여러분의 것입니다.
- Stage 1
사이트 데이터, 콘텐츠, 자산
아이덴티티, 내비게이션, 언어, Markdown 콘텐츠, 시각 자료 — 무엇이든 읽기 전에 검증되는 도입자의 입력입니다.
- Stage 2
Foundation 파생 환경
프레임워크에 독립적인 도메인 개념과 이를 조율하는 애플리케이션 서비스입니다. 프레임워크 import가 없습니다.
- Stage 3
표현, 라우팅, 연동 지점
경로, 레이아웃 구성, 메타데이터, 그리고 구성에서 예약, 문의, 지도, 분석을 연결하는 어댑터 팩토리입니다.
- Stage 4
배포
정적 생성을 우선하는 빌드를 여러분의 저장소에서 여러분의 호스팅 계정으로 배포합니다.
의존 방향은 가정이 아니라 테스트로 증명됩니다. 코어는 React, Next.js, 외부 계층을 import할 수 없고, 애플리케이션 계층은 구체 어댑터로 들어갈 수 없습니다.
구성인가, 코드인가
이 경계가 프로젝트의 핵심입니다. 비즈니스에 특화된 결정의 대부분은 데이터이고, 실제 확장은 코드입니다. Foundation은 무엇이 무엇인지 분명히 밝힙니다.
보통 구성하거나 작성하는 것
- 아이덴티티: 이름, 슬로건, 설명, 정규 URL
- 내비게이션과 보조 또는 푸터 그룹
- 언어 구성과 UI 사전
- 비즈니스 지역, 운영 시간, 경로 안내
- 콘텐츠: Markdown 페이지와 컬렉션
- 브랜드, 아이콘, 이미지
- 예약, 문의, 지도, 분석 제공자 선택
- 오퍼링, 포트폴리오, 블로그, 후기 기능 활성화
- 구성 계약이 노출하는 표현 값
동작을 실제로 확장할 때 필요한 코드
- 기존 기능을 위한 새 제공자 어댑터
- 새로운 재사용 기능
- 새로운 UI 동작이나 상호작용
- 새로운 하위 애플리케이션 모듈
- 정해진 구성 경계 밖의 모든 것
승인된 입장: 아이덴티티, 콘텐츠, 브랜드, 기능 선택의 대부분은 애플리케이션 코어 밖에 있습니다. 그렇다고 코드를 전혀 쓰지 않는다는 약속은 아닙니다. 진짜 새로운 기능은 플랫폼 작업이며, Foundation은 플러그인 시스템이 있는 것처럼 암시하지 않고 그렇게 말합니다.
엔지니어링 계약
프로젝트가 지키는 것과 주장하지 않는 것.
엄격하게 검증되는 구성
하나의 스키마, 알 수 없는 키 거부, 실행 가능한 실패, 그리고 로더를 통해서만 읽는 구성.
헥사고날 경계
순수한 코어, 포트와 애플리케이션 서비스, 팩토리 뒤의 어댑터, 얇은 프레임워크 경로.
의존 강제
아키텍처 테스트가 소스 트리를 순회하며 금지된 import에서 실패하므로 다이어그램이 코드에서 멀어질 수 없습니다.
서버 우선 구성
React Server Components와 정적 생성이 기본이며, 클라이언트 상호작용은 필요한 컴포넌트로 제한됩니다.
실제 브라우저 검증
커밋된 헤드리스 브라우저 매트릭스가 데스크톱, 태블릿, 모바일 폭, 키보드와 포인터, 동작 감소, 다크 스킴을 확인하고 실패한 단언이 있으면 실행을 실패시킵니다.
아키텍처와 단위 게이트
경계 테스트와 단위 테스트가 자산 검사, 타입 검사, lint, 프로덕션 빌드와 함께 실행됩니다.
기능 주장 규율
문서화된 주장을 구현·검증되었다는 프로젝트 자체의 기록과 대조하므로, 주장이 증거를 넘어설 수 없습니다.
정직한 업그레이드 모델
구성, 콘텐츠, 자산이 애플리케이션 코어 밖에 있으므로 플랫폼 개선을 작업을 덮어쓰지 않고 받아들일 수 있습니다.
프로젝트가 주장하지 않는 것
Foundation은 WCAG 준수, 보안 인증, 침투 테스트, 공개된 성능이나 Lighthouse 점수, 모든 브라우저와 기기 지원을 주장하지 않습니다. 접근성과 성능은 프로젝트가 검증할 수 있는 범위에서 개발하고 검증하는 것이지 인증된 것이 아닙니다.
Foundation이 멈추는 지점
같은 소유권 분담을 기술적으로 표현한 것입니다. Foundation은 운영 복잡성 앞에서 의도적으로 멈추고 여러분이 선택하는 서비스로의 연동 지점을 제공합니다.
도입자가 소유하는 것
- 구성
- 콘텐츠
- 언어 사전
- 비즈니스 시각 자료
- 제공자 선택
- 하위 확장
Foundation이 소유하는 것
- 애플리케이션 아키텍처
- 재사용 가능한 UI 기계
- 구성 검증
- 라우팅과 콘텐츠 기계
- 연동 지점
- 검증 인프라
확장은 밖에서 안으로 진행됩니다. 새 제공자는 어댑터와 팩토리 분기, 스키마 열거형 항목이고, 새 콘텐츠 유형이나 언어는 데이터입니다. 진짜 새로운 기능은 플랫폼 작업입니다.
도입 흐름
여덟 단계입니다. 명령 단위의 세부는 저장소에 있고, 여기서는 작업의 형태를 보여줍니다.
- 1
Foundation 구하기
공개 저장소를 복제하거나 포크합니다.
- 2
설치하고 실행
의존성을 설치하고 로컬에서 사이트를 실행합니다.
- 3
구성
아이덴티티, 언어, 기능, 제공자 선택을 정의합니다.
- 4
콘텐츠와 자산 작성
페이지를 쓰고 브랜드 자산 역할을 교체합니다.
- 5
제공자 연결
연동 지점을 실제로 사용하는 서비스로 향하게 합니다.
- 6
검증
프로젝트 자체의 품질 게이트를 로컬에서 실행합니다.
- 7
배포
여러분의 저장소와 계정에서 빌드해 배포합니다.
- 8
유지와 업그레이드
여러분의 자산을 덮어쓰지 않고 상위 개선을 받아들입니다.
저장소의 안내는 문제 해결을 포함한 모든 단계를 다룹니다.
권위 있는 문서
GitHub이 정규 기술 출처입니다. 이 사이트는 요약하고 저장소가 절차를 안내합니다.
Repository
전체 코드, 라이선스, 그리고 프로젝트가 무엇이고 무엇이 아닌지에 대한 선언.
README.md
프로젝트의 내용, 빠른 시작, 저장소 구조, 라이선스 입장.
ARCHITECTURE.md
아키텍처 스타일, 경계, 의존 방향, 연동 패턴.
CUSTOMIZING.md
하위 사용자를 위한 안내와 전체 구성 참조.
DEPLOYMENT.md
릴리스 런북과 배포 후 점검 목록.
BRAND_ASSETS.md
브랜드 자산 교체 계약: 교체 가능한 모든 시각 역할.
안내서
도입, 커스터마이즈, 브랜드, 콘텐츠, 업그레이드, 검증, 배포, 문제 해결 절차.
위의 각 목적지는 공개 저장소로 연결되며, 그곳에서 문서가 유지됩니다.
읽고, 실행하고, 바꾸세요
코드, 테스트, 문서가 근거입니다. 거기서 시작하세요.