• Coding Beauty
  • Posts
  • This new UI framework is an absolute game changeršŸ˜²

This new UI framework is an absolute game changeršŸ˜²

shadcn/ui completely transforms how we design and build modern web apps.

Want SOC 2 compliance without the Security Theater?

Tired of SOC 2 Security Theater? šŸ¤” 

Oneleet is the all-in-one platform for building a real-world Security Program, getting a Penetration Test, integrating with a 3rd Party Auditor, and providing the Compliance Automation Software.

New puzzle to train your brain and test your coding understandingāœØ

The new shadcn/ui framework completely transforms how we design and build modern web apps.

It solves every major issue weā€™ve had with ALL those UI frameworks: Material UI, Bootstrapā€¦

Project bloat and customization have always been huge pains.

Imagine, you import thousands of lines of CSS code, all just to create a button ā€” that you end up customizing anyway.

When you install these classic libraries, you get every single one of the components dumped into your codebase. Thereā€™s no escape.

ShadCN solves this problem in a radical way.

Zero classes. Zero built-in components.

Itā€™s pureā€¦ copy and paste?

āŒBefore in Material UI and others:

You couldnā€™t see the component code directly and could only customize it with external classes.

The worst part is that the componentā€™s appearance can change completely and break your styles when you upgrade to a new version.

āœ…But now with shadcn/ui:

You have total control over all your component files. You can see everything.

The button code completely belongs to me here. I can make whatever change I want and itā€™ll stay that way.

1. Publish repo to GitHub in literal seconds

Do you remember this?

Itā€™s the old-school way of publishing your code to GitHub. Create a repo, enter name and details, create remotesā€¦

With VS Code you donā€™t need to do this anymore. From the Source Control panel you can now quickly publish any local repo to GitHub in just 2 clicks.

And forget git init: creating the repo is even easier with a single click:

Quickly commit with Ctrl + Enter:

Now easily publish your repo in seconds:

10 fantastic web dev tools to level up your productivity and achieve your coding goals faster than ever.

From colorful styling effects to faster typing, these tools will boost your workflow and make a lot of things easier.

1. React Glow

Create a playful glow that dances with the userā€™s mouse, adding a touch of magic to your interface:

Whenever I see effects like this on a page, it just gives me an aura of sophistication and quality.

2. Vite

Ditch Create React App and make development a breeze with Vite.

Say hello to lightning-fast hot module replacement and built-in TypeScript support.

And absolutely no need to worry about outdated dependencies or vulnerable packages ā€“ unlike with Create React App:

On the other hand, this is what I get for using dinosaur Create React App in one my Electron projects:

Thanks for taking the time to read todayā€™s issue.

Donā€™t let the bugs byte,
The Coding Beauty team