+
Skip to content

annaluizafistarol/ComicStore

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

78 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Group 14

🚀✨ Proposta do Desafio

Bem-vindo(a) ao "ComicStore", um site onde é possível comprar as revistas de história em quadrinhos da Marvel, estando disponível para acesso no link: https://comic-store-five.vercel.app/.

Resultado Final

🎯✨ Objetivos

Este foi meu primeiro projeto utilizando React, após menos de uma semana de estudos para a sua implementação. Além disso, busquei desenvolver um site utilizando conceitos de LocalStorage e integração com a API da Marvel. É válido ressaltar que todo planejamento, elaboração, estudos e desenvolvimento foi realizado ao longo de nove dias, possuindo funcionalidades ainda em andamento (cadastro, perfil do usuário e compras). Caso queira saber um pouquinho mais do processo de elaboração e criação, fiz um breve benchmarking, elenquei possíveis referências e ideias de layout, escolhi as cores que possuíssem acessibilidade visual, e todo esse trajeto até chegar neste resultado final é possível visualizar no meu repositório do Figma. Para acesso basta entrar em contato comigo.

🧠✨ Dificuldades e o que aprendi

Tive a oportunidade de consolidar alguns conceitos de =

  • JavaScript (arrow function, return, map, filter, some e findIndex).
  • CSS (referenciar classes e tags de pai para filho para não interferir em outros componentes).
  • API (explorar documentação, utilização de token (chaves pública e privada) e criptografia com md5).
  • LocalStorage (onde minha maior dificuldade foi a junção do componente (useState e useEffect) com o LocalStorage).

Quanto ao React aprendi e implementei conceitos de =

  • Criação de componentes;
  • Utilização dos Hook’s com a elaboração de uma página reativa (wishlist) ao estado (state) da aplicação;
  • Utilização do import e export para variáveis e funções;
  • Estruturação de pastas e arquivos do projeto com a utilização do index.js;
  • Substituição do eventListener do JS;
  • Referenciar função, definindo a função no componente pai para ser executada no componente filho (Comic.js e WishList.js).

Por fim, pude descobrir um pedacinho do universo incrível das bibliotecas do Node, com a utilização do Axios (de forma superficial utilizei para fazer a requisição da API), MD5 (utilizei para criptografar informações do token da API), Carrousel (utilização de um componente pronto ao invés de criar um do zero) e React-router (de forma superficial para navegação entre as páginas).

🔧✨ Tecnologias utilizadas

Anna-React Anna-Js Anna-HTML Anna-CSS API da Marvel disponível em = https://developer.marvel.com/.


💻✨ Rodando o projeto

Observação: os testes referente ao layout e responsividade foram realizadas somente utilizando o Google Chrome e Android.

2023-01-31.22-35-15_Trim.mp4

🌺✨ Forma de contato

Anna-pic
Caso tenha alguma sugestão ou queira entrar em contato, fico a disposição 🥰💖


About

Projeto em React de um site de venda de Histórias em Quadrinhos da Marvel, consumindo API.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published
点击 这是indexloc提供的php浏览器服务,不要输入任何密码和下载