CRUD Application with Next.js and Firebase

English Version

Read the English version

Versão em Português

Leia a versão em português

---

English Version

This is a CRUD application built with Next.js, using Firebase for data persistence. The project follows the lessons from the Cod3r Web Development course.

Features

• Add, update, delete, and list clients.
• Integrated with Firebase for database operations.
• Responsive design with Tailwind CSS

Technologies Used

• Next.js
• Firebase
• TypeScript
• Tailwind CSS

Prerequisites

• Node.js
• npm or yarn
• Firebase (account and project configuration)

Setup and Installation

1. Clone the repository:

   git clone https://github.com/iaraflaminio/project-next-crud.git
   

2. Navigate to the project directory:

   cd project-next-crud
   

3. Install the dependencies:

   npm install
   # or
   yarn install
   

4. Configure Firebase

• Rename the .env.local.example file to .env.local
• Add your Firebase configuration to the .env.local file:

  NEXT_PUBLIC_FIREBASE_API_KEY=your_api_key
  NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your_auth_domain
  NEXT_PUBLIC_FIREBASE_PROJECT_ID=your_project_id
  

5. Run the development server:

   npm run dev
   #or
   yarn dev
   

6. Or build the project:

   npm run build
   

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

References

• Cod3r Web Development Course
• Next.js Documentation
• Firebase Documentation
• Tailwind Documentation

---

Screenshots

Adding a New Client / Adicionando um Novo Cliente

Deleting a Client / Deletando um Cliente

Editing a Client / Editando um Cliente

---

Versão em Português

Projeto CRUD com Next.js e Firebase

Esta é uma aplicação CRUD construída com Next.js, usando o Firebase para persistência de dados. O projeto segue as lições do curso de Desenvolvimento Web da Cod3r.

Funcionalidades

• Adicionar, atualizar, deletar e listar clientes.
• Integrado com o Firebase para operações de banco de dados.
• Design responsivo com Tailwind CSS.

Tecnologias Utilizadas

• Next.js
• Firebase
• TypeScript
• Tailwind CSS

Pré-requisitos

• Node.js
• npm ou yarn
• Firebase (conta e configuração do projeto)

Configuração e Instalação

1. Clone o repositório:

   git clone https://github.com/iaraflaminio/project-next-crud.git
   

2. Navegue até o diretório do projeto:

   cd project-next-crud
   

3. Instale as dependências:

   npm install
   # ou
   yarn install
   

4. Configure o Firebase

• Renomeie o arquivo .env.local.example para .env.local
• Adicione sua configuração do Firebase ao arquivo .env.local:

  NEXT_PUBLIC_FIREBASE_API_KEY=sua_api_key
  NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=seu_auth_domain
  NEXT_PUBLIC_FIREBASE_PROJECT_ID=seu_project_id
  

5. Execute o servidor de desenvolvimento:

   npm run dev
   # ou
   yarn dev
   

6. Ou construa o projeto:

   npm run build
   

7. Abra http://localhost:3000 com seu navegador para ver o resultado.

Referências

• Curso de Desenvolvimento Web da Cod3r
• Documentação do Next.js
• Documentação do Firebase
• Documentação do Tailwind