O resumo de materiais frescos do mundo do front-end da última semana n ° 322 (2 a 8 de julho de 2018)

Trazemos à sua atenção uma seleção com links para novos materiais da área de front-end e em torno dela.

Mídia | Desenvolvimento Web | CSS Javascript Navegadores Divertido

---

Mídia

• Podcast "Web Standards", Edição nº 128: React é apenas JS, aninhado em CSS, sistema de indentação, captcha inacessível, esqueça as grades no IE, designer de layout e visivig.
• Podcast do fim de semana do front-end # 60 - Dmitry Rozhkov sobre a criação do Senior Software Vlogger, passando o inverno na Tailândia e morando em Hamburgo
• Devschacht Podcast: Night Front End # 40 - GPC, Depressão, WSD e Patreon
• Frontend Youth (18+) podcast # 55 Quer ser um desenvolvedor legal do React - ouça aqui!
• CSSSR Podcast: News 512 - Edição 13 (07/02 - 08/07)

Desenvolvimento Web

• Cache da Web como exemplo de compra de leite em uma loja
• Site para celular ou layout adaptável: melhor do ponto de vista do SEO
• Como e por que testar o layout
• Publii - um novo CMS estático com GUI para criar sites seguros, rápidos e com estilo
• A Internet é complexa (mas não precisa ser assim) . Guia Completo de Desenvolvimento Web

• Desempenho:
  • Google: o Speed ​​Update do mecanismo de pesquisa será lançado em julho de 2018 , o Google Speed ​​Update levará em conta até pequenas melhorias na velocidade de download
  • Auditoria de desempenho: imersão profunda nas ferramentas de desenvolvedor do Firefox
  • Melhorando o desempenho: redimensione imagens sob demanda
  • Otimização da velocidade do site com o Chrome DevTools . Blog atualizado para desenvolvedores do Google
  • Componentes dependentes de conexão . Use a API de informações de rede para se adaptar a diferentes velocidades: img para 2G / 3G, vídeo para 4G
  • Reduzindo o carregamento útil de JavaScript com o Tree Shaking
  

• Acessibilidade:
  • stylelint-a11y - plugin para stylelint com regras a11y
  • Carrossel acessível usando ARIA
  • Poder e perigo WAI-ARIA: mais sobre reconhecimento de voz
  

• Web espetacular:
  • WorldCup generativo . Experimente a API de estatísticas do campeonato mundial para gerar modelos abstratos para cada jogo
  • Apresentando o GaspTools de Ueno : uma ferramenta simples de animação
  • div que parece diferente em todos os navegadores
  • Mouse fantasma após o cursor
  
  

CSS

• O GitHub está se transformando ... O GitHub está se transformando ... no elegante Windows 95
• Trabalho eficaz sobre padrões - parte 1: ambiente operacional , parte 2: o caminho difícil de comprometer
• Guia para a integração e estilização de sistemas de ícones - sprites SVG, caracteres SVG e fontes de ícones
• Truques CSS para revolucionar seus layouts
• Colocando texto em um contêiner
• Clearfix: uma lição na evolução do desenvolvimento web
• Como o CSS funciona: criando camadas com z-index

• Grade CSS:
  • Grade CSS Nível 2: e Subgrid Came
  • Grade CSS no IE: descobrindo equívocos básicos sobre a grade do IE
  • Grade CSS no IE: Grade CSS e o novo autoprefixer
  • Grade CSS no IE: emulando grade de posicionamento automático com intervalos
  

Javascript

• Noções básicas de JavaScript para iniciantes
• Desenvolvendo sua própria estrutura e crescimento profissional de um programador de JS
• Quando (e por que) você deve usar as funções de seta ES6
• 15 métodos de elementos HTML dos quais você talvez nunca tenha ouvido falar
• Por que GraphQL: vantagens, desvantagens e alternativas
• Variáveis ​​JavaScript var, let e const explicadas na história

• Reagir:
  • 16 Reagir ferramentas para desenvolvedores de interface
  • Os erros mais comuns em seu código React que você (possivelmente) comete
  • Tutorial de reação simples (pelo menos 99% ES2015).
  • Reagir é apenas JavaScript
  • O básico de reagir sem o NPM. Sem webpack. Sem Redux. Aprenda o básico do React criando um fractal animado diretamente na caixa de areia do navegador.
  • 5 práticas populares que você pode parar de usar no React
  • O que é Redux: Guia do Designer
  • react-scrollbar-custom - o melhor componente do React para criar barras de rolagem personalizadas
  

• VueJS:
  • canal de idioma russo de. comunidade vuetify.js na discórdia
  • Vue Test Utils e Jest: como escrever testes de unidade simples para o frontend
  • Como usar o roteamento no Vue.js para melhorar a experiência do usuário
  • Criando um aplicativo móvel usando Capacitor e Vue.js
  • Manual do Vue: Uma introdução detalhada ao Vue.js
  • Autenticação Vue e manipulação de rotas com o roteador Vue
  • Melhores modelos de administrador para Vue.js em 2018
  

• Angular:
  • Roteiro do desenvolvedor angular . Um projeto cujo objetivo é coletar os conceitos mais básicos / importantes que qualquer pessoa que queira aprender a se tornar um desenvolvedor Angular deve aprender
  • Componentes da Web em Angular e AngularJS
  • Soluções de componentes dinâmicos em angular
  

• Libs e plugins:
  • shepherd - uma biblioteca para criar um assistente visual nos elementos do site
  • Rete.js - framework de programação visual JavaScript
  • itty.bitty - uma ferramenta para criar links que contêm pequenos sites
  

Navegadores

• Capturas de tela: menu principal do Microsoft Edge atualizado
• Google e Mozilla removeram o complemento do navegador do Stylish, que espionava os usuários, dos diretórios
• Comparação de desempenho de várias implementações do WebAssembly
• Como usar o Microsoft Edge para ler livros eletrônicos
• Spectre conseguiu desviar a proteção do navegador contra vulnerabilidades

Divertido

• Blockchain é um chavão ou algo sério?
• Por que muitos querem se tornar um gerente e isso nem sempre é uma boa ideia
• No complemento do navegador Stylish, um código foi revelado para o envio de um histórico de visitas
• O renascimento da virtualidade e realidade aumentada
• Classificação da linguagem de programação TIOBE em julho: o TypeScript continua a crescer em popularidade
• Introdução visual ao aprendizado de máquina

PS: na próxima semana não haverá resumo, férias e tudo isso.

← Resumo da semana passada
Material preparado por dersmoll e alekskorovin