State of HTML 2023

This year, Lea Verou took on the formidable task of leading the design of a brand-new State of HTML survey, from content to UX and beyond. Take the survey and help us shape the evolution of the web platform. - https://survey.devographics.com/en-US/survey/state-of-html/2023

#survey

Techniques for Sharing Data between Vue.js Components

In this article, you’ll learn about the various techniques data is shared between Vue.js components.
Props, Emits, Slots, Stores as well as Provide and Inject - https://vueschool.io/articles/vuejs-tutorials/techniques-for-sharing-data-between-vue-js-components

#vue

Token Based Authentication with JWTs in Fastify

Learn how to build secure authentication systems with Fastify, JWT, and TypeScript with this guide. - https://thatarif.in/posts/token-based-authentication-with-fastify-jwt

#nodejs

Revealing Images With CSS Mask Animations

Temani Afif demonstrates how CSS masks combined with gradients allow you to create fancy hover effects on images — with efficient, reusable code. - https://www.smashingmagazine.com/2023/09/revealing-images-css-mask-animations

#css

tRPC + Next.js App Router = Simple Typesafe APIs - https://www.youtube.com/watch?v=qCLV0Iaq9zU

#react #nextjs

Standalone Angular & Nx

Standalone components, directives, and pipes are the future of Angular. Luckily, Nx works great with the new… - https://medium.com/ngconf/standalone-angular-nx-414882d8d787

#angular

6 Patterns for Microfrontends

An overview of microfrontend patterns: advantages, drawbacks and implementation. - https://blog.bitsrc.io/6-patterns-for-microfrontends-347ae0017ec0

#microfrontends

Why the Temporal API is Awesome

It’s still sat in stage 3 as a proposal, but the Temporal API aims to work around a lot of Date’s limitations without needing to rely on third-party libraries. - https://taro.codes/posts/2023-08-23-temporal-api/

#nodejs

Official Nuxt Module for TresJS is released

TresJs let's you build 3D scene as they were Vue components.
You don't need to import the components or composables from the TresJS ecosystem anymore, they will be auto-imported for you. - https://tresjs.org/blog/announcing-tres-nuxt-module.html

#vue

Making Sense of React Server Components

React Server Components have attracted a lot of attention this year, with Dan Abramov even creating a somewhat technical ‘let’s reimplement RSCs from scratch’ guide to hammer the concepts home. This post, however, demystifies what RSCs are, why they matter, and the opportunities they’re opening up, in an easy to follow way. - https://www.joshwcomeau.com/react/server-components/

#react

A quick introduction to CSS @scope

Bramus Van Damme gives a nice introduction to @scope, a way to scope the reach of your CSS selectors. - https://www.bram.us/2023/08/22/a-quick-introduction-to-css-scope

#css

In Defence of DOMContentLoaded

A solid explainer on measuring browser events and the use cases for DOMContentLoaded (and related events) in particular. "The DOMContentLoaded event fires once all of your deferred JavaScript has finished running." - https://csswizardry.com/2023/07/in-defence-of-domcontentloaded/

#javascript

Setting up Module Federation with Server-Side Rendering for Angular

Module Federation is a technology provided by Webpack that enables modules to be federated across different… - https://blog.nrwl.io/setting-up-module-federation-with-server-side-rendering-for-angular-66bae10ead2d

#angular

Using JSX with Vue.js

Love it or hate it, JSX is a popular extension to JavaScript that allows XML tokens in your scripts. If you want to create templates in your script files and you find Vue’s render() function to be difficult to work with, JSX may be just what you need. Explore the basics of using JSX in building your Vue.js components in this Blogpost. - https://medium.com/js-dojo/using-jsx-with-vue-js-846f4fbbf07f

#vue

Why to Build Test Data Factories with Prisma - https://spin.atomicobject.com/2023/09/20/data-factories-prisma/

#nodejs

Limitations of Scoped CSS

Zell Liew outlines the limitations of scoped CSS that can be found in major frameworks like React, Vue, Svelte, and Astro. - https://zellwk.com/blog/limitations-of-scoped-css

#css

How to Pass a Component as a Prop in React

Some different ways to pass a component as a prop in a type-safe manner: passing JSX, using React.ComponentType, and using React.ElementType. - https://www.totaltypescript.com/pass-component-as-prop-react

#react

6 Advanced TypeScript tricks for Clean Code

Six advanced TypeScript tips will be covered here, along with examples showing how each one works step by… - https://medium.com/@mvsg/6-advanced-typescript-tricks-for-clean-code-90cee774dbf3

#typescript

How To Use Web Workers In A Nuxt App

This project is written to share the usage of Web Work in the Nuxt3 app. Web Work is a fantastic feature of modern front-end web development which can provide the possibility of multithread computing on the web frontend. The combination of Web Worker and the popular SSR framework Nuxt3 can provide unlimited possibilities. - https://medium.com/@yinte1222/nuxt3-how-to-use-web-workers-in-a-nuxt-app-d03c1c8f2952

#vue

CommonJS is Hurting JavaScript

An interesting take on Node’s default module system, its history, its shortcomings, and the trickiness of managing both CommonJS and ES modules at once. It's perhaps no surprise the folks at Deno would like to see CommonJS disappear, but... - https://deno.com/blog/commonjs-is-hurting-javascript

#nodejs