Front-End Fire – Détails, épisodes et analyse

Tanner Linsley, creator of TanStack Query and TanStack Router, continues expanding the Tanner-verse with a new TanStack Start framework. It’s a full-stack React framework powered by TanStack Router, Vinxi, and Vite, and boasts all the mainstays of a JavaScript framework today, including SSR, streaming, server function support, RPCs, and more. 

With the release of the new Apple operating system, iOS 18, comes new updates to the Safari browser and its WebKit rendering engine. A couple notable highlights for Safari 18 are “distraction control” where users can hide distracting items on web pages like sign-in banners, cookie preference popups, and newsletter signup overlays, and iPhone mirroring and remote inspection.

And the Astro team is at it again with the release of Astro 5.0 beta. This new release introduces the Astro Content Layer, a flexible, extensible way to interact with content in Astro, no matter where it comes from. 

And for the Fire Starters section of the show this week we learn more about the writingsuggestions attribute. 

News:

• Paige - TanStack Start
• Jack - Astro 5.0 Beta Release
• TJ - WebKit Features in Safari 18.0

Bonus News:

• Next.js SaaS starter

Fire Starters:

• writingsuggestions attribute

What Makes Us Happy this Week:

• Paige - Bad Monkey show and Carl Hiaasen books in general
• Jack - iOS 18 and Sony Alpha 7C II - Full-frame interchangeable Lens Hybrid Camera
• TJ - Bookshelves 

Thanks as always to our sponsor, the Blue Collar Coder channel on YouTube. You can join us in our Discord channel, explore our website and reach us via email, or Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

Big news this week when it’s announced that OpenAI, the company behind ChatGPT, has moved ChatGPT from using Next.js to using Remix. While both metaframeworks rely on React under the hood, Remix seems a bit less opinionated about how teams might want to structure their projects to best suit their unique use cases and needs.

TypeScript has also released v5.6, and amongst the many improvements is one many day-to-day TS users will benefit from: disallowed nullish and truthy checks. Although the name sounds impressive and confusing, what it boils down to is: if TS identifies an if statement that will always evaluate to true or false because a dev forgot to actually invoke a function or misplaced parentheses or [insert many, many ways we introduce bugs into our code], TypeScript will now throw an error. 

Because the JavaScript gods demand at least one new framework or meta-framework each week, this week’s tribute is HonoX. We previously discussed new framework Hono back in episode 32, when it debuted as a lightweight framework built on web standards and able to run on any JS runtime, and now it’s back with meta-framework HonoX.

And the team introduces a new segment this week called Fire Starters. Each week we’ll try to find a more obscure bit of HTML, CSS or JS info from around the web, and talk about it so we can all learn something new. The first topic is CSS property initial-letter.

News:

• Paige - HonoX meta-framework
• Jack - OpenAI moves ChatGPT from React to Remix
• TJ - TypeScript 5.6

Bonus News:

• OpenAI o1-preview
• Vinxi is another alternative RSC server

Fire Starters:

• initial-letter

What Makes Us Happy this Week:

• Paige - The Offer miniseries
• Jack - The Lord of the Rings: The Rings of Power series 
• TJ - The Perfect Couple limited series

Thanks as always to our sponsor, the Blue Collar Coder channel on YouTube. You can join us in our Discord channel, explore our website and reach us via email, or Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

Friend of the podcast (and previous guest host), Jason Lengstorf, joins Jack and Paige today to talk about the latest happenings in the web dev world - and wax poetic at the end about favorite restaurants and fine dining.

First up, is AI model runner ONNX, which Jack’s been digging into recently. ONNX offers many pre-trained models which can run locally or in the browser and integrates well with many different programming languages.

After that is new Lodash library competitor es-toolkit. It’s smaller, faster, relies heavily on native browser APIs, and wants to supplant Lodash for all those useful helper functions so many JS apps still rely heavily on.

Then there’s a new React project framework named react-server that claims to be the easiest way to build React apps with server-side rendering.

Finally, Jason shares his experience with full stack JavaScript SDK Vinxi, which makes it easy for devs to build JavaScript apps and even frameworks.

News:

• Paige - es-toolkit and what’s next for ESLint 
• Jack - ONNX (Open Neural Network Exchange) AI model runner and React Server
• Jason - Vinxi · Dev Agrawal on LWJ teaching Vinxi · Nikhil on Vinxi at ViteConf

Special Guest:

Jason Lengstorf, host of Learn with Jason and developer-focused media consultant.

• Jason’s X profile @jlengstorf
• Jason’s YouTube channel
• Learn with Jason site
• Jason’s link tree (jason.energy/links)

