Holograms, Light-Leaks and How To Build CSS-Only Shaders
Robb Owen looks at how CSS blend modes unleash the potential of cool compositing effects without the need for JavaScript. - https://robbowen.digital/wrote-about/css-blend-mode-shaders?utm_campaign=holograms--light-leaks-and-how-to-build
#css
Robb Owen looks at how CSS blend modes unleash the potential of cool compositing effects without the need for JavaScript. - https://robbowen.digital/wrote-about/css-blend-mode-shaders?utm_campaign=holograms--light-leaks-and-how-to-build
#css
Robb Owen Digital
Holograms, light-leaks and how to build CSS-only shaders.
Get a shiny WebGL look without actually using WebGL. In this article we take a look at how CSS blend modes unleash the potential of cool compositing effects without the need for JavaScript
👍4
How We Built a Themeable Multi-Brand Design System with Vue.js
This article explains the creation of a Vue-based design system, from the first meetings to the first projects in production. - https://dev.to/monisnap/how-we-built-a-themeable-multi-brand-design-system-with-vuejs-4flk?utm_campaign=how-we-built-a-themeable-multi-brand-des
#vue
This article explains the creation of a Vue-based design system, from the first meetings to the first projects in production. - https://dev.to/monisnap/how-we-built-a-themeable-multi-brand-design-system-with-vuejs-4flk?utm_campaign=how-we-built-a-themeable-multi-brand-des
#vue
DEV Community
How we built a themeable multi-brand design system with Vue.js
At Monisnap our goal is to enable users to support their friends and family abroad by providing...
👍2
Angular — environment configuration at runtime
Build your app once and inject the environment configuration at runtime for any stage - https://levelup.gitconnected.com/angular-environment-configuration-at-runtime-b44e230da585?utm_campaign=angular--environment-configuration-at-r
#angular
Build your app once and inject the environment configuration at runtime for any stage - https://levelup.gitconnected.com/angular-environment-configuration-at-runtime-b44e230da585?utm_campaign=angular--environment-configuration-at-r
#angular
Medium
Angular — environment configuration at runtime
Build your app once and inject the environment configuration at runtime for any stage
👍4
Ready for changes with Hexagonal Architecture
A story on how we leveraged Hexagonal Architecture principles to be prepared for changes in the Netflix… - https://netflixtechblog.com/ready-for-changes-with-hexagonal-architecture-b315ec967749?utm_campaign=ready-for-changes-with-hexagonal-archite
#architecture
A story on how we leveraged Hexagonal Architecture principles to be prepared for changes in the Netflix… - https://netflixtechblog.com/ready-for-changes-with-hexagonal-architecture-b315ec967749?utm_campaign=ready-for-changes-with-hexagonal-archite
#architecture
Medium
Ready for changes with Hexagonal Architecture
A story on how we leveraged Hexagonal Architecture principles to be prepared for changes in the Netflix Studio ecosystem.
👍2
Popular Node.js Patterns and Tools to Reconsider?
Yoni is well known for his work in cataloging Node best practices but he thinks we should reflect upon entrenched approaches over time. Here he presents nine common approaches to reconsider, including the use of Dotenv, Passport.js, and having conditional code based on the value of NODE_ENV. - https://practica.dev/blog/popular-nodejs-pattern-and-tools-to-reconsider/?utm_campaign=popular-node.js-patterns-and-tools-to-re
#nodejs
Yoni is well known for his work in cataloging Node best practices but he thinks we should reflect upon entrenched approaches over time. Here he presents nine common approaches to reconsider, including the use of Dotenv, Passport.js, and having conditional code based on the value of NODE_ENV. - https://practica.dev/blog/popular-nodejs-pattern-and-tools-to-reconsider/?utm_campaign=popular-node.js-patterns-and-tools-to-re
#nodejs
practica.dev
Popular Node.js patterns and tools to re-consider | Practica.js
Node.js is maturing. Many patterns and frameworks were embraced - it's my belief that developers' productivity dramatically increased in the past years. One downside of maturity is habits - we now reuse existing techniques more often. How is this a problem?
👍5
Why React Re-Renders
The processes around rendering are so important to understand and get right if you want to get the best performance possible from your React apps. There’s no shortage of stories talking about making React rendering more efficient, but this one digs into why React re-renders in the first place and in an accessible, easily followed way too. - https://www.joshwcomeau.com/react/why-react-re-renders/?utm_campaign=why-react-re-rendersthe-processes-ar
#react
The processes around rendering are so important to understand and get right if you want to get the best performance possible from your React apps. There’s no shortage of stories talking about making React rendering more efficient, but this one digs into why React re-renders in the first place and in an accessible, easily followed way too. - https://www.joshwcomeau.com/react/why-react-re-renders/?utm_campaign=why-react-re-rendersthe-processes-ar
#react
Joshwcomeau
Why React Re-Renders • Josh W. Comeau
In React, we don't update the DOM directly, we tell React what we want the DOM to look like, and React tackles the rest. But how exactly does it do this? In this tutorial, we'll unpack exactly when and why React re-renders, and how we can use this information…
👍6
Style with Stateful, Semantic Selectors
Ben Myers explains how you can create more robust styles by exposing element state to assistive technologies. - https://benmyers.dev/blog/semantic-selectors?utm_campaign=style-with-stateful--semantic-selectors
#css
Ben Myers explains how you can create more robust styles by exposing element state to assistive technologies. - https://benmyers.dev/blog/semantic-selectors?utm_campaign=style-with-stateful--semantic-selectors
#css
Ben Myers
Style with Stateful, Semantic Selectors
See how building with accessible semantics from the get-go can give you expressive, meaningful style hooks for free.
👍4
How to improve the PageSpeed score of your Nuxt.js website in 6 steps
- https://localazy.com/blog/how-improve-pagespeed-score-nuxt-js-website-6-steps?utm_campaign=how-to-improve-the-pagespeed-score-of-yo
#vue
- https://localazy.com/blog/how-improve-pagespeed-score-nuxt-js-website-6-steps?utm_campaign=how-to-improve-the-pagespeed-score-of-yo
#vue
localazy.com
How to improve the PageSpeed score of your Nuxt.js website in 6 steps
Poor website performance might be costing you money. Learn why the PageSpeed score is important and how the web developers at Localazy improved the PageSpeed score of our Nuxt.js website in 6 steps.
👍6
Micro Frontends in Action: Architecture and Integration Approaches
A good frontend is tough to develop, but scaling frontend development for several teams to work at the same… - https://medium.com/deciphering-deadlocks/micro-frontends-in-action-architecture-and-integration-approaches-411e1e3b66b6?utm_campaign=micro-frontends-in-action-architecture
#microfrontends
A good frontend is tough to develop, but scaling frontend development for several teams to work at the same… - https://medium.com/deciphering-deadlocks/micro-frontends-in-action-architecture-and-integration-approaches-411e1e3b66b6?utm_campaign=micro-frontends-in-action-architecture
#microfrontends
Medium
Micro Frontends in Action: Architecture and Integration Approaches
A good frontend is tough to develop, but scaling frontend development for several teams to work at the same time on a large and complex…
👍5
Introducing Gatsby, A 'Reactive Site Generator'?
Gatsby’s new focus is on enabling teams to publish content rapidly using a new architecture that they say allows Gatsby Cloud to publish to its CDN in one second. This post benchmarks Gatsby’s “Reactive Site Generation” (RSG) approach against traditional static and server side approaches. - https://www.gatsbyjs.com/blog/re-introducing-gatsby-a-reactive-site-generator/?utm_campaign=introducing-gatsby--a-reactive-site-gen
#react
Gatsby’s new focus is on enabling teams to publish content rapidly using a new architecture that they say allows Gatsby Cloud to publish to its CDN in one second. This post benchmarks Gatsby’s “Reactive Site Generation” (RSG) approach against traditional static and server side approaches. - https://www.gatsbyjs.com/blog/re-introducing-gatsby-a-reactive-site-generator/?utm_campaign=introducing-gatsby--a-reactive-site-gen
#react
Gatsby
(Re-) Introducing Gatsby, A Reactive Site Generator | Gatsby
Gatsby Cloud can now publish to our CDN in one second. This is now 100x faster than the exact same Gatsby site building on a standard CI/CD service! I introduce a benchmark to compare Reactive Site Generation (RSG) to Static Site Generators (SSG) and Server…
👍4❤1
How to Use OpenTelemetry to Trace Node.js Applications
A five-step tutorial sharing how to instrument your app to better troubleshoot production errors. - https://developers.redhat.com/articles/2022/08/23/how-use-opentelemetry-trace-nodejs-applications?utm_campaign=how-to-use-opentelemetry-to-trace-node.j
#nodejs
A five-step tutorial sharing how to instrument your app to better troubleshoot production errors. - https://developers.redhat.com/articles/2022/08/23/how-use-opentelemetry-trace-nodejs-applications?utm_campaign=how-to-use-opentelemetry-to-trace-node.j
#nodejs
Red Hat Developer
How to use OpenTelemetry to trace Node.js applications | Red Hat Developer
One great thing about Node.js is how well it performs inside a container. The shift to containerized deployments and environments comes with extra complexity. This article addresses the added
👍5
Dynamic Link Previews for a React SPA using AWS Lambda@Edge
Using AWS’s edge-based serverless function service to render an index.html with dynamic meta tags to support link previews on WhatsApp, Twitter, and similar services for a React SPA. - https://cgarethc.medium.com/dynamic-link-previews-with-a-react-spa-using-aws-lambda-edge-e33d51e6795c?utm_campaign=dynamic-link-previews-for-a-react-spa-us
#spa #link #preview
Using AWS’s edge-based serverless function service to render an index.html with dynamic meta tags to support link previews on WhatsApp, Twitter, and similar services for a React SPA. - https://cgarethc.medium.com/dynamic-link-previews-with-a-react-spa-using-aws-lambda-edge-e33d51e6795c?utm_campaign=dynamic-link-previews-for-a-react-spa-us
#spa #link #preview
Medium
Dynamic link previews with a React SPA using AWS Lambda@Edge
Using AWS Lambda@Edge to render an index.html with dynamic meta tags to support link previews on WhatsApp, Twitter etc for a React SPA
👍5
Component Communication in VueJs - https://pasankamburugamuwa1.medium.com/component-communication-in-vuejs-6a4ee553fcbf?utm_campaign=component-communication-in-vuejs---https
#vue
#vue
Medium
Component Communication in VueJs
In most Javascript frameworks, the entire web page is divided into smaller components and together with all those components, we call a web…
❤3
The Future of CSS: Variable Units, powered by Custom Properties
Bramus Van Damme explains how CSS Custom Units work. - https://www.bram.us/2022/07/08/the-future-of-css-variable-units-powered-by-custom-properties/?utm_campaign=the-future-of-css-variable-units--power
#css
Bramus Van Damme explains how CSS Custom Units work. - https://www.bram.us/2022/07/08/the-future-of-css-variable-units-powered-by-custom-properties/?utm_campaign=the-future-of-css-variable-units--power
#css
Bram.us
The Future of CSS: Variable Units, powered by Custom Properties
Thanks to Variable Units, authors can define Custom Properties and use them as units in their CSS
👍4
Extract Parameter Types from String Literal Types with TypeScript
If the things that TypeScript’s type system can do impress or confuse you, this well presented article will give you a turbocharged dose of either..! - https://lihautan.com/extract-parameters-type-from-string-literal-types-with-typescript/?utm_campaign=extract-parameter-types-from-string-lite
#typescript
If the things that TypeScript’s type system can do impress or confuse you, this well presented article will give you a turbocharged dose of either..! - https://lihautan.com/extract-parameters-type-from-string-literal-types-with-typescript/?utm_campaign=extract-parameter-types-from-string-lite
#typescript
👍4
Advanced React Component Composition
A deep dive into the principles of composition for designing and building reusable components that scale. - https://frontendmastery.com/posts/advanced-react-component-composition-guide/?utm_campaign=advanced-react-component-composition
#react
A deep dive into the principles of composition for designing and building reusable components that scale. - https://frontendmastery.com/posts/advanced-react-component-composition-guide/?utm_campaign=advanced-react-component-composition
#react
Frontendmastery
Advanced React component composition
A deep dive on composition in React. Learn key principles for designing and building reusable components that scale.
👍4
Code Angular the 2022 Way
Don’t be left out of Angular 14 by continuing to code Angular the old way. Upgrade your app today to make your code cleaner and faster. - https://javascript.plainenglish.io/code-angular-the-2022-way-make-the-change-and-be-ahead-8493224ac6ae?utm_campaign=code-angular-the-2022-waydont-be-le
#angular
Don’t be left out of Angular 14 by continuing to code Angular the old way. Upgrade your app today to make your code cleaner and faster. - https://javascript.plainenglish.io/code-angular-the-2022-way-make-the-change-and-be-ahead-8493224ac6ae?utm_campaign=code-angular-the-2022-waydont-be-le
#angular
Medium
Code Angular the 2022 Way
Don’t be left out of Angular 14 by continuing to code Angular the old way. Upgrade your app today to make your code cleaner and faster.
👍3
Vue recursive components: Rendering nested comments - https://blog.logrocket.com/rendering-nested-comments-recursive-components-vue/
#vue
#vue
LogRocket Blog
Vue recursive components: Rendering nested comments - LogRocket Blog
Explore how you can use recursive components in Vue to manage tree-like structured data with an example comments section.
❤4👍1
Avoiding <img> layout shifts: aspect-ratio vs width & height attributes
Jake Archibald explores ways to avoid layout shifts using width and height attributes or aspect-ratio in CSS. - https://jakearchibald.com/2022/img-aspect-ratio
#css
Jake Archibald explores ways to avoid layout shifts using width and height attributes or aspect-ratio in CSS. - https://jakearchibald.com/2022/img-aspect-ratio
#css
Jakearchibald
Avoiding <img> layout shifts: aspect-ratio vs width & height attributes
Two ways to do the same thing, but which is best?
👍6