The digest of fresh materials from the world of the frontend for the last week №264 (May 22 - 28, 2017)

We offer you a selection with links to new materials from the front-end area and around it.

Web development

CSS

Javascript

Entertaining

Web development

• Podcast Web Standards, Issue # 70 : Firefox Marketing, npm 5 is catching up, accessibility, why shorts and shows, CSS-in-JS, Webpack and SPA, grids, for beginners.
• Podcast Frontend Weekend FW # 4 - How to become a star frontend'a year
• Podcast devschacht, Issue number 3
• Five Minute React # 18 podcast - pnpm
• Why do you need BEM? - HTML Shorts
• Export graphics for the web, Vitaliy Zyuzin - HTML Academy
• Front-end on feng shui. Part 3
• What is the future of front end development?
• How long should the site last?
• Are we making the web too complicated?
• REST 2.0 is already here and its name is GraphQL
• Performance:
  
  • Performance Analysis Reference for Chrome DevTools
  • Beyond the bubble: performance in the real world
  • Frontend Optimization Handbook - A free PDF book about tools and front-end optimization, by O'Reilly
  • Gtmetrix Blog Optimization Guide
  • asm-dom - minimal WebAssembly virtual DOM focused on performance
  
  
• Instruments:
  
  • Introduction to Webpack Philosophy
  • Npm v5.0.0 release released: faster, with offline mode, - save by default and lockfile
  • Webpack Learning Stages, Part 2 - The Config
  • What's new in DevTools (Chrome 60) : detailed audit panel, tagging for third-party resources, many improvements in the console
  • HTML Tools
  
  
• PWA:
  
  • Site Acceleration: How Progressive Web AMP Works
  • Explore progressive web applications in the real world
  • The right way to create PWA
  • Creating PWA in the context of JavaScript frameworks
  • Implementing Hacker News as Progressive Web Apps
  • Shape Detection API: defining barcodes, faces, and text in images
  
  
• Availability:
  
  • Details on ARIA. The cause and solution of all our accessibility problems
  • Why are headings and landmarks so important? - the latest issue of A11ycasts # 18
  • EdgeHTML 15 Accessibility Improvements
  
  
• SVG:
  
  • What is the basis of SVG
  • Advanced work with SVG icons using SnapAnimationStates, a plug-in to snap.svg
  • How to create interactive maps on SVG with react, topojson and d3-geo
  
  
• Spectacular web:
  
  • Interactive mouse focus effect
  • Beautifully animated dots using WebGL and regl
  • Morphing background shapes by scrolling
  • Gif masking in svg
  • Running neon text on "pure CSS"
  
  

CSS

• Video from moscowcss_3
• SOLID Principles Solutions in CSS: Part 1 , Part 2 , Part 3
• Unified Styling Language
• 11 things that you learned by reading the flexbox specification
• How to study the Flexbox in 10 minutes
• Good time to understand CSS layout , tells us Rachel Andrew
• CSS Architecture and Best Practices , Foundation Foundation Lesson Series by ZURB
• Custom themes with Angular Material

Javascripts

• Incredible javascript - tricks, misunderstandings and unusual features
• Javascript style elements
• The path to transducers in pure javascript
• Life and amazing adventures in exotic JavaScript environments
• Five Minute React # 19 Podcast - React Europe and Holy JS
• f (tuesday): introduction . A series of articles on functional programming in JavaScript
• Lazy parsing javascript in v8 . Translation of the article by Matt Zeunert: Lazy JavaScript Parsing in V8.
• Videos from MinskJS Meetup # 2
• Top 7 JavaScript Framework
• High order functions in Lodash
• JavaScript module status
• Javascript and extension operator
• What is Event Bubbling in JavaScript? Explanation of Event Propagation
• Introduction to Data Management and Visualization in JavaScript
• Managing Asynchronous Dependencies with JavaScript
• chromatism - a simple set of tools for working with colors
• Instruments:
  
  • A brief and incomplete history of JavaScript junklers.
  • JavaScript unit testing frameworks: comparing Jasmine, Mocha, AVA, Tape and Jest
  • iD3 - IDE for D3.js
  
  
• React:
  
  • How to achieve the reuse of React components (Translation)
  • Announcement styled-components v2
  • How to structure your project on React
  • Creating a React VR application
  • React Forms: Using Refs
  • react-live - sandbox for live editing of React components
  • editor - customizable WYSIWYG on steroids (React and Redux)
  
  
• Angular:
  
  • Forms and custom input fields in Angular 2+
  • Creating Semantic Components in Angular and React
  • Converting Angular Controllers to ES6 Classes
  
  
• Vue:
  
  • State management in Vue: starting to get acquainted with Vuex
  • Switch from React to Vue.js
  • How to migrate from AngularJS to Vue
  
  

Entertaining

• The article to which you can refer: what is a blockchain
• Stack Overflow brought more than a million users out of Vim
• Results WannaCry: a selection of basic materials on the "Habrahabr" and not only
• IT books rating 2017
• Microsoft translates Windows development to Git
• Google will automatically convert display ads to AMP
• Facebook has created a solution for integrating Instant Articles, AMP and Apple News
• Neural network has written a cookbook
• Schiaparelli was killed by trigonometry
• The 4 most important ranking factors of Google in 2017
• Slaves of the XXI century . World economy: should cyborg pay a salary?
• How is the internship at Microsoft - student story
• MP3 is dead? Long live the MP3!
• Chrome won
• Satan explains HTML with DEATH METAL

We apologize for any typos or broken / duplicate links. If you notice a problem - please write in a personal, we are trying to fix them quickly.

← Digest last week
Material prepared by dersmoll and alekskorovin