Skip to content

unamednada/shopping-cart

Folders and files

NameName
Last commit message
Last commit date

Latest commit

d63c879 · Sep 15, 2022

History

10 Commits
Jul 13, 2022
Jul 13, 2022
Jul 13, 2022
Jul 13, 2022
Jul 13, 2022
Jul 13, 2022
Jul 13, 2022
Sep 15, 2022
Jul 13, 2022
Jul 13, 2022
Jul 13, 2022
Jul 13, 2022
Jul 13, 2022

Repository files navigation

Shopping Cart

Projeto front-end com HTML, CSS e JS. Neste projeto há o consumo de uma API pública e persistência no local storage do navegador do cliente.

Simulador de front-end de um site e-commerce simples, envolvendo uma tela com produtos para serem selcionados, um carrinho de compras e o total da venda.

Projeto incentivado pela Trybe, no módulo de front-end do curso de Desenvolvimento Web.


Habilidades

- Fazer requisições a uma API *(Application Programming Interface)* do Mercado Livre;

- Utilizar os seus conhecimentos sobre JavaScript, CSS e HTML;

- Trabalhar com funções assíncronas;

Protótipo do projeto

Project Gif

🗒 PARA RODAR O SHOPPING LOCALMENTE:

  1. Clone o repositório
  • git clone git@github.com:unamednada/shopping-cart.git
  • Entre na pasta do repositório que você acabou de clonar:
    • cd shopping-cart
  1. Instale as dependências e inicialize o projeto
  • Instale as dependências:
    • npm install
  1. Rode o servidor e vá até http://localhost:3000 no seu navegador
  • Verifique que a sua porta 3000 está livre no localhost:
    • sudo ss -plnut
  • Agora, execute o servidor
    • npm start

🗒 PARA CONTRIBUIR COM O SHOPPING CART:

  1. Clone o repositório
  • git clone git@github.com:unamednada/shopping-cart.git
  • Entre na pasta do repositório que você acabou de clonar:
    • cd shopping-cart
  1. Instale as dependências e inicialize o projeto
  • Instale as dependências:
    • npm install
  1. Crie uma branch a partir da branch master
  • Verifique que você está na branch master
    • Exemplo: git branch
  • Se não estiver, mude para a branch master
    • Exemplo: git checkout master
  • Agora, crie uma branch onde você vai guardar os commits do seu projeto
    • Você deve criar uma branch no seguinte formato: nome-de-usuario-feat-descricao
    • Exemplo: git checkout -b mariazinha-feat-mobile-design
  1. Adicione as mudanças ao stage do Git e faça um commit
  • Verifique que as mudanças ainda não estão no stage
    • Exemplo: git status (devem aparecer listados os novos arquivos em vermelho)
  • Adicione o novo arquivo ao stage do Git
    • Exemplo:
      • git add . (adicionando todas as mudanças - que estavam em vermelho - ao stage do Git)
      • git status (devem aparecer listados os arquivos em verde)
  • Faça o commit inicial
    • Exemplo:
      • git commit -m 'Feat: mobile responsive design' (fazendo o primeiro commit)
      • git status (deve aparecer uma mensagem tipo nothing to commit )
  1. Adicione a sua branch com o novo commit ao repositório remoto
  • Usando o exemplo anterior: git push -u origin mariazinha-feat-mobile-design
  1. Crie um novo Pull Request (PR)
  • Vá até a página de Pull Requests do repositório no GitHub
  • Clique no botão verde "New pull request"
  • Clique na caixa de seleção "Compare" e escolha a sua branch com atenção
  • Adicione uma descrição para o Pull Request, um título que o identifique, e clique no botão verde "Create pull request". Crie da seguinte forma: [MARIAZINHA][FEAT]Mobile design
  • Adicione uma descrição para o Pull Request, um título claro que o identifique, e clique no botão verde "Create pull request"
  • Não se preocupe em preencher mais nada por enquanto!
  • Volte até a página de Pull Requests do repositório e confira que o seu Pull Request está criado

⚠️ Aguarde review do seu PR ⚠️

Depois que as mudanças forem revisadas, elas poderão ser incorporadas, ou você pode ter que fazer uma mudança pra que elas sejam revisadas novamente. Fique de olho!


Linter

Para garantir a qualidade do código, vamos utilizar neste projeto os linters ESLint e StyleLint. Assim o código estará alinhado com as boas práticas de desenvolvimento, sendo mais legível e de fácil manutenção! Para rodá-los localmente no projeto, execute os comandos abaixo:

npm run lint
npm run lint:styles

Quando é executado o comando npm run lint:styles, ele irá avaliar se os arquivos com a extensão CSS estão com o padrão correto.

Quando é executado o comando npm run lint, ele irá avaliar se os arquivos com a extensão JS e JSX estão com o padrão correto.

Depois de terminar o desenvolvimento

Para "entregar" suas mudanças, siga os passos a seguir:

  • Vá até a página DO SEU Pull Request, adicione a label de "code-review" e marque seus colegas
    • No menu à direita, clique no link "Labels" e escolha a label code-review
    • No menu à direita, clique no link "Assignees" e escolha o seu usuário

⚠ Lembre-se que garantir que todas as issues comentadas pelo Lint estão resolvidas! ⚠


About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published