Portifólio implementado com Create React App no curso de React Router da Alura.
🪧 Vitrine.Dev | |
---|---|
✨ Nome | Hello World! |
🏷️ Tecnologias | javascript, html, styled-components, npm, react |
🚀 URL | https://hello-world-lucassmaniotto.vercel.app/ |
🖥 Curso | https://www.alura.com.br/curso-online-React-desenvolvendo-react-router-javaScript |
Este projeto é uma Single Page Application (SPA) desenvolvido em ReactJS utilizando React Router durante o curso React: desenvolvendo em React Router com JavaScript da Alura.
Para que o projeto funcione corretamente, é necessário instalar as dependências do projeto. Para isso, basta executar o comando abaixo no terminal:
npm install
No diretório do projeto, você pode executar:
npm start
Com o comando acima, você irá rodar o projeto em modo de desenvolvimento que pode ser acessado em http://localhost:3000 no seu navegador.
Visto que o projeto é uma SPA, o mesmo funciona como uma página só, através de rotas gerenciadas pelo React Router:
As rotas consistem em duas abas, uma de Home Page que possui meus projetos principais desenvolvidos e disponibilizados no Github, e uma página Sobre Mim que conta um pouquinho da minha história com programação, além de coisas que eu gosto bastante.
Para cada página de artigo, o conteúdo é renderizado em uma rota dinâmica projects/:id com o conteúdo de json de cada projeto no qual ocorre iterações sobre o mesmo e transformado em Markdown com o React Markdown:
Caso aconteça algum direcionamento de rota de erro, uma página 404 é renderizada com um cachorro salsicha informando possíveis causas e um botão de voltar a página anterior, seja ela Home, Sobre Mim ou de algum Projeto.
Ao final de cada artigo de Projeto, a página disponibiliza uma rota diferente para um próximo projeto, através de métodos do JavaScript de filter, sort e slice: