nextjs-boilerplate

Next.js boilerplate.

Demo

Stack

• devcontainer - a running Docker container with a well-defined tool/runtime stack and its prerequisites for a development environment.

• Next.JS - React framework.

• tailwindcss - A utility-first CSS framework for rapid UI development.

• Headless UI - Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.

• DaisyUI - Free and open-source Tailwind CSS component library.

• heroicons - A set of free MIT-licensed high-quality SVG icons for UI development.

• zustand - React state management.

• jest - JavaScript testing framework.

• react-testing-library - Simplified react testing library.

• msw - REST/GraphQL API mocking library for browser and Node.js.

Getting Started

1. Install dependencies:

pnpm install

2. Run the development server:

pnpm dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

Deploy

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out the Next.js deployment documentation for more details.

Deploy app to vercel:

npx vercel

Vist link provided in terminal.

Resources

• Next.js Documentation - learn about Next.js features and API.

• Learn Next.js - an interactive Next.js tutorial.

• vercel/next.js - Github for Next.js.