Frontend Weekly Digest #21

Web-Development:
• The End of Front-End Development
• Website Security Check: How to Secure Your Website
• Single Page Applications (SPA) Vs. Multi-Page Applications (MPA)

CSS:
• You Really Know the Position: sticky?
• Replicating the Medium Website Using CSS Molecules
• When is :focus-visible visible?
• 7 Amazing Things Pure CSS Can Do for You

JavaScript:
• Speeding up the JavaScript ecosystem — npm scripts
• How to Share JavaScript Code

React:
• New React docs pretend SPAs don’t exist anymore
• How to start a React Project in 2023
• React 18 Component Optimization: Make Your Application Faster and Smoother

Vue:
• How to automatically import and register Vue components
• Build complex SPAs quickly with vue-element-admin
• Vue 3: watchEffect is Impressive, but watch is still the Best Choice

Angular:
• Angular 15 — What’s New and Why to Upgrade
• Angular Testing Tips: Ng-Mocks
• Angular 15 introduces functional HTTP interceptors

Svelte:
• Rich Harris Talks SvelteKit and What’s Next for Svelte
• Top Visual Studio Code extensions for Svelte developers

Frontend Weekly Digest #22

Web-Development:
• Push notifications are now supported cross-browser
• Jumping HTML tags. Another reason to validate your markup
• Fighting inter-component HTML bloat

CSS:
• Sass and Native Nesting
• Hiding empty elements with CSS :empty and :has()
• How to use Google Fonts and font-display
• Preventing too-short final lines of text blocks
• Checkered background using two lines of code in CSS
• CSS Masking
• Improving CSS Shapes with Trigonometric Functions
• Position your element with CSS inset logical property

JavaScript:
• Mastering the JavaScript switch Statement
• JavaScript import maps are now supported cross-browser
• As a Front-End Engineer: The Magic Behind “Event Emitter” in JavaScript That You Should Know About

React:
• The End of an Era: React Team Says Goodbye to Create React App
• How to Measure and Improve the Performance of a React App
• Micro Frontends in React: A Practical Guide
• Stop Using useMemo Now!
• Building a Custom Fetch Hook in React
• 🔥 Best Practices of Render Props Pattern: Improve React Performance and More PART 1️⃣

Vue:
• Vue.js Tutorial: Getting Started & 10 Best Practices
• How to add dynamic styling and class names in Vue.js
• How to build a real-time Vue app with WebSockets

Angular:
• Angular Signals — Taking Reactivity to New Heights 🚀
• How I Failed an Angular Developer Interview by Failing to Answer this Simple Question
• Angular Signals in a Nutshell
• Angular v16 signals, everything old is new again

Frontend Weekly Digest #23

Web-Development:
• Improper HTML: Bad Examples Makes For Bad Developers
• My Boss: Front-end Development Will be Replaced 100% by AI

CSS:
• A CSS selector to highlight clickable elements
• Using color-mix() to create opacity variants
• Running CSS animations only if both the device and the user allow it
• Can you create beautiful stroked text in CSS?

JavaScript:
• What’s the best way to do animations with JavaScript?
• Vue and Ember: How They Compare, and Which to Use

React:
• Best Practices of React HOCs: The Untold Benefits You Know Nothing About
• Best Practices of React Route Resolver: Stop Waiting for Component to Fetch Data
• React forwardRef(): How to Pass Refs to Child Components
• Refs in React: from access to DOM to imperative API

Vue:
• Build a Reusable Carousel with Vue and Splide.js
• Understanding slots in Vue.js: Types, benefits, use cases
• Promise handling for complex modals in Vue 3

Angular:
• Angular: The Framework of Past, Present, and Future
• Common Angular Interview Questions And Answers
• Part Of Why I Think Angular Is Junk

Frontend Weekly Digest #24

Web-Development:
• Using the Cookie Store API
• Diagonal Layouts in 2023
• Implementing Micro-frontends for Large Applications

CSS:
• Pure CSS Lightbox using :target and :has
• Understanding CSS preload and other resource hints
• Use CSS Color Like a Pro: RGB, HSL, HWB, LAB, LCH Explained
• Effects you can build with CSS without JavaScript

JavaScript:
• Forever Functional: Decorators — new style higher order functions
• 4 Ways to Create an Enum in JavaScript
• JavaScript Optimization Techniques for Faster Website Load Times: An In-Depth Guide

React:
• Mastering React: Techniques to Take Your UI to the Next Level
• As a Front-End Engineer, 4 React Traps You Should Know About
• The Pitfalls of Using or Components in React

Angular:
• Unit Testing in Angular 15 Without TestBed
• Angular 16 is huge
• Rendering images the Angular way

Frontend Weekly Digest #25

Web-Development:
• Exploring The Potential Of Web Workers For Multithreading On The Web
• Accessible HTML Video “Facades”
• UI Interactions & Animations Roundup #31

CSS:
• Sniper-CSS, avoid unused styles.
• syntax.fm: Can Vanilla CSS Replace Sass Yet?
• Circular Text with CSS?
• CSS Custom Properties Beyond the :root
• Creating Accordions with just HTML and CSS
• How to write type-safe CSS Modules
• Creating responsive mobile layouts with Pure.css
• Engage Your Users: How to Create an Eye-catching Scroll Page Progress Bar with CSS
• Understanding CSS Min(), Max(), and Clamp() Functions

JavaScript:
• Deep Copying Objects with the StructuredClone API
• Best Practices for Async Programming in JavaScript
• How Has JavaScript Changed in the Last Few Years?
• 6 Secrets about “null” and “undefined” that You Should Know
• What’s new in ECMAScript 2023
• kv.js — Advanced in-memory caching module for JavaScript.

React:
• How to Write Comments in React: The Good, the Bad and the Ugly
• Signals: Fine-grained Reactivity for JavaScript Frameworks
• Step by step: Toggling Elements using React Hooks
• Mastering ReactJS optimization
• Build customized data tables with PrimeReact

Vue:
• How to Use Attribute Inheritance in Vue 3
• Micro-Frontend Migration Approaches: from Nuxt 2 to Nuxt 3

Angular:
• Crafting a Resizable Sidenav in Angular
• New way of passing data to dynamically created components (New Feature 🎉)
• Getting Started with a New Angular Project in 2023
• The story behind Angular Signals!