Frontend Weekly Digest #161 (1 –7 June 2020)

Web-development

• HTML5 Boilerplate 8.0.0 Released
• W3C website redesign: Choosing a front end framework
• Setting up efficient workflows with ESLint, Prettier and TypeScript
• PayPal Engineering: Sharing UI components at an enterprise level
• Accessibility or Morals?

• Tools
  • How I Used Brotli to Get Even Smaller CSS and JavaScript Files at CDN Scale
  • Mobile Page Speed Testing
  • Improve site performance by inlining your CSS
• Performance
  • UI Interactions & Animations Roundup #7
  • Kinetic Typography with Three.js
  • ScrollTrigger — Scroll-driven animations re-invented

CSS

• CSS Grid: Newspaper Layout
• Global and Component Style Settings with CSS Variables
• A First Look at `aspect-ratio`
• The 🍔 menu. A step by step guide to creating a Hamburger Menu in SVG & CSS
• How to Create Dynamic Backgrounds With the CSS Paint API
• Hybrid positioning with CSS variables and max()
• Colors in CSS
• Sass Color Functions in CSS
• A New Way to Delay Keyframes Animations
• Rotated Table Column Headers… Now With Fewer Magic Numbers!

JavaScript

• Track Your Smartphone in 2D With JavaScript
• JS Community reacts to George Floyd’s Death
• You don’t know JavaScript until you can beat this game
• Exploring the state of reactivity patterns in 2020
• Static analysis in JavaScript: 11 tools to help you catch errors before users do

• Theory
  • JavaScript Antipatterns — Prototypes, Switch, and More
  • Top 19 frequently asked TypeScript interview questions
  • Stranger Things, JavaScript Edition
• React
  • useSWR — My New Favorite React Library
  • Consuming REST APIs In React With Fetch And Axios
  • How to Make your React App a Progressive Web App (PWA)
  • How to Build a Markdown Previewer with React.js
  • One Cool Trick to Simplify Reducer Functions
• Vue
  • Vue Best Practices — Most Important Changes
  • Clean, Scalable Forms with Vue Composition API
  • Quick & Easy Vue.js Search Facility
  • Learn Vuex in 5 minutes.
  • “Views on Vue” Podcast №108: Inside Vue 3 with Gregg Pollack
• Angular
  • How to Use JSON-LD for Advanced SEO in Angular
  • Custom Decorators in Angular
  • In defense of the Angular framework
  • A Deep Dive into @Injectable and providedIn in Ivy
  • Testing routed Angular components with the RouterTestingModule
• Ember
  • The Ember Times — Issue №151
• Svelte
  • Svelte bind directive explained in-depth
  • Zero to Streaming Application — Frontend
  • How to add customizable SVG Icons in Svelte JS app
• Libs & Plugins
  • consoleimg — Display images in your developer console!
  • Grid.js — Advanced Table Plugin

Browsers

• New in Firefox 77: DevTool improvements and web platform updates
• Firefox 77 for developers
• Microsoft’s new Edge browser now rolling out via Windows Update