diff --git a/README.md b/README.md
index 1fc82f9..9057937 100644
--- a/README.md
+++ b/README.md
@@ -1,48 +1,83 @@
-This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+
QUE FILME
-## Getting Started
+
+
-First, run the development server:
+
+
+
+
+
+
+
-```bash
-npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-# or
-bun dev
-```
+
+
+
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+
+
+
+
+
+ Que Filme aims to find the best movie and series suggestions for the user based on their previous choice of favorite titles. 🎥 🍿 ✨
+
+
-You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
+## 🛠 Technologies
-[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
+The tools below were used in the project's development:
-The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
+- [Next.js 14](https://nextjs.org/)
+- [TypeScript](https://www.typescriptlang.org/)
+- [Toastify](https://fkhadra.github.io/react-toastify/introduction)
+- [@emotion](https://emotion.sh/docs/introduction)
+- [React Icons](https://react-icons.github.io/react-icons)
+- [@svgr](https://react-svgr.com/docs/webpack/)
+- [Axios](https://axios-http.com/docs/intro)
+- [G4F](https://www.npmjs.com/package/g4f)
+- [Testing Library](https://testing-library.com/docs/react-testing-library/example-intro/)
+- [Jest](https://jestjs.io/docs/next/testing-frameworks)
-This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
+## ⚙ Installation
-## Learn More
+1. Clone and set up this repository [Que Filme](https://github.com/werlleyg/quefilme)
+2. Run `npm i` or `yarn` in the project folder on your computer
+3. Run `npm run dev` or `yarn dev`
+4. Your project is already running 🔭
-To learn more about Next.js, take a look at the following resources:
+
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+## 🏗️ Infrastructure Diagram
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+The project is hosted at Vercel and is accessible by the user from any device with internet browsing. The project also uses integration with two service providers, one for movies and the other for AI.
-## Deploy on Vercel
+
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+## 🔗 Architecture Diagram
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
+The project was built adapting clean arch concepts to the context of Next.js. It has its division into layers, which are below:
-### to send push
+- **Domain:** Concentrates important information for business rules, such as entities, enums, errors, service, providers, protocols, and usecases contracts;
-```
-rm -rf yarn.lock node_modules
-rm -rf node_modules
-yarn --frozen-lockfile
-```
+- **Infrastructure:** The implementation of service contracts, proviers, protocols and usecases is carried out;
+
+- **Main:** In this layer, the factory pattern is carried out to instantiate the elements created in the infrastructure, in addition to aggregating project configurations such as environment variables and build settings;
+
+- **Presentation + Pages:** Outermost layer of design, talking directly to the framework used, responsible for creating the components, typography and global stylizations. The Pages directory, responsible for concentrating the pages of the application, is separated by limitations of the framework itself in dealing with this resource. Consider Pages as part of Presentation.
+
+
+
+
+
+## 🚀 CI/CD Flow
+
+
+
+
+
+
+Developed by Werlley Ponte
+
+---
diff --git a/docs/images/architecture-diagram.png b/docs/images/architecture-diagram.png
new file mode 100644
index 0000000..e02701f
Binary files /dev/null and b/docs/images/architecture-diagram.png differ
diff --git a/docs/images/cicd-flow.png b/docs/images/cicd-flow.png
new file mode 100644
index 0000000..9ef210e
Binary files /dev/null and b/docs/images/cicd-flow.png differ
diff --git a/docs/images/infrastructure-diagram.png b/docs/images/infrastructure-diagram.png
new file mode 100644
index 0000000..07c3d31
Binary files /dev/null and b/docs/images/infrastructure-diagram.png differ
diff --git a/package.json b/package.json
index 78f0e75..7fb4886 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "quefilme",
- "version": "0.0.5",
+ "version": "0.0.6",
"private": true,
"scripts": {
"dev": "next dev",
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index fdf8810..68191f2 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -25,6 +25,7 @@ import { Environment } from "@/main/config";
import { makeGetMovieSuggestionUsecase } from "@/main/factories/usecases/getMovieSuggestion.factory";
import { toast } from "react-toastify";
import { snackbarMessage } from "@/domain/enums/snackbar.enum";
+import Link from "next/link";
export function Home() {
const [value, setValue] = useState();
@@ -159,7 +160,14 @@ export function Home() {