Digest of fresh materials from the frontend world for the last week №443 (23 - 29 November 2020)

We bring to your attention a selection with links to new materials from the frontend area and around it.

Media     |    Web Development     |    CSS     |    JavaScript

Media

• "News 512" from CSSSR: Browser from the inside, git at a glance, bfcache, Electron 11, skepticism and Web Vitals, TIOBE in November

• Podcast "Web Standards" # 258. Bocoup and appearance, CSS nesting, table adaptation, browser device, fit everything in JS

• CSSSR News 512: Chrome 87, Firefox 83, TypeScript 4.1, aria-label, HTML forms, CSS gradients, CSSBattle 2020

• JavaScript fwdays'20 Autumn online

• The Overflow Podcast 289: React, jQuery, Vue: what's your favorite flavor of vanilla JS?

• ShopTalk # 440: Serverless, Local Database, Edge Functions, and Using WordPress Serverless

• Syntax.fm podcast: Potluck - Frameworks vs Libraries × Debugging × CSS Modules vs Styled Components × Resumes × Stress Management × More

Web development

• Why it's good for users that HTML, CSS and JS are different languages

• Think like a front-end developer

• Explore the capabilities of Details and Summary elements

• A modern HTML starter template

• A deep dive into the Page Lifecycle API

• An introduction to GraphQL for developers

• Back to The Basics: Create Clickable Cards in HTML, CSS and JavaScript

• 
  
  • 5 accessibility Chrome DevTools
  
  • NPM 7: ,
  
  • Dev Fonts —
  
  

• 
  
  • Brotli
  
  • Core Vitals
  
  • Layout Shift netlify.com
  
  • , FOUT Lighthouse
  
  • , AVIF
  
  • Lighthouse 96.
  
  

• 
  
  • «Inspirational Websites Roundup #20»
  
  • -
  
  • - Rogier de Boevé’s
  
  • , : ,
  
  • GSAP
  
  

CSS

• Details on using the minmax () CSS function in Grid layouts

• State machine built with HTML checkboxes and CSS

• Chrome DevTools: refactoring and enhancing stylesheets with the CSS Overview Panel

• 5 CSS pseudo-elements you don't even know exist suspected (according to the author)

• Center navigation with fit-content

• CSS framework guidelines

• Quick CSS tip: how to easily show the source code

• Create a CSS button with a shine effect and smooth color changes over time

JavaScript

• ECMAScript 4: The Version That Wasn't

• A Detailed Look at Well-known Symbols

• Marko.js - Frontend from ebay.com

• JavaScript Decorators from Scratch

• Server Side Rendering in JavaScript: A Modern Approach

• JavaScript DOM Selectors - Learn How To Get DOM access [Infographic]

• Use console.log () like a pro

• React
  
  • React i18next
  
  • React
  
  • Boop! —
  
  • React workflow JavaScript
  
  • UI c SVG
  
  • React Redux: React Redux
  
  • PageSpeed ​​Insights React
  
  • React
  
  

• Vue
  
  • Vue.js
  
  • Vue (x) + Firebase
  
  • Vue Vue Testing Library
  
  

• Angular
  
  • , , Action Streams Angular
  
  • Angular
  
  • Angular
  
  

• Ember
  
  • Glimmer Snowpack
  
  • Component Primitives Deep Dive
  
  

• Libs & Plugins
  
  • ODIFF - The world's fastest pixel difference tool.
  
  • I'm Ready - js library to check if images or videos are loaded
  
  • Suri - your own link shortener that can be easily deployed as a static site.
  
  

Digest for the last week .

Material prepared dersmoll and alekskorovin .