web-app-template
A minimal web service template ๐ "npx create-app-foundation@latest" !
ํ์ผ ํ์๊ธฐ
์ต์ข ๋ฒ์ ๋ค์ด๋ก๋ (.zip)- action.yml
- action.yml
- ci.yml
- claude-code-review.yml
- claude.yml
- internal.yml
- site.yml
- update-internal-e2e.yml
- git.mjs
- index.mjs
- package.json
- pnpm-lock.yaml
- README.md
- app-(public)-page.tsx
- app-layout.tsx
- docker.mjs
- e2e.mjs
- index.mjs
- otel.mjs
- sample-code.mjs
- stripe.mjs
- common-processing.mjs
- db.mjs
- format.mjs
- init.mjs
- package-json.mjs
- utils.mjs
- config.mts
- code-quality-automation.md
- e2e-testing.md
- next-auth.md
- nextjs.md
- observability.md
- prisma.md
- stripe.md
- unit-testing.md
- challenges-solved.md
- dotenv.md
- getting-started.md
- routing.md
- tasks.md
- what-is-web-app-template.md
- biome.png
- copilot.png
- docker.png
- editorconfig.png
- github-actions.png
- knip.png
- lefthook.png
- next-auth.png
- nextjs.png
- otel.png
- playwright.png
- pnpm.svg
- postgresql.png
- prettier.png
- prisma.png
- react-hook-form.png
- renovate.png
- stripe.png
- tailwind.png
- testcontainers.png
- testing-library.png
- typescript.png
- vitest.png
- vscode.png
- zod.svg
- stripe-cancel-flow.png
- stripe-checkout-flow.png
- stripe-webhook-flow.png
- query.png
- root-metric.png
- icon.png
- favicon.ico
- index.md
- package-lock.json
- package.json
- all-opt-out.test.mjs
- Basetest.mjs
- common.test.mjs
- common.test.mjs.snapshot
- makefile
- no-docker.test.mjs
- no-docker.test.mjs.snapshot
- no-e2e.test.mjs
- no-e2e.test.mjs.snapshot
- no-otel.test.mjs
- no-otel.test.mjs.snapshot
- no-sample-code.test.mjs
- no-sample-code.test.mjs.snapshot
- no-stripe.test.mjs
- no-stripe.test.mjs.snapshot
- .gitignore
- README.md
- extensions.json
- mcp.json
- settings.json
- itemPage.test.ts
- mePage.test.ts
- notFoundPage.test.ts
- signInPage.test.ts
- topPage.test.ts
- app.ts
- getRandomPort.ts
- prisma.ts
- users.ts
- waitForHealth.ts
- auth.test.ts
- item.test.ts
- user.test.ts
- Base.ts
- ItemPage.ts
- MePage.ts
- NotFoundPage.ts
- SignInPage.ts
- TopPage.ts
- auth.ts
- dummyUsers.ts
- fixtures.ts
- item.prisma
- schema.prisma
- user.prisma
- .gitkeep
- UpdateMyInfo.tsx
- PaymentButton.tsx
- page.tsx
- page.tsx
- layout.tsx
- ItemManager.tsx
- page.tsx
- page.tsx
- layout.tsx
- page.tsx
- items.test.ts
- items.ts
- payment.test.ts
- payment.ts
- users.test.ts
- users.ts
- nextAuth.ts
- nextAuthConfig.ts
- prisma.ts
- stripe.ts
- AuthButtons.tsx
- Button.tsx
- Container.tsx
- ErrorPageTemplate.tsx
- Footer.tsx
- FormBox.tsx
- Header.tsx
- Input.tsx
- useFormId.test.ts
- useFormId.ts
- useOnlineStatus.test.ts
- useOnlineStatus.ts
- items.test.ts
- items.ts
- users.test.ts
- users.ts
- result.ts
- auth.test.ts
- auth.ts
- date.test.ts
- date.ts
- db.test.ts
- db.ts
- payment.test.ts
- payment.ts
- zod.test.ts
- zod.ts
- route.ts
- route.test.ts
- route.ts
- route.test.ts
- route.ts
- error.tsx
- favicon.ico
- global-error.tsx
- globals.css
- globals.d.ts
- layout.tsx
- not-found.tsx
- opengraph-image.tsx
- robots.txt
- node.ts
- instrumentation.ts
- proxy.test.ts
- proxy.ts
- db.setup.ts
- vitest.helper.ts
- vitest.setup.ts
- .dockerignore
- .editorconfig
- .env.sample
- .env.test
- .gitignore
- .node-version
- .npmrc
- biome.json
- compose.yml
- Dockerfile
- env.ts
- knip.config.ts
- lefthook.yml
- LICENSE
- next.config.ts
- otel-collector-config.yml
- package.json
- playwright.config.ts
- pnpm-lock.yaml
- pnpm-workspace.yaml
- postcss.config.mjs
- prisma.config.ts
- README.md
- renovate.json
- tsconfig.json
- vitest.config.ts
# ์ค์น ๊ฐ์ด๋
1. ์ฝ๋ ๋ด๋ ค๋ฐ๊ธฐ
git clone https://github.com/hiroppy/web-app-template
๊นํ๋ธ์์ ํ๋ก์ ํธ ์ฝ๋ ์ ์ฒด๋ฅผ ๋ด ์ปดํจํฐ๋ก ๋ด๋ ค๋ฐ์ต๋๋ค.
cd web-app-template
๋ฐฉ๊ธ ๋ด๋ ค๋ฐ์ ํ๋ก์ ํธ ํด๋ ์์ผ๋ก ์ด๋ํฉ๋๋ค.
2. Docker
์ฌ์ ์ถ์ฒ์ฌ์ ์ค๋น๋ฌผ
- Git GitHub์์ ํ๋ก์ ํธ ์ฝ๋๋ฅผ ๋ด๋ ค๋ฐ์ผ๋ ค๋ฉด ํ์ํฉ๋๋ค.
- Docker Desktop ์ปจํ ์ด๋๋ฅผ ๋น๋ํ๊ณ ์คํํ๋ ค๋ฉด ํ์ํฉ๋๋ค. ์ค์น ํ ์คํํด์ ๋ฐฑ๊ทธ๋ผ์ด๋์ ์ผ๋์ธ์.
docker compose up -d --build
์ ์๋ ๋ชจ๋ ์ปจํ ์ด๋(์๋ฒ, DB ๋ฑ)๋ฅผ ํ ๋ฒ์ ๋น๋ํ๊ณ ๋ฐฑ๊ทธ๋ผ์ด๋์์ ์คํํฉ๋๋ค.
ํฐ๋ฏธ๋์ docker compose ps ๋ฅผ ์
๋ ฅํด ์ปจํ
์ด๋๋ค์ด Up ์ํ์ธ์ง ํ์ธํ์ธ์. README์ ํฌํธ ๋ฒํธ๊ฐ ์ ํ์๋ค๋ฉด ๋ธ๋ผ์ฐ์ ์์ http://localhost:ํฌํธ๋ฒํธ ๋ก ์ ์ํด๋ณด์ธ์.
3. Node.js
์ฌ์์ฌ์ ์ค๋น๋ฌผ
$ npm run setup
์ด ๋ช ๋ น์ด๋ฅผ ํฐ๋ฏธ๋์ ๊ทธ๋๋ก ์ ๋ ฅํด ์คํํ์ธ์.
$ pnpm i
์ด ๋ช ๋ น์ด๋ฅผ ํฐ๋ฏธ๋์ ๊ทธ๋๋ก ์ ๋ ฅํด ์คํํ์ธ์.
$ pnpm dev
๊ฐ๋ฐ/์คํ ์๋ฒ๋ฅผ ์ผญ๋๋ค.
$ pnpm dev:stripe
๊ฐ๋ฐ/์คํ ์๋ฒ๋ฅผ ์ผญ๋๋ค.
$ pnpm db:up
์ด ๋ช ๋ น์ด๋ฅผ ํฐ๋ฏธ๋์ ๊ทธ๋๋ก ์ ๋ ฅํด ์คํํ์ธ์.
๋ช
๋ น์ด ์คํ ํ ํฐ๋ฏธ๋์ ๋ํ๋๋ ์ฃผ์(๋ณดํต http://localhost:3000 ํํ)๋ฅผ ๋ธ๋ผ์ฐ์ ์์ ์ด์ด๋ณด์ธ์.
์ด ๋ ํฌ์ README์ ์ ํ ์ค์ ๋ช ๋ น์ด๋ฅผ ๊ทธ๋๋ก ๊ฐ์ ธ์์ต๋๋ค.
// repository documentation
Was this content helpful?
(0 ratings)