A full-stack template with Next.js frontend and Express backend.

• client/: Next.js frontend with TypeScript and Tailwind CSS
• server/: Express.js backend

# Install dependencies for the root, client, and server
npm run install:all

# Run both client and server in development mode
npm run dev

cd client
npm install
npm run dev

cd server
npm install
npm run dev

The root package.json includes several useful scripts:

• npm run dev - Run both client and server in development mode
• npm run install:all - Install dependencies for root, client, and server
• npm run client - Run only the client
• npm run server - Run only the server
• npm run build - Build the client for production
• npm run start - Start both client and server in production mode

• Next.js with TypeScript and Tailwind CSS
• API service with Axios for frontend
• Express backend with organized folder structure
• Database-agnostic approach - integrate any database you prefer
• Environment configuration with .env files
• Development setup with Nodemon
• Concurrently for running both services

This template includes a ready-to-use API integration between the client and server:

• The client's API service (client/src/services/api.js) is pre-configured to connect to the Express backend
• Environment variables control the API URL for easy deployment to different environments
• Authentication tokens are automatically included in requests through Axios interceptors
• Error handling is built-in with proper responses

Extending the API with your own endpoints is straightforward:

1. Create a Controller: Add your business logic in a new file in server/controllers/

   // Example: server/controllers/productController.js
   export const getAllProducts = async (req, res) => {
     // Your logic here
     res.json({ products: [] });
   };

2. Define Routes: Create a routes file in server/routes/

   // Example: server/routes/productRoutes.js
   import express from 'express';
   import { getAllProducts } from '../controllers/productController.js';
   
   const router = express.Router();
   router.get('/', getAllProducts);
   
   export default router;

3. Register Routes: Add your routes in server/server.js

   import productRoutes from './routes/productRoutes.js';
   // ...
   app.use('/api/products', productRoutes);

4. Create Client Service: Add a service in the client to consume your API

   // Example: client/src/services/api.js
   export const productService = {
     getProducts: async () => {
       const response = await api.get('/products');
       return response.data;
     }
   };

Now your new endpoint is ready to use throughout your application!

This template includes a complete authentication system example:

1. Backend API Endpoints:

   • POST /api/auth/register - Register a new user
   • POST /api/auth/login - Login with email and password

2. Frontend Integration:

   • The homepage includes a login form example
   • Authentication service with token management
   • Axios interceptors for adding auth tokens to requests

3. Token-based Authentication:

   • JWT (JSON Web Token) for secure authentication
   • Token expiration handling
   • Protected routes on the backend

See individual README files in each directory for more detailed information.