/COOKENU

Primary LanguageJavaScript

šŸ“Œ PROJETO COOKENU šŸ° šŸœ šŸ—


šŸ‘‰ Status: ConcluĆ­do āœ…šŸ‘

Esse projeto Ʃ um site de Receitas. O usuƔrio poderƔ se cadastrar no site, fazer login, visualizar todas as receitas, ver os detalhes da receita e cadastrar novas receitas.


šŸ”— Link do Surge:

https://obtainable-faucet.surge.sh/login

šŸ“± Responsividade:

  • Para uma melhor experiĆŖncia da aplicaĆ§Ć£o, recomendados a visualiaĆ§Ć£o em dispositivos iPhone 6/7/8.

Tela de login:  

A pĆ”gina de login possui dois campos de texto: e-mail e senha.Ao fazer o login, o usuĆ”rio deverĆ” ser redirecionado para a pĆ”gina de Lista de Receitas. A pĆ”gina possui tambĆ©m um botĆ£o "Cadastrar", que leva o usuĆ”rio para a pĆ”gina de cadastro. 

Tela de cadastro:

A pĆ”gina de cadastro possui 3 campos: nome de usuĆ”rio, email e senha. ApĆ³s cadastrar, o usuĆ”rio deverĆ” ser redirecionado para a pĆ”gina de Lista de Receitas, jĆ” estando logado.

Tela de Lista de Receitas:

Essa pĆ”gina sĆ³ pode ser acessada por um usuĆ”rio logado. Caso o usuĆ”rio nĆ£o esteja logado, deverĆ” ser redirecionado para a pĆ”gina de login. Essa pĆ”gina mostrarĆ” cards com receitas, o usuĆ”rio poderĆ” clicar no card para ver os detalhes. MostrarĆ” tambĆ©m um botĆ£o com o sinal de +, para o usuĆ”rio clicar e ser direcionado para a pĆ”gina de adicionar receitas.

 

Detalhes da Receita:

A pĆ”gina de detalhes mostrarĆ” o mesmo card da pĆ”gina de Lista de Receitas, com a imagem, nome da receita e descriĆ§Ć£o. Essa pĆ”gina sĆ³ pode ser acessada por um usuĆ”rio logado. Caso o usuĆ”rio nĆ£o esteja logado, deverĆ” ser redirecionado para a pĆ”gina de login.

Adicionar Receita:

Essa pĆ”gina sĆ³ pode ser acessada por um usuĆ”rio logado. Caso o usuĆ”rio nĆ£o esteja logado, deverĆ” ser redirecionado para a pĆ”gina de login. A pĆ”gina possui 3 campos: nome da receita, link para imagem e descriĆ§Ć£o. ApĆ³s cadastrar, o usuĆ”rio deverĆ” ser redirecionado para a pĆ”gina de Lista de Receitas, jĆ” estando logado.

DocumentaĆ§Ć£o da API:

(https://documenter.getpostman.com/view/9133542/TVKEXwyh#241cd863-8731-4477-99dd-c724150c4ffe)

āœØ Funcionamento:

  • Rotas
  • Tela de login
  • Tela de cadastro
  • Tela de Lista de Receitas
  • Tela de Detalhes da Receita
  • Tela de Adicionar Receita
  • PĆ”gina de Erro
  • Responsividade para iPhones 6/7/8 e iPad

šŸ’» Tecnologias:

As seguintes tecnologias foram usadas na construĆ§Ć£o do projeto:

šŸŽØ Layout:

  • Material-UI
  • Styled-componentes

šŸ“‚ Como instalar o projeto:

Passo 1. Clone este repositĆ³rio:

$ git clone ....

Passo 2. Acesse a pasta do projeto no terminal/cmd:

$ cd cookenu

Passo 3. Instale as dependĆŖncias:

$ npm install

Passo 4. Rode o projeto:

$ npm run start

Passo 5. Abra em seu navegador o seguinte endereƧo: http://localhost:3000