Astro v1.0, Tailwind CSS, Radix UI and Sticky Scroll - Frontend News #28

• Astro version 1.0
• Tailwind CSS Templates
• Radix UI v1
• Visual Studio Code’s new feature - Sticky Scroll

Transcription

Astro version 1.0

So let’s jump into the first news which is Astro version 1.0. Astro v1.0 includes a couple of new features and improvements:

1. Image Optimization: New Image / and Picture / components.
2. MDX Support: A standard syntax for mixing UI components in Markdown.
3. SSR Builds: Server output is currently stable and open for production use.
4. Vite 3.0: An upgrade to the Vite internal build engine.

What is more, Astro is no longer just a static-site builder. You can now build Astro to a dynamic, SSR-ready server on any popular hosting platform. Additionally, the Astro ecosystem has exploded into 100+ integrations and keeps growing drastically.

Tailwind CSS Templates

 And now jumping to the next news which is - Tailwind CSS Templates. A few days ago tailwind team added a new feature, which is the Modern website templates, crafted with Tailwind CSS

What is it all about? 

Built with modern technologies

Each template is a well-structured Next.js project with a pleasant-to-use codebase for users. 

Easy to customize

Everything is styled with utility classes, just open the markup in your editor so Tailwind lets you change and fill whatever you want.

Built by experts

All of the code follows Tailwind CSS best practices because it’s written by the same dev team which used to create the Tailwind CSS network.

Radix UI v1

Radix UI is a React UI library with unstyled components. You can now write your styles very easily, without having to overload the default CSS.

What's cool about Radix UI is that all components are accessible. You can leave focus management, keyboard control or screen reader support (that is, things you never have time for) to this library.

What's worth mentioning about that?

• Radix UI currently offers 26 components,
• Support for SSR in React 18,
• You can install individual components separately to save the size of the bundle,
• Support for CSS-in-JS (e.g. styled components, emotion, stitches...) together with animation libraries and other

Visual Studio Code’s new feature - Sticky Scroll

This new feature helps software engineers with excessive scrolling. That's an energy-saving game changer. ;D

We are talking about Sticky Scroll, the new feature with which you will never again get lost in the code, it makes life easier. Visual Studio Code introduced the Sticky Scroll tools in July. This feature shows UI with the scope the user is currently scrolling.