Logo | Sobre | Site | Tecnologias | Funcionalidades | Pendências | Imagens | Wireframe | Pré requisitos | Desenvolvedores
Logo para fundo escuro | Logo para fundo claro: |
---|---|
Projeto final de Frontend desenvolvido em React JS pelos alunos do curso Fullstack Web (integral) da Labenu, Turma Maryam, grupo 2. No projeto desenvolvemos uma aplicação web baseada em um aplicativo de delivery de comida onde o design foi desenvolvido pela designer Camila Mizutani e utilizamos uma API própria contendo todas as funções necessárias.
Abaixo segue o que foi utilizado na criação deste projeto:
🔗 ReactJS - O ReactJS é uma biblioteca JavaScript declarativa, eficiente e flexível para criar interfaces com o usuário. Ele permite compor UIs complexas a partir de pequenos e isolados códigos chamados “componentes”.
🔗 Styled-Components - Styled-components é uma biblioteca para React e React Native que permite que você use estilos ao nível de componente na sua aplicação. Eles são escritos em uma mistura de JavaScript com CSS.
🔗 Material-UI - O Material-UI fornece um componente opcional CssBaseline. Ele corrige algumas inconsistências nos navegadores e dispositivos, ao mesmo tempo em que fornece redefinições ligeiramente mais opinativas para elementos HTML comuns.
🔗 React Axios - Axios é um cliente HTTP baseado em Promises para fazer requisições. Pode ser utilizado tanto no navegador quanto no Node. js ou qualquer serviço de API.
🔗 React-router-dom - O React Router é uma lib completa para controle de rotas que permite que você consiga configurar as rotas utilizando o formato JSX e também disponibiliza uma API para você configurar diretamente via Javascript.
🔗 React Hooks - Eles permitem que você use o state e outros recursos do React sem escrever uma classe.
🔗 API - API é um conjunto de definições e protocolos usado no desenvolvimento e na integração de software de aplicações. API é um acrônimo em inglês que significa interface de programação de aplicações.
🔗 Metodologias Ágeis - Kanban -Kanban é um sistema visual de gestão de trabalho, que busca conduzir cada tarefa por um fluxo predefinido de trabalho.
- Tela inicial;
- Login;
- Cadastro de endereço;
- Sign up;
- Home page;
- Pesquisa;
- Carrinho;
- Restaurantes;
- Pedido em andamento;
- Perfil;
- Editar perfil;
- Editar endereço.
- Login;
- Signup;
- Add Address;
- Get Full Address;
- Get Profile;
- Update Profile;
- Get Restaurants;
- Get Restaurant Detail;
- Place Order;
- Get Active Order;
- Orders History.
- Versão Desktop
- Página de login, erro no usuário e erro na senha
- Página de cadastro
- Home - Página de restaurantes
- Página de busca por restaurantes e busca não encontrada
- Página de cardápio do restaurante
- Página do carrinho vazio, com produtos, pedido confirmado(em andamento), já existe outro pedido em andamento, falta esolher a forma de pagamento
- Página do perfil com histórico de Pedidos e edição de Cadastro
- Erro de página não encontrada
YouCut_20211105_210942111.mp4
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
$ node -v
v12.19.0
$ npm -v
6.14.5
# Clone este repositório
# HTTPS
$ git clone https://github.com/future4code/maryam-labe-food2.git
# SSH
$ git clone git@github.com:future4code/maryam-labe-food2.git
# CLI
$ gh repo clone future4code/maryam-labe-food2
# Acesse a pasta do projeto no terminal
$ cd ./maryam-labe-food2
# Instale as dependências
$ npm install
$ npm install axios
$ npm install react-router-dom
$ npm install styled-components
$ npm install @material-ui/core
$ npm install @material-ui/icons
# Para iniciar o projeto
$ npm run start
# O servidor inciará na porta:3000 - acesse <http://localhost:3000>
Argleydson Leão |
Maria Helena V. C. de Souza |
Silvio Ribeiro Dias Jr. |
Tainá Soares |
Magdiel Silva |
👥 Aguardamos o seu contato.