https://github.com/lazaroalvesr/nextauthmasterclass
Projeto de autenticação utilizando Next.js e NextAuth.js. A aplicação demonstra a integração completa de autenticação, incluindo login com provedores externos e sessão persistente. Ideal para aprender a implementar autenticação em aplicações Next.js de forma segura e eficiente.
https://github.com/lazaroalvesr/nextauthmasterclass
Last synced: 3 months ago
JSON representation
Projeto de autenticação utilizando Next.js e NextAuth.js. A aplicação demonstra a integração completa de autenticação, incluindo login com provedores externos e sessão persistente. Ideal para aprender a implementar autenticação em aplicações Next.js de forma segura e eficiente.
- Host: GitHub
- URL: https://github.com/lazaroalvesr/nextauthmasterclass
- Owner: lazaroalvesr
- Created: 2024-03-23T13:10:53.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2025-01-26T18:22:35.000Z (5 months ago)
- Last Synced: 2025-01-26T19:28:05.150Z (5 months ago)
- Language: TypeScript
- Homepage: https://next-auth-master-class-gamma.vercel.app
- Size: 142 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# NextAuthMasterClass
**NextAuthMasterClass** é uma aplicação full-stack construída com **Next.js**, **NextAuth.js**, e diversas outras tecnologias modernas. O projeto demonstra como configurar autenticação de usuários, validação de dados, envio de emails e outros recursos com integração de UI moderna usando **shadcn/ui**.
## Tecnologias Utilizadas
- **Next.js**: Framework React para construção de aplicações full-stack.
- **NextAuth.js**: Biblioteca de autenticação para Next.js, facilitando a integração com provedores de autenticação como Google, GitHub, etc.
- **Prisma**: ORM para Node.js e TypeScript, utilizado para gerenciar o banco de dados e realizar operações de leitura e escrita.
- **Zod**: Biblioteca de validação de dados para garantir a integridade e segurança das informações no projeto.
- **shadcn/ui**: Biblioteca de componentes UI para React, que oferece uma forma rápida de criar interfaces bonitas e funcionais.
- **Resend**: Serviço de envio de emails, utilizado para gerenciar o envio de emails de forma fácil e eficiente.
- **Sonner**: Biblioteca de notificações para exibir mensagens de sucesso e erro para o usuário.
- **TailwindCSS**: Framework de CSS para estilização rápida e responsiva.## Funcionalidades
- **Autenticação com Provedores Externos**: Integração com provedores de autenticação como **Google** e **GitHub** utilizando **NextAuth.js**.
- **Validação de Dados**: **Zod** é usado para validar dados do formulário, garantindo segurança e qualidade.
- **Envio de Emails**: **Resend** é utilizado para enviar emails de maneira fácil e rápida para os usuários.
- **Notificações**: **Sonner** é utilizado para mostrar notificações interativas de sucesso ou erro para o usuário.
- **Banco de Dados**: **Prisma** gerencia o banco de dados, permitindo fácil acesso e manipulação de dados no banco.
- **Estilização Responsiva**: **TailwindCSS** é utilizado para a criação de interfaces modernas e responsivas.
- **Componentes de UI**: **shadcn/ui** proporciona uma interface de usuário interativa e visualmente agradável, com componentes reutilizáveis e de fácil integração.## Instalação
1. Clone este repositório:
```bash
git clone https://github.com/lazaroalvesr/NextAuthMasterClass.git
```2. Navegue até o diretório do projeto:
```bash
cd NextAuthMasterClass
```3. Instale as dependências:
```bash
npm install
```4. Configure as credenciais para os provedores de autenticação no arquivo `.env.local`:
- **Google**: Para autenticação via Google, você precisa de um **Client ID** e **Client Secret** da Google Cloud Console.
- **GitHub**: Para autenticação via GitHub, você precisa de um **Client ID** e **Client Secret** do GitHub Developer Settings.
- **Resend**: Configure a API Key do **Resend** para envio de emails.```plaintext
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
GITHUB_CLIENT_ID=
GITHUB_CLIENT_SECRET=
RESEND_API_KEY=
```5. Execute o projeto:
```bash
npm run dev
```6. Acesse a aplicação no navegador em `http://localhost:3000`.
## Como Usar
1. Acesse a página de login da aplicação.
2. Clique no botão de autenticação para fazer login com **Google** ou **GitHub**.
3. Após a autenticação, você será redirecionado para a página principal da aplicação ou uma página protegida.
4. Utilize o envio de email e as notificações como parte do fluxo de interação com o usuário.## *✍️ *Autor**
- [@lazaroalvesr](https://github.com/lazaroalvesr)## 🔗 Links
[](https://www.lazaroalvesr.com/)
[](https://www.linkedin.com/in/l%C3%A1zaro-alves-r/)