Frontend Masters's Avatar

Frontend Masters

@frontendmasters.com

Master the Full Stack: Frontend to Backend → https://frontendmasters.com/?utm_source=bluesky&utm_medium=social_profile&utm_campaign=x_profile

1,565
Followers
17
Following
175
Posts
13.11.2024
Joined
Posts Following

Latest posts by Frontend Masters @frontendmasters.com

Preview
The Enforced Accessibility of the Geolocation Element It's a strange situation where some CSS is disallowed, some is allowed but breaks the button, and some is capped.

The Enforced Accessibility of the Geolocation Element

It's a strange situation where some CSS is disallowed, some is allowed but breaks the button, and some is capped.

10.03.2026 08:39 👍 1 🔁 0 💬 0 📌 0
Preview
The Big Gotcha of Anchor Positioning As it stands, you have to think about the layout engine and whether an element is

The Big Gotcha of Anchor Positioning

As it stands, you have to think about the layout engine and whether an element is "fully laid out" before an anchor is allowed to apply to it. Boooooo.

06.03.2026 08:39 👍 11 🔁 1 💬 1 📌 1
Preview
Post Mortem: Rewriting AgnosticUI with Lit Web Components A framework-agnostic component library, designed to be styled. It can be done.

Post Mortem: Rewriting AgnosticUI with Lit Web Components

A framework-agnostic component library, designed to be styled. It can be done.

04.03.2026 08:39 👍 1 🔁 0 💬 0 📌 0
Preview
The Odometer Effect (without JavaScript) We can take a value set in an HTML attribute and use it in CSS, even extracting each individual digit in order to animate separately.

The Odometer Effect (without JavaScript)

We can take a value set in an HTML attribute and use it in CSS, even extracting each individual digit in order to animate separately.

02.03.2026 15:39 👍 0 🔁 0 💬 0 📌 0
Preview
Angular Learning Path - Create TypeScript-based Web Applications with a Framework Led by Google Angular is an application-design framework and development platform for creating efficient and sophisticated single-page apps.

The Angular learning path just got two new courses from Alex Okrushko of the NgRx core team, picking up where Mark Techson's fundamentals course left off. Signals, SignalStore, SSR, RxJS, and testing.

The full modern Angular path! frontendmasters.com/learn/angular/

26.02.2026 20:38 👍 0 🔁 0 💬 0 📌 0
Preview
Lessons Learned from Failed Demos: Pure CSS Nav Thumb Flip on Scroll A list of items with thumbnails that flip into place as needed. Can we ditch the JavaScript?

Lessons Learned from Failed Demos: Pure CSS Nav Thumb Flip on Scroll

A list of items with thumbnails that flip into place as needed. Can we ditch the JavaScript?

26.02.2026 15:39 👍 1 🔁 0 💬 0 📌 1
Preview
Enterprise UI Dev: Microfrontends, Testing, & Code Quality — Exclusive Workshop Manage and Maintain Large, Complex Codebases

💻 Next Week: Steve Kinney is back with a revamped version of his flagship Enterprise UI Dev workshop — now expanded to cover Microfrontends, Testing and Code Quality, updated tooling, and more.

Join us live!

🔴 March 3–4 | 9:30 AM–4:30 PM Central frontendmasters.com/workshops/en...

25.02.2026 20:09 👍 2 🔁 0 💬 0 📌 0
Preview
How I Setup Production-Grade Deployment for My (Somewhat) Vibe-Coded App Some solid advice from a couple of Frontend Masters courses made for a fast, secure, and ready to scale deployment system.

How I Setup Production-Grade Deployment for My (Somewhat) Vibe-Coded App

Some solid advice from a couple of Frontend Masters courses made for a fast, secure, and ready to scale deployment system.

24.02.2026 15:39 👍 1 🔁 0 💬 1 📌 0
Preview
Virtual Scroll-Driven 3D Scenes You can capture scrolling events and do your own work with the information in them. It can do cool things, but you've got work to do.

Virtual Scroll-Driven 3D Scenes

You can capture scrolling events and do your own work with the information in them. It can do cool things, but you've got work to do.

23.02.2026 15:39 👍 2 🔁 0 💬 0 📌 0

Spring 2026 (25 Days)
- February 24th: Permission Systems that Scale with Kyle Cook
- March 3rd & 4th: Enterprise UI Dev, v2 with Steve Kinney
- March 10th & 11th: Complete Intro to Databases with Brian Holt
- March 18th & 19th: Interview Prep, v2 with Evgenii Ray
- March 31st: TanStack Start Fundamentals with Adam Rackis
- April 6th & 7th: AI Engineering Fundamentals with Scott Moss
- April 8th: Svelte & SvelteKit 5+ with Rich Harris
- April 14th: Automate Dev with Self-Testing AI Agents with Steve Kinney
- April 16th: Deploying SPAs on AWS, v3 with Steve Kinney
- April 21st: Claude Code Deep Dive with Lydia Hallie
- April 28th: CI/CD with GitHub Actions with Erik Reinert
- May 6th & 7th: Python for Professional Developers with Nina Zakharenko
- May 12th: Frontend Architecture: Monoliths to Microfrontends with Maxi Ferreira
- May 19th: Rails Fundamentals with Chris Oliver
- June 2nd & 3rd: Kubernetes with Erik Reinert
- June 9th: Hard Parts of AI Engineering with Will Sentance
- TBD: Practical AI Agents with Sabrina Goldfarb

