lidianediniz / frontend_foodexplorer

Desafio final Explorer

Food Explorer

Seu Cardápio digital..

Status: Em desenvolvimento...

About • Features • Layout • Tech Stack • Author • License

💻 Sobre:

O aplicativo que desenvolveremos é um cardápio digital para um restaurante fictício, conhecido como foodExplorer. Neste desafio foram abordados os seguintes temas:

• React;
• Routes;
• components;
• Props;
• hooks;
• context;

---

Funcionalidades

• Um projeto estruturado, com uma boa organização das pastas, divisão de componentes no front-end, etc;
• Os dados do admin, do restaurante e dos usuários serão armazenados em um banco de dados;
• Os usuários deverão se autenticar para entrar na aplicação através da tela de login;
• Dê nomes significativos para as suas funções e variáveis: trabalhe um pouco com os conceitos do Clean Code;
• Possibilidade de fazer uma busca pelo nome do prato, pelos ingredientes ou por prato favorito;
• O admin irá fazer upload de imagens para cadastrar e editar tanto os pratos quanto os ingredientes;
• Interessante deixar a aplicação responsiva: utilize o conceito de Mobile First que foi aprendido em aula;
• Deixe o código mais acessível e semântico usando as dicas que foram passadas em aula;
• Fica a seu critério onde aplicar animações, transições e transformações;
• É essencial que a sua interface consuma a sua API;
• Para finalizar, faça o deploy da sua aplicação.

---

🎨 Layout

O layout da aplicação está disponível no Figma:

🚀 Como executar o projeto.

Este projeto é divido em duas partes:

1. Backend (API)
2. Frontend

💡O Backend deve estar rodando em sua máquina para que o frontend seja reenderizado. )

Pré-requisitos

Antes de começar, você vai precisar ter instalado em sua máquina as seguintes ferramentas: Git, Node.js. Além disto é bom ter um editor para trabalhar com o código como VSCode

🎲 Rodando o Back End (servidor)

# Clone este repositório
$ git clone https://github.com/LidianeDiniz/API_Food_Explorer.git

# Acesse a pasta do projeto no terminal/cmd
$ cd + sua pasta + git clone https://github.com/LidianeDiniz/API_Food_Explorer.git

# Instale as dependências
$ npm install

# Execute as migration e seed
$ npm migrate
$ npm seed

# Execute a aplicação em modo de desenvolvimento
$ npm run dev

# Login do admin
$ email: [email protected]
$ password: 112233

# O servidor inciará na porta:3333 - acesse <http://localhost:3333>

🎲 Rodando a aplicação (Frontend)

# Clone este repositório
$ https://github.com/LidianeDiniz/Frontend_foodExplorer.git

# Acesse a pasta do projeto no terminal/cmd
$ cd + sua pasta + git clone https://github.com/LidianeDiniz/Frontend_foodExplorer.git


# Instale as dependências com:
$ npm install

# Rode a aplicação em modo de desenvolvimento:
$ npm run dev

# O servidor inciará na porta:3333 - acesse <   http://127.0.0.1:5173/ >

---

🛠 Tecnologias

Este projeto foi desenvolvido com as seguintes tecnologias:

• HTML
• CSS
• JavaScript
• Node.js
• React.js

---

💻 Sobre:

O aplicativo que desenvolveremos é um cardápio digital para um restaurante fictício, conhecido como foodExplorer. Neste desafio foram abordados os seguintes temas:

---

Deploy do projeto.

https://food-explorer-lidiane-diniz.netlify.app/

---

📝 License

This project is under the license MIT.

Made with ❤️ by Lidiane Diniz Get in Touch!

---