Este projeto foi desenvolvido com o intuito de colocar em prĂĄtica meus conhecimentos de Desenvolvimento Web, especificamente tratando-se do uso do NextJS e Prismic. Aqui vocĂȘ pode conhecer um pouco sobre minhas hard skills.
As principais habilidades colocadas prĂĄtica nesse projeto foram:
- React.JS.
- Next.JS
- Typescript;
- SASS;
- Deploy com Vercel;
- ESLint;
O projeto Star Wars News consiste em um site voltado para o pĂșblico fĂŁ de Star Wars. Na plataforma Ă© possĂvel conhecer a respeito dos personagens de Star Wars e ver as Ășltimas notĂcias relacionadas ao universo de George Lucas.
Na pĂĄgina Home hĂĄ uma apresentação de boas-vindas e rolando a pĂĄgina hĂĄ a apresentação de alguns personagens de Star Wars. Futuramente pretendo incluir informaçÔes mais densas sobre os personagens, por isso acho importante dar destaque aqui que o site Ă© apenas um PROJETO FICTĂCIO que no momento Ă© apenas para colocar em prĂĄticas minhas hard skills.
Dando continuidade, na pĂĄgina ConteĂșdos estĂŁo os artigos mais recentes, os artigos sĂŁo clicĂĄveis e redirecionam para uma pĂĄgina com o conteĂșdo completo. AlĂ©m disso hĂĄ tambĂ©m a pĂĄgina Sobre onde vocĂȘ pode conhecer um pouco sobre a equipe que desenvolveu a plataforma e seguir as redes sociais dos mesmos.
Para testar o projeto na sua mĂĄquina pessoal siga os seguintes passos:
- Clone o repositĂłrio:
git@github.com:Tassio-Med/starwars-news.git
- Instale os pacotes npm:
npm install
Para a construção visual do projeto foi utilizado SASS e a biblioteca React-icons para adicionar Ăcones SVG. No projeto foi utilizada a seguinte paleta de cores:
HEX | RGB | Cor |
---|---|---|
#fff |
255, 255, 255 |
|
##afafaf |
175, 175, 175 |
|
#525252 |
82, 82, 82 |
|
#15171b |
21, 23, 27 |
|
#111113 |
17, 17, 19 |
|
#1fa4e5 |
31, 164, 229 |
|
#ffbe16 |
31, 164, 229 |
Neste projeto foi utilizado o ESLint para fazer a anĂĄlise estĂĄtica do cĂłdigo. Ajudando a garantir a qualidade do cĂłdigo de forma a tĂȘ-lo mais legĂvel, de mais fĂĄcil manutenção e seguindo as boas prĂĄticas de desenvolvimento.