O resumo de materiais frescos do mundo do front-end da última semana n ° 320 (18-24 de junho 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 Divertido

---

Mídia

• Podcast "Web Standards", Edição nº 126: Como nos ouvir, API de animações da Web, fontes variáveis, Keyframes.app, ARIA: Oculto ou Nenhum, espaço reservado ruim, Reagir disponível e codificar para a imagem.
• Frontend Weekend Podcast # 58 - Marina Miranovich em Morando em Los Angeles e trabalhando no EPAM
• Devschacht Podcast: Night Front End # 38 - O Airbnb abandona o React Native
• CSSSR Podcast: News 512 - Edição 11 (18/06 - 24/06)
• TODO SEU HTML # 54: Voando no túnel
• SRI em Moscou 2018, 9 vídeos

Desenvolvimento Web

• O 2018 PWA (Progressive Web Apps) pode ser uma competição digna para aplicativos nativos?
• Estruturas desaparecendo
• Mozilla Introduz Dados de Mapa A-Terrain para Desenvolvimento Web
• BEM para iniciantes: por que você precisa do BEM
• Novos lançamentos: ESLint v5.0.0 , Electron 3.0.0-beta.1 , V8 release v6.8 , Node v10.5.0 (atual) ,
• Análise de problemas corrigidos nas estruturas mais populares no GitHub
• Jake Archibald: Detectei um erro no navegador

• Desempenho:
  • “Performance” - Ivan Karev, Andrey Morozov, Mikhail Mokrushin, Andrey Roenko e Tamerlan Lokyaev na SRI 2018
  • Otimização da velocidade do site com o Chrome DevTools
  • Melhoramos a percepção da velocidade de download devido à arte primitiva
  

• Ferramentas:
  • Conheça o Teleport: PWA️ hot reboot and debugging tool️
  • Como usar o código do Visual Studio
  • Introdução ao tronic - webpack com padrões razoáveis
  • O VS Code pode fazer isso ?! Uma seleção das melhores dicas para o Visual Studio Code que ninguém se importava em lhe contar.
  

• Acessibilidade:
  • Não use o atributo placeholder
  • stylelint-a11y - Plugin para stylelint com regras a11y
  • WCAG 2.1 - Gestos do índice de aprendizagem
  

• Animação:
  • Caligrafia Animada com SVG
  • Carregador SVG de gota animada
  • Aeroportos de Voronoi WebGL
  

CSS

• fontes variáveis
• Você não deve copiar o código @ font-face dos URLs do Google Fonts
• keyframes.app - uma maneira fácil de criar animações CSS
• Sobre as ferramentas que definem "CSS não utilizado"
• Centralização de CSS: nova maneira legal vs. velha maneira legal
• Grade de 8 pontos: tipografia da Web
• Usando fontes personalizadas com SVG na tag Img
• Pseudoelementos e transformações CSS: minhas ferramentas CSS favoritas
• Otimização de CSS: seletores de ID e outros mitos

Javascript

• Inovações de literais de objetos no JavaScript ES6
• Design assíncrono / aguardado do JavaScript: pontos fortes, armadilhas e padrões de uso
• Comandos para trabalhar com o console JavaScript em navegadores e aumentar a produtividade do programador
• Mecânica Quântica de Cálculos em JS
• Conhecimento do desenvolvimento através de testes em JavaScript
• Nova versão do .getInstance: Iteradores em JavaScript
• Usando módulos JavaScript na Web
• Um guia rápido e completo do TypeScript para TypeScript
• MobX 5: A saga continua ...
• Introdução ao modelo de elemento único
• Olha ma, sem mãos! JS Brain Operated - Charlie Gerard no JSConf EU 2018

• VueJS:
  • Vue.js - considerações e truques
  • Usando o vue-template-loader com Vue.js para compilar modelos HTML
  • Escrevendo componentes abstratos no Vue.js
  • De zero à implantação: desenvolvendo um sistema de documentação usando o Vue e o VuePress
  • vue-translator - suporte multilíngue em seus projetos vuejs
  • Criando um visualizador de RSS no Vue: Parte 1 , Parte 2
  • Vue.js: bom, nada
  • Galeria de estilos do Instagram no Vue.js e CSS Grid
  • As 21 principais bibliotecas da interface do usuário do Vue.js. para seus aplicativos
  

• Reagir:
  • Reaja ao Native no Airbnb . O AirBnb evita usar o React Native. Aprenda detalhes interessantes sobre o desenvolvimento nos últimos dois anos
  • Configuração do React Hot Loader em 10 minutos
  • Estrelas do Github! == uso: a reação ainda é mais comum que o Vue e o Angular
  

• Angular:
  • Visualização de dados com Angular e D3
  • Componentes angulares: dicas e truques
  • Como criar componentes dinâmicos no Angular 6
  

Divertido

• Mullenweg anunciou um roteiro para Gutenberg
• Aprendendo a programar usando tarefas com números
• Apple, Samsung e montadoras aprovaram a primeira versão da chave eletrônica padrão para carros
• Google, Lyft e Uber formam uma coalizão para aliviar o medo de robomobiles
• Sete jogos que ensinam programação
• O que é VR, AR e realidade mista - sites, aplicativos e artigos para ajudá-lo a descobrir
• O Instagram tem mais de 1 bilhão de usuários. Rede social lança novo serviço IGTV para até uma hora de vídeo vertical
• Como Musk, Bezos, Branson, Zuckerberg, Bryn, Gates e Thiel vêem o futuro
• “GitHub - uma plataforma para ótimas aplicações . ” De um projeto amador a um acordo com a Microsoft: a história de um serviço de desenvolvimento conjunto no valor de US $ 7,5 bilhões.
A.

Pedimos desculpas por quaisquer erros de digitação ou links quebrados / duplicados. Se você perceber um problema - escreva em um e-mail pessoal, tentamos corrigi-lo rapidamente.

Resumo da semana passada .
Material preparado por dersmoll e alekskorovin .