이 보일러판을 사용하여 생산 독서 웹 앱을 구축하십시오. Full-stack TypeScript, React 19, 및 인증, 암호화된 지속성, SEO, i18n, 접근성 및 현대 개발자 경험으로 모든 구성 및 확장 가능.

이 README가 누구인지

이 파일은 빠르게 구축하고 싶은 바이브 코더 및 주니어 개발자를위한 빠르고 실용적인 항목 포인트입니다.

딥 구현 세부 사항 (architecture, auth internals, reducer pattern, Agentflows)를 원하면 Deep Technical Context 섹션에서 연결된 docs를 사용합니다.

특징

• Core: TypeScript, React 19, Vite, Express, Passport auth (test user), 암호화된 localStorage persistence, Redux Toolkit (persistent + non-persistent slide), 게으른 로딩 페이지와 React Router
• SEO & 메타데이터: 사이트 맵, 구성 요소, React 19 문서 메타데이터 (제목, 설명, 오픈 그래프, Twitter, canonical), 정책 쓰기 가이드 페이지 -Accessibility: Skip-to-content 링크, 안정된 ID(useId), aria-live 공지([T2]]), Chakra UI

2026 Boilerplate for TypeScript/React v1.3

Use this boilerplate to build production-ready web apps. Full-stack TypeScript, React 19, and Express with authentication, encrypted persistence, SEO, i18n, accessibility, and a modern developer experience—all configured and ready to extend.

Who this README is for

This file is the fast, practical entry point for vibe coders and junior developers who want to start building quickly.

If you want deep implementation details (architecture, auth internals, reducer patterns, agent workflows), use the linked docs in the Deep Technical Context section.

Features

• Core: TypeScript, React 19, Vite, Express, Passport auth (test user), encrypted localStorage persistence, Redux Toolkit (persistent + non-persistent slices), React Router with lazy-loaded pages
• SEO & metadata: Sitemap, `` component, React 19 document metadata (title, description, Open Graph, Twitter, canonical), policy-writing guide page
• Accessibility: Skip-to-content link, stable IDs (useId), aria-live announcements (useAnnounce), Chakra UI
• i18n: react-intl, locales (en, ar, fr, zh), RTL for Arabic, language switcher, English fallback—use it or ignore it; when you need translation, it’s ready
• UX and polish: Page transitions (``), animated buttons (Framer Motion), scroll-to-top on route change, light/dark mode
• Resilience: Error boundaries, centralized client error handler, server error-handler middleware, Suspense boundaries
• Developer experience: Vitest unit tests (npm run test:unit), Playwright E2E, ESLint (custom config), type-check script, npm run test for full pre-commit/CI (lint + type-check + unit + E2E)

Getting Started

Start a New Project from This Boilerplate

Use this workflow when you want to turn this repository into your own product instead of contributing back.

1. Clone the repo: git clone [email protected]:bishopZ/2026-Boilerplate.git and cd 2026-Boilerplate
2. Remove git history: rm -rf .git then git init
3. Run the rebrand skill with your new project details: Use the skill at skills/rebrand/SKILL.md with site_title="" and site_description=""
4. Create your first commit
5. Run the Development Setup below

Development Setup

1. Copy the env template: cp .envTemplate .env — default values work for local development; set strong random values for SESSION_SECRET and LOCAL_STORAGE_KEY before deploying to production
2. Run npm install
3. Run npm run dev
4. Login with username test and password test

Build Fast (Most Common Commands)