Next.js Template

This is a template repository showcasing Next.js Server Actions, React Server Components, and modern data fetching patterns. The project includes a Todo list implementation and examples of API integration with proper loading states and error handling.

Features

• Todo List: Server-side data mutations using Next.js Server Actions
• Data Fetching Example: Demonstrates React Suspense and loading states
• Modern UI: Built with Shadcn UI components and Tailwind CSS
• Error Handling: Proper error boundaries and user feedback
• Type Safety: Full TypeScript support

Tech Stack

• Next.js - React framework
• Shadcn UI - Component library
• Tailwind CSS - Styling
• TypeScript - Type safety

Getting Started

1. Clone the repository
2. Install dependencies:

npm install
# or
yarn install
# or
pnpm install

3. Set up your environment variables in the .env file.

4. Start the development server:

npm run dev
# or
yarn dev
# or
pnpm dev

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

Project Structure

• app/page.tsx - Main page with Todo list implementation
• app/example/page.tsx - Data fetching example with loading states
• app/actions/* - Server Actions for data mutations
• components/ui/* - Shadcn UI components

Learn More

To learn more about the technologies used in this project:

• Next.js Documentation - Next.js features and API
• Server Actions - Learn about Next.js Server Actions
• Shadcn UI Documentation - Learn about Shadcn UI components
• Tailwind CSS Documentation - Learn about Tailwind CSS

Deploy on Vercel

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

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