What Makes Us Happy this Week:

• Paige - The Bear TV series
• Jack - Inside Out 2 movie
• Jason - Chef movie and The Chef Show

Thanks as always to our sponsor, the Blue Collar Coder channel on YouTube. You can join us in our Discord channel, explore our website and reach us via email, or Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

The hosts switch up the regular news format this week in favor of another favorite developer topic: tech gear. All the extras that make web development that little bit nicer.

If you were stranded on a desert island (that only had power and Internet), what tech gear would you bring that you just can’t live without?

Aside from MacBook Pros for all three hosts, there’s a good variety of office chairs, adjustable desks, external monitors, keyboards, mice, headphones, microphones, and even cameras. Many of the recognizable brand names make an appearance like: Apple, Logitech, Elgato, Microsoft, Steelcase, and Shure.

If you’ve ever wanted recommendations from folks actively using these products (and not getting sponsored to endorse them) then this is the episode for you.

And of course, we want to know what you use as well, so join us in the Discord to share your own workspace setups, the gear you can’t live without, and anything else you want to talk about.

News:

• Paige’s picks -
  • Logitech MX Keys S keyboard
  • Tresanti Adjustable Height Desk
  • Camo software to turn any camera phone into a webcam
  • Arzopa 15.6” Portable Monitor 
• Jack’s picks -
  • Logitech Vertical Mouse (Lift)
  • Elgato Prompter
  • Elgato Stream Deck
  • Shure SM7B Microphone
  • Das Keyboard
• TJ’s picks - 
  • Steelcase Leap
  • Microsoft Ergonomic Keyboard
  • AirPods Pro
  • Apple Magic Mouse

What Makes Us Happy this Week:

• Paige - The Hunger Games movie series
• Jack - Hanging with Jason Lengstorf
• TJ - Harry Potter movie series 

Thanks as always to our sponsor, the Blue Collar Coder channel on YouTube. You can join us in our Discord channel, explore our website and reach us via email, or Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

In a rare turn of events, it was a slightly quieter week in terms of actual web development news, so the hosts round up some technology-adjacent news and drama to share.

Jack kicks off the show recounting his experience of being one of four developers in a reality show-type scenario that his friend Jason Lengstorf (host of the YouTube show “Learn with Jason”) put together. 

Next up is more drama around how AI companies are training their LLMs. Up and coming AI company Perplexity’s getting some heat for ignoring the robots.txt files on websites banning AI companies from crawling the content to teach their models.

After that, TypeScript 5.5, previously in beta stage (in episode 42), has now reached release candidate stage. It brings with it inferred type predicates, regex syntax checking, and 33% smaller package size.

News:

• Paige - TypeScript 5.5 RC
• Jack - Don’t build another effin’ chatbot - Web Dev Challenge S1E1 (Learn with Jason)
• TJ - Perplexity and robots.txt drama and Apple is the first company charged with violating the EU’s DMA rules

Bonus news:

• window.ai

What Makes Us Happy this Week:

• Paige - The Hunting Party book
• Jack - Bridgerton on Netflix
• TJ - The Paris Apartment

Thanks as always to our sponsor, the Blue Collar Coder channel on YouTube. You can join us in our Discord channel, explore our website and reach us via email, or Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

Although we’re already halfway through 2024, this week the State of JavaScript survey for 2023 dropped, and the hosts weighed in and discussed the results they found most interesting.

This year the survey provided a lot more write in options instead of predefined lists, which made extrapolating clear answers in many cases more difficult than it otherwise would have been, but there were still some clear winners in terms of usage and popularity among respondents. React and Next.js continued to dominate in the framework wars, Vite was beloved by most everyone, and the new category of AI tools was dominated by ChatGPT. There’s lots of interesting data here to peruse, but also some questions about the accuracy of results with having to normalize so many written responses.  

Another topic of discussion was the new release of htmx 2.0. It’s dropping support for Internet Explorer,  breaking out all the previously built-in extensions from the main project, and (most exciting of all) now offers a dark-mode version of the website.

We get an update on the React Suspense drama that began last week when the React team fundamentally wanted to change how Suspense is handled in React 19, and many library maintainers who rely on Suspense under the hood voiced concerns that it would severely impact how their libraries work. The React team has since backed off changing Suspense, and agreed to find a solution that works better for everyone, and we’ll update you on what that solution might be as soon as we know more.

And finally, Adobe continues to make headlines this year as the US Federal Trade Commission sues it over confusing and hard-to-cancel subscription plans. For a company as big and successful as Adobe, the fact that it uses confusing and obfuscated terms and conditions to penalize users who try to cancel subscriptions is shameful, and the US FTC is taking a stand against it. 

