Basic Front Boilerplate (BFB)

Conheça o Basic Front Boilerplate, ou BFB, e saiba como ele vai ajudar a todos nós a aprendermos mais desenvolvimento web.

Ir para o artigo

No canal de YouTube do dpw, neste ano de 2020 queremos voltar às raízes, colocando mais tutoriais de codificação e dicas de código e indicações em geral — mesmo correndo o risco de sentir um pouco de vergonha alheia, você pode consultar os vídeos antigos do canal para ver do que estamos falando.

Pensando a este respeito, principalmente em como temos percebido que muitas pessoas gostam de ter acesso a códigos de exemplos (por mais simples que sejam), começamos a pensar em uma maneira de tornar essa disponibilização de códigos simples e eficiente.

Foi então que nasceu o Basic Front Boilerplate, ou, como será mais conhecido, BFB.

O que é o BFB?

Existem muitas maneiras de se preparar um repo reutilizável hoje em dia. Inclusive, algumas soluções populares com arquivos de configuração que demandam dezenas de linhas para projetos singelos…

Mas, a fim de disponibilizar os códigos de nossos tutoriais de maneira bem simples, criamos um repo no GitHub que servirá de template para nossos tutoriais de código webdev. Este é o BFB.

Trata-se de uma estrutura modesta, rodando com um bundler bem levinho, que garantirá que todos possamos nos valer de características de webdev moderno e uma arquitetura mais profissional.

Ser pequeno não significa ser desleixado ou mal feito, certo?

Características do BFB

Dentre as diversas possibilidades para montar um repo para este fim, escolhemos o Parcel, que é um bundler muuuito rápido, que demanda zero configuração para rodar. Isso mesmo: zero configuração!

O danadinho é esperto e (até certo ponto) robusto, conseguindo lidar com diversos tipos de demandas de desenvolvimento web moderno — incluindo automatic transforms, code splitting e HMR.

Apesar de o BFB ser focado mais em HTML e CSS, não seria possível deixar de lado o queridinho da rapeize, o JavaScript. Então, também contamos com todas as características de JS moderno que o Parcel oferece.

Neste caso, temos como características principais do BFB:

  • Funciona à base de Parcel
  • JavaScript moderno (ES6 de braçada)
  • Arquitetura profissa (nóis que fez)
  • Ideal para tutoriais e projetos rápidos (sim, já o testamos em campo)

Na arquitetura, organizamos com uma versão modificada de SMACSS, usando convenções de código como BEM e Namespaces CSS, com um mínimo de padronização de códigos usando EditorConfig.

Isto é, é uma arquitetura moderna, que usa convenções internacionais que temos abordado e ensinado já há algum tempo.

BFB lvl up!

Como uma ferramenta open source de qualidade, a ideia é manter o Basic Front Boilerplate sempre atualizado e consonante às melhores práticas e tecnologias.

Assista ao vídeo mostrando a primeira atualização que o BFB recebeu:

A gente se vê pela Web em 2020!

Apesar de ainda estarmos nos organizando e não termos uma agenda já definida de tutoriais, não tenha dúvidas sobre nossas intenções de, mais uma vez, oferecer material de webdev de qualidade e aumentar ainda mais nossa participação na comunidade.

Inclusive, se você tiver ideias e/ou preferências de tutoriais e conteúdos a serem abordados, suas sugestões serão muito bem vindas. Por favor, comente abaixo.

Aconselhamos que se inscreva no canal YouTube do dpw para não perder as novidades e a gente se vê pela Web em 2020!