Skip to content

Emersonmrbr/basic-front-boilerplate.

Repository files navigation

Basic Front Boilerplate (BFB)

Boilerplate front-end para projetos de teste/estudos.


Pré-requisitos

  • Node.js
  • npm

Uso

O BFB usa Parcel, uma build tool rápida, eficiente e que não precisa de configuração (zero configuration).

Em função disso, oferece suporte a CSS e JavaScript modernos, Sass, e todas as outras modernidades/comonidades da ferramenta.

Comandos

Comando O que faz? Observação
npm install Instala pacotes necessários Execute isso primeiro!
npm start Inicia o desenvolvimento Acesse http://localhost:1234
npm run build Faz build do site Resultado na pasta dist

Considerações

Basicamente, depois da instalação inicial de pacotes, só é preciso executar npm start e começar a mexer no projeto como se não houvesse amanhã.

Parcel oferece hot reload: conforme alterações de código são feitas, ele faz rebuild automático dos arquivos alterados e atualiza o navegador.

O arquivo style/index.scss carrega todos os demais (partials), então, sempre que criar um novo arquivo na estrutura, lembre-se de importá-lo -- dentro dos conceitos da arquitetura ITCSS.

💡 Não sabe ITCSS?
Caso não saiba o que é ou como usar ITCSS, conheça nosso curso para aprender mais sobre como estruturar seu CSS de maneira profissional.
Para saber mais, cadastre seu e-mail na lista preferencial para ser avisado quando abriremos uma nova turma.

Tweaks

CSS Cascade Layers

Caso queira usar CSS Cascade Layers, o plugin PostCSS Cascade Layers já está disponível no BFB.

Para ativá-lo, adicione o seguinte código ao arquivo .postcssrc (dentro do nó plugins):

"@csstools/postcss-cascade-layers": true,

Solução de Problemas

Pacotes Node não estão sendo instalados

Caso aconteçam erros ao tentar instalar os pacotes Node, pode ser algo relacionado à compatibilidade.

Recomendamos o uso do nvm para controlar as versões do Node.

Então, você pode executar nvm use para ativar a mesma versão do Node usada para desenvolver o BFB.

Licença

Este projeto usa a licença WTFPL. Consulte o arquivo LICENSE.md para mais detalhes.

About

Template para criação de site

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages