Introduction

shuip (ship + ui) is a collection of ready-to-use React components designed to accelerate the development of your Next.js applications. The goal is simple: help you ship your projects faster by eliminating the repetitive work of building user interfaces.

Why shuip?

  • ๐Ÿ—๏ธ Built on shadcn/ui: Constructed on the solid foundation of shadcn/ui
  • ๐Ÿ›ก๏ธ Native TypeScript: Comes with types for a better developer experience
  • ๐ŸŽจ Customizable: Styled with Tailwind CSS, easily adaptable to your design system
  • ๐Ÿ“ฆ Flexible Installation: CLI to install only the components you need
  • ๐Ÿ”ง Ready to Use: Add, copy-paste, tweak, and use immediately
  • ๐ŸŽฏ Concise Code: Clear syntax and less boilerplate

Who is shuip for?

shuip is perfect for:

  • React/Next.js developers looking to speed up their workflow
  • Teams aiming to standardize their UI components
  • Freelancers who need to deliver high-quality projects quickly
  • Anyone already using shadcn/ui and wanting to go further

Philosophy

shuip is built on a philosophy of efficiency and optimization. Eliminate repetitive tasks to focus on what truly matters in your application. As developers, we spend too much time recreating the same UI components project after project โ€” a submit button with loading state, an input field with built-in validation, a confirmation dialog โ€” these elements keep coming back, and implementing them takes valuable time that could be spent on the unique business logic of your app.

This is where the symbiotic relationship between shuip and shadcn/ui comes in. While shadcn/ui excels at providing solid, accessible UI primitives (<Button/>, <Input/>, <Dialog/>), shuip turns these primitives into business-ready components. A <Button/> becomes a <SubmitButton/> with automatic loading state management. An <Input/> combined with form components becomes an <InputField/> with built-in Zod validation and error handling. A <Dialog/> becomes a full-fledged <ConfirmationDialog/> with predefined title, description, and actions.

This approach offers a major advantage: you retain full control. Unlike traditional component libraries that lock you into their ecosystem, shuip copies the code directly into your project. You can modify, adapt, and customize each component to your specific needs without being constrained by an external library. If you need a specific behavior for your <SubmitButton/>, just open the file and make the changes.

shuip integrates naturally into your existing shadcn/ui workflow. You continue using all the shadcn/ui primitives you're familiar with, and progressively add shuip business components as needed. Need a quick form? Install input-field and submit-button. Need user confirmations? Add confirmation-dialog. This granularity keeps your bundle light by only including what you actually need.

The ultimate goal of shuip is to help you ship faster. ๐Ÿš€

Open Source

shuip is 100% open source under the MIT license. You are free to:

  • Use the components in your commercial projects
  • Modify the code as needed
  • Contribute to the project on GitHub
  • Suggest new components