
Bom dia amigos!
Eu realmente não gosto de fazer autopromoção, mas em uma situação onde uma equipe é formada por uma pessoa, goste ou não, você tem que desenvolver e promover o produto você mesmo.
Qualquer pessoa que esteja procurando por onde começar a desenvolver um aplicativo da web está bem ciente do Boilerplate HTML5 ( site oficial , repositório) De acordo com os desenvolvedores, é "o modelo de front-end mais popular da web". Você não pode discutir com o mais popular, mas você pode fazer isso com modernidade (atendendo às realidades modernas de desenvolvimento web). E isso não é surpreendente: o projeto foi criado há cerca de 6 anos. Muita coisa mudou nos últimos 6 anos. Ao mesmo tempo, pelo que eu posso dizer, nenhuma mudança fundamental foi feita no projeto (var é usado para declarar variáveis, há a possibilidade de adicionar plug-ins jQuery, etc.), exceto, talvez, site.webmanifest, que é inútil sem um service worker (e é melhor usar .json).
Proponho uma espécie de alternativa - um modelo HTML moderno para iniciantes ( site oficial , repositório ).
O projeto inclui o seguinte:
- index.html com todas as tags meta e link necessárias (general, microsoft, facebook, twitter, apple (ios), android, dados estruturados: schema.org e json-ld)
- exemplos de uso de tags HTML5 e propriedades CSS3
- exemplos de uso de módulos CSS e JavaScript
- trabalhador de serviço offline primeiro
- manifest.json completo
- servidor express.js com todos os cabeçalhos de segurança possíveis (útil ao implantar um aplicativo no heroku ou um serviço semelhante que suporte node.js)
- arquivo netlify.toml com cabeçalhos semelhantes e conexão preliminar dos recursos usados pela página (útil ao implantar um aplicativo para netlify)
- robots.txt simples
- sitemap.xml simples
- minimal browserconfig.xml
- max .gitignore
- página de erro 404 do criativo
- exemplo de construção de um projeto usando webpack
- como um experimento - um exemplo de projeto AMP (uma nova tecnologia do Google para sites que priorizam dispositivos móveis)
Index.html e server.js (netlify.toml) são, obviamente, o valor principal. Esses arquivos possuem links para a documentação oficial (fonte da verdade). O service worker e o manifesto tornam o aplicativo progressivo. Isso significa que o aplicativo pode ser instalado no telefone e no computador e se comporta como os nativos. Ao armazenar em cache os recursos usados pelo aplicativo, ele funciona offline (na ausência de uma conexão de rede).
Para melhorar a experiência de desenvolvimento, as seguintes ferramentas foram desenvolvidas adicionalmente:
Aqui estão os resultados do teste (o déficit se deve ao uso de recursos de terceiros, como google analytics e métricas Yandex):
Lighthouse

WebPageTest

SecurityHeaders

AMP

Preste atenção também em meu aplicativo principal, que desenvolvo da melhor maneira possível - muito JavaScript (talvez o nome não seja bastante bem-sucedido, mas reflete totalmente a essência do aplicativo). A propósito, o modelo especificado foi usado durante seu desenvolvimento.
Qualquer formulário de feedback, tanto aqui quanto no GitHub, seria bem-vindo.
Obrigado pela atenção e um bom começo de semana de trabalho.