Spring 2026 (25 Days) - February 24th: Permission Systems that Scale with Kyle Cook - March 3rd & 4th: Enterprise UI Dev, v2 with Steve Kinney - March 10th & 11th: Complete Intro to Databases with Brian Holt - March 18th & 19th: Interview Prep, v2 with Evgenii Ray - March 31st: TanStack Start Fundamentals with Adam Rackis - April 6th & 7th: AI Engineering Fundamentals with Scott Moss - April 8th: Svelte & SvelteKit 5+ with Rich Harris - April 14th: Automate Dev with Self-Testing AI Agents with Steve Kinney - April 16th: Deploying SPAs on AWS, v3 with Steve Kinney - April 21st: Claude Code Deep Dive with Lydia Hallie - April 28th: CI/CD with GitHub Actions with Erik Reinert - May 6th & 7th: Python for Professional Developers with Nina Zakharenko - May 12th: Frontend Architecture: Monoliths to Microfrontends with Maxi Ferreira - May 19th: Rails Fundamentals with Chris Oliver - June 2nd & 3rd: Kubernetes with Erik Reinert - June 9th: Hard Parts of AI Engineering with Will Sentance - TBD: Practical AI Agents with Sabrina Goldfarb

We have an exciting spring 2026 workshop lineup! 🌱

19.02.2026 16:13 👍 6 🔁 0 💬 0 📌 0
Preview
AI Hates Ambiguity: A Guide to Probability The more effort you put in to what you put in, the higher quality you're going to get out.

AI Hates Ambiguity: A Guide to Probability

The more effort you put in to what you put in, the higher quality you're going to get out.

19.02.2026 15:39 👍 1 🔁 0 💬 0 📌 0
Making a Frontend Masters workshop - Day 3: The workshop continues
Making a Frontend Masters workshop - Day 3: The workshop continues YouTube video by General Musings with Kevin Powell

The next part in my series on making a @frontendmasters.com workshop is out!

youtu.be/Mu6Ko-wIvL0

17.02.2026 13:00 👍 9 🔁 1 💬 1 📌 0
Preview
Anchored Menus and a Lesson in Scoping Turns out `anchor-scope` is pretty darn useful for button/menu setups that will appear multiple times on the same page.

Anchored Menus and a Lesson in Scoping

Turns out `anchor-scope` is pretty darn useful for button/menu setups that will appear multiple times on the same page.

17.02.2026 08:39 👍 1 🔁 0 💬 0 📌 0
Preview
Fun with TypeScript Generics Generics, combined with conditional types can make for an incredibly powerful combination. When you look at things the right way, you can ask very useful questions about your types that allow you to build...

Fun with TypeScript Generics

Generics, combined with conditional types can make for an incredibly powerful combination. When you look at things the right way, you can ask very useful questions about your types that allow you to build the precise API you want.

14.02.2026 08:39 👍 3 🔁 1 💬 0 📌 0
Current subscriber count: 999,007.

Current subscriber count: 999,007.

The quest to 1 million has been going slowly the past 2 years, but it looks like it'll finally happen!

12.02.2026 13:23 👍 104 🔁 5 💬 8 📌 2
Preview
Learn CSS & Responsive Design Fundamentals Learn the essentials of typography, responsive grid layout, animations, and form styling. By the end, you'll have the foundation to dive into your next vanilla CSS codebase or use utility-first approa...

“The CSS course I wish existed when I was learning.” @kevinpowell.co

Modern CSS Fundamentals is now live!

Box model, typography, Grid, Flexbox, responsive layouts, animations, forms, all grounded in understanding why CSS works the way it does.

frontendmasters.com/courses/css-...

11.02.2026 16:23 👍 9 🔁 2 💬 0 📌 0
Preview
How to Create a CSS-only Elastic Text Effect What can we say except BOINNNGGG BOINNGGGGGG.

How to Create a CSS-only Elastic Text Effect

What can we say except BOINNNGGG BOINNGGGGGG.

11.02.2026 15:39 👍 2 🔁 1 💬 1 📌 0

And if you're curious what it's like to make a workshop with @frontendmasters.com, I just put out part 1 in my behind the scenes vlog that I recorded while we made this one.

www.youtube.com/watch?v=N8DX...

