App di Autenticazione Next.js

Questa è un'applicazione Next.js che implementa l'autenticazione utilizzando NextAuth.js. L'app offre percorsi protetti che richiedono agli utenti di essere autenticati per accedere a determinate pagine.

Struttura del Progetto

nextjs-auth-app
├── components
│   ├── Layout.js          # Layout component for consistent structure
│   ├── Navbar.js          # Navigation bar component
│   └── ProtectedRoute.js   # Component to protect routes
├── pages
│   ├── _app.js            # Custom App component
│   ├── _document.js       # Custom Document structure
│   ├── api
│   │   └── auth
│   │       └── [...nextauth].js # NextAuth.js configuration
│   ├── dashboard.js       # Protected Dashboard page
│   ├── index.js           # Landing page
│   ├── login.js           # Login page
│   └── profile.js         # User Profile page
├── public                 # Static assets
├── styles
│   ├── Home.module.css    # CSS module for Home component
│   └── globals.css        # Global CSS styles
├── utils
│   └── auth.js            # Utility functions for authentication
├── .env.local             # Environment variables
├── next.config.js         # Next.js configuration
├── package.json           # npm configuration
└── README.md              # Project documentation

Per Iniziare

Per iniziare con questo progetto, segui questi passaggi:

1. Clona il repository:

   root@kitploit:~

   git clone <repository-url>
   cd nextjs-auth-app
   

2. Installa le dipendenze:

   root@kitploit:~

   npm install
   

3. Configura le variabili d'ambiente: Crea un file .env.local nella directory radice e aggiungi le tue variabili d'ambiente, come chiavi API e segreti.

4. Avvia il server di sviluppo:

   root@kitploit:~

   npm run dev
   

5. Apri il browser: Vai su http://localhost:3000 per visualizzare l'applicazione.

Funzionalità

• Autenticazione: Gli utenti possono effettuare il login e accedere a percorsi protetti.
• Percorsi Protetti: Il componente ProtectedRoute garantisce che solo gli utenti autenticati possano accedere a determinate pagine come la Dashboard e il Profilo.
• Design Responsivo: L'applicazione è progettata per essere reattiva e user-friendly.

Contributi

Se desideri contribuire a questo progetto, per favore fai il fork del repository e invia una pull request con le tue modifiche.

Licenza

Questo progetto è concesso in licenza con la licenza MIT. Vedi il file LICENSE per maggiori dettagli.