Frontend React - Receita e Despesas

Dashboard desenvolvido em ReactJs com TypeScript inteiramente componentizado com componentes puros.

Requisitos

Nodejs >= 10

Preview

Não há banco de dados. Os dados são carregados de 2 arquivos que contém arrays simulando os repositórios de dados.

Layout & Componentes Responsivos

Como Iniciar?

1. Faça o clone do repositório.

     git clone https://github.com/geraldobl58/admin-expense-and-income.git
   

2. Instalação das dependências

execute na pasta do projeto o seguinte comando:

```npm install ou yarn
```

após a instalação execute o seguinte comando.

```npm run start ou yarn start
```

1. Verificando no navegador

   O projeto vai executar no seguinte endereço: http://localhost:3000

Techs

• React
• React Router Dom
• Styled Components
• Typescript
• React Icons
• React Switch
• Recharts
• React Countup
• Uuidv4
• Html Semântico
• Deploy Netlify

Diretórios

Estrutura do projeto.

.
├── node_modules
├── src
├──────── assets
├──────── components
├──────── hooks
├──────── pages
├──────── repositories
├──────── routes
├──────── styles
├──────── utils
├── .gitignore
├── .prettierrc
├── .editorconfig
├── .eslint.js
├── package.json
└── README.md

1. /node_modules: Este diretório contém todos os módulos de código dos quais seu projeto depende (pacotes npm) são instalados automaticamente.

2. /src: Este diretório conterá todo o código relacionado ao que você verá no front-end do site (o que você vê no navegador), como o cabeçalho do site ou um modelo de página. src é uma convenção para "código fonte ".

3. .gitignore: Este arquivo informa ao git quais arquivos ele não deve rastrear / não manter um histórico de versão.

4. .prettierrc: Este é um arquivo de configuração para Prettier é uma ferramenta para ajudar a manter a formatação do código consistente e para manter um padrão. Prettier.

5. .eslint.js: ESLint é uma ferramenta de análise de código estática para identificar padrões problemáticos encontrados no código JavaScript. Eslint.

6. .editorconfig: O EditorConfig ajuda a manter estilos de codificação consistentes para vários desenvolvedores que trabalham no mesmo projeto em vários editores e IDEs. Editorconfig

7. package-lock.json Este é um arquivo gerado automaticamente com base nas versões exatas das dependências do npm que foram instaladas para o seu projeto. ** (Você não altera este arquivo diretamente)**

8. package.json: Um arquivo é executado para projetos Node.js, que inclui itens como metadados (nome, autor do projeto etc.). Este arquivo é como o npm sabe quais pacotes instalar para o seu projeto.

Link

Link de acesso: Aplicação em Produção

Licença

MIT