10.02.2026 17:36 👍 16 🔁 4 💬 0 📌 0
Preview
Background Patterns with CSS `corner-radius` You might need to know this someday: you can style a div, put the div into SVG, then put the SVG in to CSS and use it as a repeating background.

Background Patterns with CSS `corner-radius`

You might need to know this someday: you can style a div, put the div into SVG, then put the SVG in to CSS and use it as a repeating background.

10.02.2026 08:39 👍 5 🔁 1 💬 0 📌 0
Video thumbnail

One thing you'd never know watching a @frontendmasters.com workshop or course is that they have an *amazing* view.

I'm putting the finishing touches on a behind the scenes of my experience making a workshop with them this past October... though this view might be the highlight 😅

07.02.2026 15:57 👍 41 🔁 3 💬 1 📌 0
Preview
The Browser Hates Surprises To avoid page loading jank, there are things we can do to avoid content from shifting around, even if repainting is still necessary.

The Browser Hates Surprises

To avoid page loading jank, there are things we can do to avoid content from shifting around, even if repainting is still necessary.

07.02.2026 08:39 👍 2 🔁 0 💬 0 📌 0
Preview
An Over-The-Top Spoiler Design with the Details Element details { body:has(&[open]) { /* so much power */ } }

An Over-The-Top Spoiler Design with the Details Element

details {
body:has(&[open]) {
/* so much power */
}
}

05.02.2026 08:39 👍 2 🔁 1 💬 0 📌 0
Preview
Closure, Async, and OOP: The Hard Parts of JavaScript Build a rock-solid understanding of JavaScript paradigms that challenge even seasoned developers like closure, async code execution, prototypal inheritance, and OOP. Follow the thread of execution thr...

JavaScript: The Hard Parts v3 just dropped. 4.92 rating. Most loved course in our annual survey, year after year.

Will Sentance (founder of Codesmith, Oxford fellow) has the unique ability to build mental models for how JavaScript actually works

frontendmasters.com/courses/java...

04.02.2026 17:43 👍 2 🔁 0 💬 0 📌 0
Preview
Performance-Optimized Video Embeds with Zero JavaScript Putting a YouTube video inside a closed details element means it won't load until that details element is opened. We can use that.

Performance-Optimized Video Embeds with Zero JavaScript

Putting a YouTube video inside a closed details element means it won't load until that details element is opened. We can use that.

03.02.2026 08:39 👍 3 🔁 3 💬 0 📌 1
Preview
React’s ViewTransition Element The Canary version of React has a special component for ViewTransitions. Does it help?

React’s ViewTransition Element

The Canary version of React has a special component for ViewTransitions. Does it help?

31.01.2026 08:39 👍 0 🔁 0 💬 0 📌 0
Preview
What Senior Engineers Need to Know About AI Coding Tools >

What Senior Engineers Need to Know About AI Coding Tools

> "The quality of the question directly relates to the quality of the answer," she says. "This shouldn't be surprising to us, right? This is the same thing with us as humans."

29.01.2026 15:39 👍 3 🔁 1 💬 0 📌 0
Preview
AI Agents | LLMs, Tool Calling, and Human-in-the-Loop Create a CLI agent with custom tool calling, evals, context window management, and a human-in-the-loop approval flow.

What if you could build an AI agent that runs shell commands, searches the web, and asks your approval before doing anything risky?
That's what Scott Moss (Netflix) teaches in our new course.
👉 frontendmasters.com/courses/ai-a...

28.01.2026 16:24 👍 1 🔁 1 💬 0 📌 0
Preview
Single Flight Mutations in TanStack Start: Part 2 This post introduces a middleware approach that allows efficient data refetching. The middleware enables the attachment of query keys and server functions, enhancing scalability and flexibility.

Single Flight Mutations in TanStack Start: Part 2

This post introduces a middleware approach that allows efficient data refetching. The middleware enables the attachment of query keys and server functions, enhancing scalability and flexibility.

28.01.2026 15:39 👍 0 🔁 0 💬 0 📌 0
Preview
Supporting Open Source in 2026: Why It Matters More Than Ever ($50,000) > ... we need to be honest about what's happening: the infrastructure that powers modern software development is under financial strain, even as usage reaches all-time highs.

Supporting Open Source in 2026: Why It Matters More Than Ever ($50,000)

> ... we need to be honest about what's happening: the infrastructure that powers modern software development is under financial strain, even as usage reaches all-time highs.

27.01.2026 08:39 👍 2 🔁 1 💬 0 📌 0
Preview
Single Flight Mutations in TanStack Start: Part 1 What if we could mutate data *and* get all the data back we need to properly update the UI in just one network round-trip?

Single Flight Mutations in TanStack Start: Part 1

What if we could mutate data *and* get all the data back we need to properly update the UI in just one network round-trip?

24.01.2026 08:39 👍 1 🔁 0 💬 0 📌 0