News:

• Paige - htmx 2.0 is released
• Jack - State of JS 2023 results are in
• TJ - The US FTC sues Adobe (Full complaint) 

Bonus news:

• The React team reverses course on proposed Suspense changes and Tkdodo’s summary of the Suspense drama
• Blue Collar Coder video on React Suspense

What Makes Us Happy this Week:

• Paige - Three Body Problem novel
• Jack - Cascadia JS conference
• TJ - Yellow Altra running shoes

Thanks as always to our sponsor, the Blue Collar Coder channel on YouTube. You can join us in our Discord channel, explore our website and reach us via email, or Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

Today’s episode covers a slew of hot topics making headlines in the web development and general technology world.

TJ kicks off the show with his firsthand experience of GitHub Copilot Workspace (available to users by invite only). He tested Copilot Workspace with a relatively simple issue in one of his repos, and while the plan Copilot came up with seemed sound, the implementation didn’t end up working. It took Copilot several minutes each time he asked it to try and code a working solution again too, which wasn’t the best experience. While it’s still extremely early days for Copilot Workspace, it still has a ways to go before it will replace developers at this rate.

The next topic is around a talk at Google I/O: the latest in web UI. In the talk, Google DevRel Lead, Una Kravets, highlights some of the best new features out like native scroll driven animations and view transitions, the introduction of the popover API and anchor positioning in CSS, and CSS container queries and nesting and layout, typography, and color improvements. Her talk is accompanied by slick visual demos and is definitely worth a watch.

Next up is some new drama in the React world: the React team is solidly considering fundamentally changing the way Suspense works in React 19, and the general React public is not happy about it. Hopefully their concerns are heard before it gets finalized.

And there’s a bit of bonus news as well: Apple’s annual Worldwide Developers Conference (WWDC) unveiled “Apple Intelligence”, Apple’s answer to AI, which will include Siri interfacing with Chat GPT 4o when it doesn’t know the answer, custom, AI-generated emojis, and the new Safari 18 beta version. Jack also recommends a cool CSS browser extension called Design GUI for managing colors in CSS variables.

News:

• Paige - The latest in Web UI (Google I/O ‘24) talk
• Jack - React Suspense drama in React 19
• TJ - GitHub Copilot Workspace

Bonus news:

• Safari 18 Beta is out
• Apple unveils Apple Intelligence its answer to AI
• Design GUI CSS browser extension

What Makes Us Happy this Week:

• Paige - Substack newsletters
• Jack - Godzilla x Kong: The New Empire movie 
• TJ - A Brief History of Intelligence book

Thanks as always to our sponsor, the Blue Collar Coder channel on YouTube. You can join us in our Discord channel, explore our website and reach us via email, or Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

Vanilla JS author Chris Ferdinandi joins the podcast this week to talk about how having ADHD has affected his career in web development.

Chris shares his own diagnosis of ADHD as a child, then proceeds to discuss how it can be both a positive and a negative depending on the situation and how different individuals can have ADHD to varying degrees. 

He covers strategies he’s developed over the years to be most effective at his job; things like sending follow up emails after meetings with lists of deliverables or blocking off chunks of time on the calendar during the workday for focus work like coding. And he also makes recommendations for coworkers or managers of neurodivergent folks on how to support them so they can do their best work. Finally, he offers advice for listeners who may relate to many of the symptoms described during the show, and what they can do if they want to learn more about getting diagnosed.

It’s a very enlightening episode, and fascinating to hear about the progress being made in the field of ADHD as well as the growing destigmatization around the diagnosis: many listeners may even pick up tips to help them manage their own work days better after listening in.

Special Guest(s):

• Chris Ferdinandi, author of the Vanilla JS series, training program, and podcast, and web development teacher, content creator, and consultant. 

Main Topic:

• The challenges and advantages of being a web developer with ADHD

Relevant Links:

• Chris on Twitter @ChrisFerdinandi
• Chris’s website Go Make Things
• Chris’s other website ADHD ftw!
• Chris on GitHub

What Makes Us Happy this Week:

• Paige - The Paris Apartment novel
• Jack - Staying above the Tech Twitter drama
• TJ - AI tools to help writing like ChatGPT
• Chris - Gardening and web components

Thanks as always to our sponsor, the Blue Collar Coder channel on YouTube. You can join us in our Discord channel, explore our website and reach us via email, or Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

This is a rapid fire episode of news topics today because (as always) there’s plenty going on in the front-end development world.

