Logo

dev-resources.site

for different kinds of informations.

Forms in seconds with ShardCn forms

Published at
11/11/2024
Categories
react
shadcn
frontend
Author
giuliano1993
Categories
3 categories in total
react
open
shadcn
open
frontend
open
Author
12 person written this
giuliano1993
open
Forms in seconds with ShardCn forms

Good morning everyone and happy MonDEV! β˜•

We are here again ready to start a new week discovering a new tool together!

Last week we had to deviate from the planned content due to some general malaise, but it was supposed to be the turn of a front-end tool, so here we are quickly catching up 😁

How many of you know and use Shadcn? How many of you fell in love with it? I discovered it quite recently and started using it in some personal projects, and I can only say that I really appreciate both the speed of creating components in this way that already have a base, and the customization possibilities that this method brings along.

But I'm not here to talk to you about Shadcn, which you probably already know if you don't live under a rock like myself.

I want to talk to you instead about another tool that leverages Shadcn to speed up the creation of forms in React!

It's called shadcn-form and it's an open-source project by a developer tired of having to revisit the same development logic for forms every time and write them from scratch.
Through a simple WYSIWYG editor, it allows you to select Shadcn components for your form, modify the options, arrange them, and provides you with a real-time preview and the code for the entire component file for this form.

It's really quick and easy to use, and I think I'll use it next time I need to create a form in React.

Of course, it's not perfect; there are some more advanced components that require additional external installation steps to Shadcn (which are still pointed out to you), and in general, some steps could be documented a little better; nothing that some good PRs couldn't fix! Moreover, they have activated a feature request and evaluation system for workflow management and it seems to be in full swing, so despite the small flaws, I think it's a tool to try and keep an eye on for future developments :D

Articles of the week

  • How to Write a Game in Under 13 Kb While Taking Care of a Baby: almost all of us have wondered at some point in our career what it's like to develop a video game. Some did it once, some made a career out of it, some eventually gave up for a thousand valid reasons. This article tells the story of a game for js13kgames, an annual challenge on developing a game with a total weight of less than 13kb. Sounds tough, right? Read this article and maybe you'll get some interesting insights!

  • Laravel VS Symfony: The PHP Framework Showdown: not everyone knows it, but my experience with PHP frameworks is much more linked to Symfony than Laravel. This brief article concisely, quickly, but also pragmatically explains the difference between the two! It's always useful to know which tool is right for the project we are developing ;).

Having said that, that's all, and it's time to leave you to the beginning of this week! I hope you found some interesting insights, as always I look forward to your feedback!

I just have to wish you

Happy Coding 0_1

shadcn Article's
30 articles in total
Favicon
Made FOSS for simplifying NextJS dev with OAuth And Postgres
Favicon
.gitkeep file in Shadcn/ui source code
Favicon
Introducing the Zod Schema Designer: A Visual Tool for Creating and Editing Zod Schemas
Favicon
Handling Local Storage for Toaster Notifications
Favicon
I created a visually pleasing HTML color viewer
Favicon
AISEKA Color Tool Website
Favicon
Color Palette is served with ShadCn Theme Editor
Favicon
Create React project with Vite and set up Tailwind, shadcn/ui
Favicon
Why Developers Love the Shadcn Sidebar Component
Favicon
A comparison of metadata configurations between Lobechat and Shadcn/ui
Favicon
Forms in seconds with ShardCn forms
Favicon
What is the Difference Between Radix UI and ShadCN?
Favicon
How Shadcn CLI uses error constants to improve code readability
Favicon
Exploring the ShadCN UI Library: A Comprehensive Guide
Favicon
10 Essential Shadcn Components Every Developer Should Know About
Favicon
The beginning of my open source journey
Favicon
Install ShadCN and Tailwind in Vite React Project
Favicon
How to add shadcn to existing project
Favicon
How to Use Shadcn UI with a React Project
Favicon
How to Install Shadcn with Next.js 14: A Step-by-Step Guide
Favicon
Shadcn Date Picker with custom implementation
Favicon
How to Fix Shadcn UI Adding Wrong Folder for Components
Favicon
Material UI vs Shadcn
Favicon
Building UIs with Franken UI, a Shadcn alternative
Favicon
Implement ShadCn form with Validation
Favicon
Top 5 Coolest shadcn/ui Extensions
Favicon
Shadcn UI: Must-Have Tools & Resources
Favicon
shadcn-ui/ui codebase analysis: examples route explained.
Favicon
Two ways I discovered to pass dynamic parameters in (arrow and non-arrow) function.
Favicon
Creating a User Nav bar in Next.js 14 using Shadcn UI and TailwindΒ CSS

Featured ones: