Sobre a aplicação | Interfaces | Stacks | Rodando Aplicação | Por que? |
Essa é uma aplicação voltado para o desenvolvimento de Dashboard que aborda apresentação e exemplo de autenticação de login, implementação de uso de gráficos, crud de usuários, listagem. Aqui o destaque vai para o uso do ChakraUI para estilização, MirageJS para implementar uma API no FrontEnd, Autenticação JTW e o uso do ReactQuery para a otimização de carregamento de dado na página. Aborda também conceitos do Yup (tratamento caixas de entrada), MirageJS (API), Context, Axios, além dos conceitos básicos de ReacjJS como State, Components, Props. Recursos do JS como: Map.
| Tela de Login |
|---|
 |
| Dashboard |
|---|
 |
| Usuários |
|---|
 |
| Criar Usuário |
|---|
 |
| Ferramenta React Query |
|---|
 |
TypeScript(TypeScript é uma linguagem de programação fortemente tipada que se baseia em JavaScript, oferecendo melhores ferramentas em qualquer escala.)Map(Método que executa uma iteração em uma array com retorno de outra array formatada, trabalhada de diversas formas.)Async/await(Método utilizado para transformar funções em assíncronas. Usado para chamadas de APIs.)
Styled System(ChakraUI possibilita a experiência própria de estilização, sendo repassado por Props.)
Estrutura(Estruturação de pastas e arquivos)Evitar conflito CSS(.modules)next/link(Aplicação de rotas)Componente(Uso de componentes)Estado(Uso de hooks para controle de estado e ciclo de vida da aplicação)Props(Recurso utilizado para passar atributos de um componente pai para outro componente filho)
chakra-ui(Biblioteca que fornece Estilo, Componentes, Hooks para a aplicação React que facilita a construção da IU)miragejs(Biblioteca de simulação de API que permite criar, testar e compartilhar um aplicativo JavaScript completo e funcional sem precisar depender de nenhum serviço de back-end.)react-query(Biblioteca utilizada para otimizar a busca, armazenamento em cache e atualização dos dados remotos)apexcharts(Biblioteca que oferece ferramentas para contrução de gráfico interativos e modernos)axios(Biblioteca utilizada para fazer chamadas HTTP Client. Chamadas em uma API ou a partir de um Back-end construído.)
- Clonar repositório:
git clone https://github.com/DIGOARTHUR/Dashgo.git
- Instalar dependências
yarn install
- Rodar aplicativo
yarn dev
- Acesse
http://localhost:3000/e navegue pelo site
5.1 Ver qual o repositorio atual
git remote -v
5.2 Mudar a URL do repositorio remoto
git remote set-url origin <LinkDoNovoRepositorio>
5.3 Verifique se a mudança foi realizada
git remote -v
Seguindo o curso IGNITE já em reta final, esse foi um dos projetos mais legais dentro trilha ReactJS. A @Rocketseat sempre trazendo novidades a cada aplicação, ferramentas que abrem fronteiras para aplicação e criatividade em projetos pessoais e profissionais.
Só tenho agradecer ♥