Giter VIP home page Giter VIP logo

coffe-delivery's Introduction

coffe-delivery

NPM

Sobre o projeto

https://coffe-delivery-sandy.vercel.app/

Segundo desafio da trilha de ReactJS do Ignite.

Aplicação para gerenciar um carrinho de compras de uma cafeteria fictícia no estilo E-commerce. Layout disponibilizado no Figma Layout.

Requisitos

  • Listagem de produtos (cafés) disponíveis para compra
  • Adicionar uma quantidade específicas de itens no carrinho
  • Aumentar ou remover a quantidade de itens no carrinho
  • Formulário para o usuário preencher o seu endereço
  • Exibir o total de itens no carrinho no Header
  • Exibir o valor total da soma de itens no carrinho multiplicados pelo valor
  • (Extra) Conexão com api viacep para preenchimento automático do formulário
  • (Extra) Responsividade ao projeto

Conceitos Utilizados no Desenvolvimento

  • Estados
  • Imutabilidade do estado
  • Listas e chaves no ReactJS
  • Propriedades
  • Componentização
  • Conexão com Api via Cep utilizando fetch (Extra)
  • React Context
  • React useEffect
  • Styled Components
  • Media queries para responsividade (Extra)

Layout

Tecnologias utilizadas

Front end

  • ReactJS Com Typescript

Implantação em produção

  • Front end web: Vercel

Como executar o projeto

Front end web

Pré-requisitos: npm / yarn

# clonar repositório
git clone https://github.com/TarcisioCarvalho/coffe-delivery

# entrar na pasta do projeto front end web
cd coffe-delivery

# instalar dependências
npm install

# executar o projeto
npm rum dev

Autor

Tarcísio José de Amorim Carvalho

https://www.linkedin.com/in/tarcisio-jose-de-amorim-carvalho

coffe-delivery's People

Contributors

tarcisiocarvalho avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.