Frontend Weekly Digest #77 (1–7 October 2018)

Web-development

• Node.js Foundation and JS Foundation Announce Intent to Create Joint Organization to Support the Broad Node.js and JavaScript Communities

• Tools:
  • Simulate Mobile Devices with Device Mode in Chrome DevTools
  • project-explorer: a CLI tool to create an annotated tree visualization of any project
  • What’s new in Microsoft Edge in the Windows 10 October 2018 Update
  • Chrome 70 — What’s New in DevTools, including monitoring JavaScript expressions in real time with Live Expressions, enabling network throttling from the Command Menu, and more
• Accessibility:
  • Terms & Conditions & Accessibility
  • How we made the Basecamp 3 Jump Menu accessible
  • Writing good text alternatives
• Animations:
  • Multibox Menu — A simple grid-powered multibox menu where the boxes get shown with a reveal animation coming from different directions.
  • Moving Backgrounds With Mouse Position

CSS

• CSS Debugging and Optimization: Browser-based Developer Tools, Code-quality Tools, Minification with CSSO
• Use Cases For Flexbox
• Creating Flexible Layouts with Flexbox
• Sass Selectors: To Nest Or Not To Nest?
• Scribble-Font — Scribble Font for Prototyping & Wireframing
• Styling Broken Images
• How I organize CSS in large projects using UFOCSS — Part 2

JavaScript

• JavaScript Functional Programming Explained: Fusion & Transduction
• How to stop using console.log() and start using your browser’s debugger
• Why every beginner front-end developer should know publish-subscribe pattern? AKA: How to understand asynchronous JS code in a less painful way.
• JavaScript Functions, a Pocket Reference
• JavaScript Prototypes, a Pocket Reference
• A comparison of Server Side Rendering in React and Angular applications
• A practical ES6 guide on how to perform HTTP requests using the Fetch API
• JavaScript Arrow Functions: How, Why, When (and WHEN NOT) to Use Them

• VueJS:
  • Why I chose Vue.js over React
  • The joy of building Vue apps in Typescript — Part 1: Vue Class Components
  • Building a Google search clone SPA with Vue and Flask
  • Unit Test Your First Vue.js Component
  • Deep Dive Into The New Vue Devtools v5.0
  • Free Vue.js bootstrap admin templates — 2018

• React:
  • Getting Started: React and GSAP Animations
  • React Podcast 23: Ditch Authority with Sunil Pai
  • React/JSX as a server-side templating language
  • Death by a thousand cuts — a checklist for eliminating common React performance issues
  • 9 React Styled-Components UI Libraries for 2018
  • How to Create a PWA Game using Preact in 5 steps (Tutorial)
  • Components testing in React: what and how to test with Jest and Enzyme.
  • These React Fundamentals You Skip may be Killing You
  • The Deep Dive — Migration From Angular to React
  • Long-term React & Redux SPA — Lessons learned

• Angular:
  • Best practices for a clean and performant Angular application
  • How to use animation with Angular 6
  • How To Build A News Application With Angular 6 And Material Design
  • Simplified Angular unit testing
  • Exploring Drag and Drop with the new Angular Material CDK
  • What to consider when upgrading from AngularJS to Angular 2.0+
• Libs & Plugins:
  • lvovich — JS library to inflect people names, cities names in Russian
  • Cogear.JS — modern static websites generator
  • imgToAscii — A JavaScript implementation of an image to Ascii code
  • ferret — a web scraping system aiming to simplify data extraction from the web for such things like UI testing, machine learning, and analytics