https://github.com/aleydon/next15
Next-15 template configured with React 19, typescript, eslint, prettier, husky (pre-commit), storybook, prisma, jest, testing-library and more...
https://github.com/aleydon/next15
full-stack fullstack javascript jest nextjs prisma prisma-orm react reactjs storybook tailwind tailwind-css tailwindcss template template-project testing-library typescript web website
Last synced: about 2 months ago
JSON representation
Next-15 template configured with React 19, typescript, eslint, prettier, husky (pre-commit), storybook, prisma, jest, testing-library and more...
- Host: GitHub
- URL: https://github.com/aleydon/next15
- Owner: Aleydon
- Created: 2025-02-19T23:14:02.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2026-05-15T19:30:24.000Z (about 2 months ago)
- Last Synced: 2026-05-15T22:19:51.759Z (about 2 months ago)
- Topics: full-stack, fullstack, javascript, jest, nextjs, prisma, prisma-orm, react, reactjs, storybook, tailwind, tailwind-css, tailwindcss, template, template-project, testing-library, typescript, web, website
- Language: TypeScript
- Homepage:
- Size: 1.9 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
๐ Next.js 15 Template ๐
## ๐ About The Project
This is a robust template for **Next.js 15** projects, pre-configured with a modern development stack to ensure productivity, code quality, and scalability. It includes tools for databases, testing, component documentation, and much more.
---
## โจ Key Features
- **Framework:** [Next.js 15](https://nextjs.org/)
- **Language:** [TypeScript](https://www.typescriptlang.org/)
- **Styling:** [Tailwind CSS](https://tailwindcss.com/)
- **Database:** [PostgreSQL](https://www.postgresql.org/) with [Prisma ORM](https://www.prisma.io/)
- **Containerization:** [Docker](https://www.docker.com/)
- **Testing:** [Jest](https://jestjs.io/) & [Testing Library](https://testing-library.com/)
- **Component Documentation:** [Storybook](https://storybook.js.org/)
- **Code Quality:** [ESLint](https://eslint.org/) & [Prettier](https://prettier.io/)
- **Standardized Commits:** [Commitizen](https://commitizen-tools.github.io/commitizen/), [Commitlint](https://commitlint.js.org/) & [Husky](https://typicode.github.io/husky/)
---
## ๐ฟ Branches
This project has multiple branches to showcase different database configurations:
- **`master`**: The main branch, configured with **Prisma ORM**.
- **`Aleydon`**: A development branch, also configured with **Prisma ORM**.
- **`Drizzle`**: This branch is configured with **Drizzle ORM**.
---
## ๐ Getting Started
### Prerequisites
- [Node.js](https://nodejs.org/en/) (version 18 or higher)
- [Docker](https://www.docker.com/get-started)
### Steps
1. **Clone the repository:**
```sh
git clone https://github.com/Aleydon/Next15.git
```
2. **Navigate to the project directory:**
```sh
cd Next15
```
3. **Install dependencies:**
```sh
npm install
```
4. **Set up environment variables:**
- Rename the `enviroment-example.env` file to `.env`.
- Fill in the required environment variables in the `.env` file.
5. **Start the Docker environment:**
- This command will build and start the PostgreSQL container.
```sh
npm run docker:start
```
6. **Run the database migrations:**
- This command will create the database tables based on your Prisma schema.
```sh
npm run prisma:migrate
```
7. **Start the development server:**
```sh
npm run dev
```
---
## ๐ Available Scripts
| Script | Description |
| ----------------- | --------------------------------------------------------------- |
| `dev` | Starts the Next.js development server. |
| `build` | Builds the application for production. |
| `start` | Starts a production server. |
| `lint` | Runs ESLint to analyze and fix the code. |
| `docker:start` | Starts the services defined in `docker-compose.yml`. |
| `prisma:migrate` | Runs Prisma migrations to update the database. |
| `prisma:generate` | Generates the Prisma Client based on your schema. |
| `prisma:studio` | Opens Prisma Studio to view and edit your data. |
| `test` | Runs the unit and integration tests. |
| `test:watch` | Runs the tests in watch mode. |
| `commit` | Starts the Commitizen assistant to create standardized commits. |
| `storybook` | Starts Storybook to view and develop components. |
| `build-storybook` | Builds Storybook for production. |
---
## ๐ณ Docker
The development environment uses Docker to manage the PostgreSQL database.
- **Start the container:**
```sh
npm run docker:start
```
This command will build and start the database container in the background.
---
## ๐ฟ Prisma
Prisma is used as an ORM to interact with the database.
- **Apply migrations:**
```sh
npm run prisma:migrate
```
Creates and applies migrations to the database based on `schema.prisma`.
- **Generate Prisma Client:**
```sh
npm run prisma:generate
```
Generates or updates the Prisma Client whenever `schema.prisma` is modified.
- **Open Prisma Studio:**
```sh
npm run prisma:studio
```
Opens a visual interface in the browser to view and manage the database data.
---
## ๐งช Testing
This project uses **Jest** and **Testing Library** for testing.
- To run the tests, execute:
```sh
npm run test
```
- To run the tests in watch mode:
```sh
npm run test:watch
```
A test example can be found in `src/app/page.spec.tsx`.
---
## ๐จ Storybook
Visualize and develop your components in isolation with **Storybook**.
- To start Storybook:
```sh
npm run storybook
```
A story example can be found in `src/app/components/Text/text.stories.tsx`.