Nave Boilerplate

Boilerplate baseado no Create next app.

Code Standard

Além de todos os pontos citadas no nave guide, como padrão de imports e boas práticas de javascript, existem algumas boas práticas que devem ser usadas, principalmente na criação de componentes e páginas.

  1. Evite usar styleds desnecessários. Temos componentes de Row, Column e Text para evitar o uso desnecessários de styleds nas páginas. Além disso, estes componentes possuem o styled-system, que permite passar margins, paddings e afins por props;
  2. Ao criar um novo componente, sempre cogite a utilização do styled-system;
  3. Sempre adicione as prop-types nos componentes. Além de ajudar outras pessoas que forem usar este componente, serve também como documentação;
  4. NUNCA repita o mesmo código duas vezes. Não copie e cole. Crie helpers e components. Reutilize código;
  5. Se precisar criar um componente com várias variações, dê uma olha no componente de Text e utilize a propriedade variant do styled-system;
  6. Siga o padrão de pastas e padrão de código. Participe da construção do boilerplate, dê feedbacks e contribua com melhorias.

Estrutura de Pastas

├── /public
├── /pages
├── /src
|   ├── /components
|   |    ├── /<component_name_folder>
|   |    |    ├── <component_name_file>.js
|   |    |    ├── index.js
|   ├── /helpers
|   |    ├── <helper_file>.js
|   |    ├── index.js
|   ├── /hooks
|   |    ├── <helper_file>.js
|   |    ├── index.js
|   ├── /providers
|   ├── /services
|   ├── /routes
|   |    ├── /<route_name_folder>
|   |    |    ├── <route_name_file>.js
|   |    |    ├── index.js
|   ├── /theme
|   ├── /context (optional)
|   ├── /redux (optional)

Start

Clonar esse repositório e executar o comando yarn para instalar as dependências.

Rodar projeto

yarn start

Commit

yarn commit

Sentry

O Sentry somente estará ativo se NEXT_PUBLIC_NODE_ENV=production.

Para configurar o Sentry corretamente, siga as instruções abaixo:

  1. Crie um projeto no Sentry e coloque o dns que ele disponibiliza na env SENTRY_URL;
  2. No arquivo helpers/bootstrap, adicionar as informações de usuário que você julgar importante.