Evan You, the creator of the popular Vue.js framework and Vite build tool, is back with a new static site generator named VitePress. VitePress allows users to build fast, content-centric websites with Markdown, a fully customizable theme, and Vue-enhancements for greater interactivity, and it will generate static HTML pages that can be deployed anywhere.

There’s also two new component library frameworks taking a page from the shadcn/ui open source component library: JollyUI and Ark UI. JollyUI provides shadcn/ui compatible, react aria components that you can copy and paste into your apps. They’re accessible, customizable, open source, and look darn good at first glance. Ark UI takes a slightly different approach billing itself as a headless library for building reusable, scalable design systems that work for a wide range of JS frameworks.

And the Angular team is back at it again with the twice a year release of a new major version of Angular. We’re up to v18 now, and Angular is encouraging users to move away from zone.js for change detection. It’s been a staple of Angular for years, but the library came with a number of developer experience and performance downsides and so the Angular team’s been hard at work building new APIs that don’t rely on zone.js and they’re ready for devs to try them out.

In bonus news, Google now offers its Gemini AI in Chrome DevTools to help developers better understand the errors and warnings that pop up in the console, Kyle Shevlin shares a very well written design system retrospective based off his own experiences building cross platform design systems for clients and dev teams, and IBM watsonx brings its own Code Assistant AI tool to the table. A unique twist with Code Assistant is that it offers not only code generation, but also code modernization (i.e. refactoring legacy code or translating code from one language to another).

News:

• Paige - VitePress SSG framework
• Jack - Ark UI 3.0 and JollyUI react aria compatible components
• TJ - Angular 18 is now available

Bonus news:

• Google Gemini AI in Chrome DevTools
• Design System Retrospective article by Kyle Shevlin
• IBM watsonx Code Assistant

What Makes Us Happy this Week:

• Paige - BUBM double layer cable travel bag
• Jack - Creo Chocolate tour
• TJ - Sharp Tech podcast

Thanks as always to our sponsor, the Blue Collar Coder channel on YouTube. You can join us in our Discord channel, explore our website and reach us via email, or Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

Conference season is in full swing this week Vercel showed off the new goods they’ve got for developers to get excited about.

During Vercel Ship, the Next.js 15 RC (release candidate) was officially announced. Next.js 15 includes benefits like: support for React 19 and the React Compiler (Experimental), plus hydration error improvements. It also offers experimental support for partial pre-rendering, a new API to execute code after a response has finished streaming, and new config options for the App and Pages Router. But the biggest thing to note in this release is the change to caching: in Next 15, fetch requests, GET route handlers, and client navigation are no longer cached by default (a confusing default in Next.js, which caused a lot of confusion for devs why they were seeing the new data in local dev, but not in prod). Next has reversed course on this aggressive caching, and now requires teams that need it to opt in instead of having to opt out.

Not to be outdone, Google search rolled out AI overviews to all Chrome users with its latest browser update. While initial reviews of the AI’s accuracy and truthfulness are mixed, it’s a strong indicator that the AI hype train continues to go strong, and every major tech company must have an AI offering to compete. What’s less clear is how Google will monetize this offering, how SEO and website traffic will fare now that users may never need to leave the Google search engine to get the answers they seek, and if this will cause a decline in the amount of time and energy people put into writing articles and posting useful information if no one besides the LLM training models will consume it. It’s a brave new world we’re facing, and it will be interesting to see who survives and how it continues to evolve.

Last but not least, the team behind the popular JavaScript framework Solid.js debuts the meta framework SolidStart 1.0. The thinking behind SolidStart is that it integrates multiple separate packages to provide complete functionality, but each of these pieces can be replaced with a user’s own custom implementation if desired. Out of the box, SolidStart is built on Vinxi (a Vite + Nitro-based bundler and runtime), the Seroval serializer, and the Solid Router. It offers all the things we’ve come to expect from a good meta framework: file-based routing, streaming, server functions and actions, data pre-loading, API routes, and more, and it can be deployed on every platform that has a Nitro preset (25+ platforms and counting).

The Solid team has been good at reading the room: pioneering signals in 2019 and adding server functions in 2022, so there’s a good chance they’ll continue to make smart bets going forward, and we wish SolidStart the best of luck.

News:

• Paige - SolidStart 1.0
• Jack - Next.js 15
• TJ - Google search’s AI overview

What Makes Us Happy this Week:

• Paige - Relax Meditation mobile app
• Jack - Fourth Wing book
• TJ - Apple Vision Pro

Thanks as always to our sponsor, the Blue Collar Coder channel on YouTube. You can join us in our Discord channel, explore our website and reach us via email, or Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet