The digest of fresh materials from the world of the frontend for the last week No. 225 (August 22 - 28, 2016)

We offer you a selection with links to useful resources and interesting materials from the frontend area.

Web development

CSS

Javascript

Browsers

News and entertaining

Web development

• Write less code, damn it
• Podcast Web Standards, Issue No. 30 : Junk, thoughts about React, SMIL can be, for now, hide in a new way, Narod.ru on Gitkhab, 10 KB website, Internet on vacation.
• Frontflip podcast, episode # 20: Elm and the poisonous platypus. Visiting Igor Kapkov
• Animation: looking for a common language . Translation of the article Communicating Animation
• Two new documents on b_-methodology are published: Quick Start , CSS on BEM
• How Front End Development Can Improve Artificial Intelligence
• Offline content with service workers (Offline content with service workers)
• Using WebP Images
• Markapp : a site with a list of HTML / JS libraries from LEA VEROU, whose goal is to collect and support plugins that do not require writing JS code
• Carbide is a new programming environment that does not require installation or configuration, and supports Javascript / ES2015, automatic import of modules from NPM and GitHub Saves and working directly with Github Gists
• Performance Means Progressive Improvement (Performance Means Progressive Enhancement)
• A few HTML tips
• Coder education takes a long time (It takes a village to raise a coder)
• Setting up progressive web applications with amp-install-serviceworker (Bootstrapping Progressive Web Apps with amp-install-serviceworker)
• Creating your first Atom plugin (Building your first Atom plugin)
• Visualization of GraphQL Concepts (GraphQL Concepts Visualized)
• Flash will die in December: long live HTML5 video player (Flash Is Dying In December: Long Live HTML5 Video Player)
• "SVG So Very Good" - Tyler Sticka talk with CascadiaFest 2016
• Inline SVG - how I stopped worrying and fell in love with gzip (Inline SVG - How I Learned to Stop Worrying and Love gzip)
• API:
  
  • How to use WebPageTest and its API (How To Use WebPageTest and its API)
  • Quick Tip: Working with the JavaScript Battery API (Quick Tip: Working with the JavaScript Battery API)
  • An Introduction to the Web Audio API
  • Creating a progressive web application using the Bluetooth Web API (Start Building with Bluetooth Web and Progressive Web Apps)
  • Local caching of the results of received AJAX requests: Fetch API wrapper (Cache Fetched AJAX Requests Locally: Wrapping the Fetch API)
  
  

CSS

• By seniority. When order in CSS is important
• Style Validator is a validator that defines “risky styles” that can break the layout after JavaScript or CSS Media Queries.
• Examples of using Fixed Backgrounds in CSS (Use Cases for Fixed Backgrounds in CSS)
• 3 hidden CSS tips (3 hidden CSS tips)
• 8 Clever Tricks with CSS Functions
• Improving Data Structure with Sass Maps (Building Better Data Structures With Sass Maps)
• CSS representation of the font-display property
• Improving CSS animations with curve movements (Upgrading CSS Animation With Motion Curves)
• How to choose the right CSS tools and frameworks (How to Choose the Right CSS Toolkits and Frameworks)
• Using CSS3 Counters for Figure Numbering and Tables (Using CSS3 Counters and Table Numbering)
• How to use the modular pattern in the SCSS / SASS style sheets (stylesheets)
• Pure CSS Flying Rocket Flying Rocket
• Introducing the new CSS Grid “fr” in a new video from Rachel Andrew (Intro to the CSS Grid fr unit)

Javascript

• Node.js and JavaScript instead of the old web
• Is Typescript worth the effort?
• JavaScript Performance, databases and searches for the "silver bullet": video TOP-5 reports of HolyJS 2016
• Poll: current state of javascript (the state of javascript)
• Quick Tip: Get URL Parameters with JavaScript (Quick Tip: Get URL Parameters with JavaScript)
• About hating NodeJS
• Composition is king
• JS Theory:
  
  • Why am I still using function in javascript?
  • Introduction to Currying JavaScript
  • About the JavaScript "this" keyword: usage details with explanations
  • ES6, var vs. let (ES6, var vs let)
  • What are the types needed for (Why You Need Types)
  • Is your javascript function really clean? (Is your JavaScript function actually pure?)
  
  
• Framework:
  
  • What's new in Marionette.js 3.0? ( Getting started with new version )
  • JavaScript Status : The Front-End Framework (The State Of JavaScript: Front-End Frameworks)
  • React FAQ
  • React Patterns
  • BookReactJS for Dummies: why and how to study React Redux correctly (ReactJS Convention BookReactJS For Dummies)
  • ReactJS Components: Learning the Basics (ReactJS Components: Learning the Basics)
  • Working with data in React: Properties and State (Working with Data in React: Properties & State)
  • React Game - Elephant Taco Hunt (React Game- Elephant Taco Hunt)
  • react-music - create beats with React (react-music - Make beats with React!)
  • react-static-plate - create static sites using React and CSS Modules hosted on Amazon S3, Github Pages, Surge, etc. (react-static-plate - build fast static sites with React & CSS Modules)
  • New Horizons with Horizon, RethinkDB and React (New horizons with Horizon, RethinkDB and React)
  • How to Learn Angular (How to Learn Angular)
  • Angular 1 using the Redux architecture (Angular 1 using redux architecture)
  • From ng-class to property binding (From ng-class to Property Binding)
  • 19 Tips to facilitate learning Angular 2 by Cody Lindley (19 Tips to Make Learning Angular 2 Easier)
  
  
• Lessons:
  
  • Web Audio Experiment: Detecting a Piano Note (A Web Audio experiment: detecting piano notes)
  • Creating a music complex on vanilla JavaScript (Create a Music Jam Station with Vanilla JavaScript)
  • Creating your own pipe filter in Angular 2 (Creating a custom filter pipe (pipe) in Angular 2)
  • Rotating elements towards the mouse or places of the mouse
  • Creating a smiley on CSS whose eyes follow the cursor (Make a CSS Smiley Face with Dynamic Googly Eyes)
  • Creating a drum kit with Ember.js (Build a drum machine # 1 - Playing Sounds - Ember.js)
  
  
• Plugins:
  
  • Grade.js - library for generating a two-color gradient from the primary colors of the selected image
  • baffle.js - small (~ 1.8kb) library for obfuscation and restoring text in DOM elements
  • slate - a framework for creating text-based web editors
  • pluggable.js - allows you to make JS-code pluggable while preserving the necessary objects and private data through closures
  • WebMonkeys - thousands of parallel tasks on the GPU using the simplest API
  • Push.js - JS notifications for browsers
  • Odoo - a spectacular odometer on SVG. The library uses a functional approach and ES7 Function Bind Syntax
  • in-view - a script that determines when the DOM element appears and disappears from the viewport
  
  

Browsers

• The researcher spoke about the vulnerability in Chrome and Firefox because of the Arabic domains and Emoji
• Google stops Chrome Apps on the desktop
• Firefox will support Webp image format
• Surfingkeys - enhanced browser features with javascript and keyboard (Chrome extension). (Surfingkeys - Expand your browser with javascript and keyboard.)

News and entertaining

• Mozilla launched a free site scanning service (Observatory by Mozilla)
• Micropub technology gets CR status at W3C (Micropub is now a W3C Candidate Recommendation!)
• Facebook has opened the code of the text classification library fastText , as well as practices on the recognition of objects in photos
• Google doesn’t follow links in SVG files
• Google will bring down sites with full-screen banners in mobile issue since 2017
• In Google search, it became possible to launch some games, listen to the sounds of animals and throw a coin to make difficult decisions.
• Opera has implemented a free VPN service for Android
• Pinterest buys Instapaper
• A list of 300 useful Slack communities for designers, developers and managers
• Layoffs of top managers and growing capitalization: a year after Google’s reorganization into Alphabet
• List of Russian-language podcasts on the topic of information technology.
• Review of Windows 10 Anniversary Update: we disaccustom "the ten" to watch and spy again
• The Linux kernel is 25 years old.
• The Internet is 25 years old! World Wide Web Test
• Two roads in the global hi-tech world
• How to teach children mathematics so that they do not hate it
• Industries from the past
• Apple is no longer a cake, or Why I turn to google products
• Interactive web map of Olympic Rio
• GIF is dead. Long live the gif! (The GIF Is Dead. Long Live the GIF.)
• The Internet of Poorly Working Things (The Internet of Poorly Working Things)

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 from last week
»Material prepared by dersmoll and alekskorovin