Thank you for visiting the @kaustubhdevstack/stackui repository! If you find this repository helpful or useful, we encourage you to start it on GitHub. Starring a repository is a way to show your support for the project. It also helps to increase the visibility of the project and to let the community know that it is valuable. Thanks again for your support and we hope you find the repository useful!
Stack U - Freeform Open UI Library
Stack UI provides various Reusable and modifyable Freeform style components specially created for you to craft user interfaces with ease. If you hate installing various dependencies for your project and just want to modify components according to your needs then Stack UI is for you!
In other words, It is a Freeform UI Library that doesn't require any installation or documentation to use. Essentially, it simplifies the process of crafting user interfaces by allowing you to easily copy and paste necessary UI components. This ultimately results in a highly refined and optimized user interface that appears sleek and clean.
Developers can selectively choose the necessary components for their projects, enabling them to create a customized front-end stack tailored to each project's requirements. This approach grants developers complete control over the UI components, allowing them to modify them as needed.
While front-end frameworks like Tailwind CSS and Bootstrap 5 are great they come with some level of control that forces you to develop UI within their range. It makes UI Development fast but it sacrifices innovation, today with one look, anyone can tell whether a website is made by Tailwind, Bootstrap, or any other design system. The result - all apps have the same UI look and feel.
With Stack UI I am on a mission to break the chain of Controlled UI Development.
There is a huge gap between coding every UI element from scratch to using the framework to build the UI.
stackui.co is my way of filling that huge gap, I realized that people are using frameworks for 2 reasons:
- To build something fast in order to save time.
- To avoid building every small component from scratch after that they will style it according to their needs.
So instead of prioritizing on point 1 which is - speed of development, I am focusing on point 2 - The freedom to style the UI components. Bootstrap, Bulma CSS, and Materialize CSS do the same thing, however, there is a huge difference between them and Stack UI.
In order for Bootstrap, Bulma CSS, and Materialize CSS to work you need to download their files in your project and if you want to custom style the components or extend the capabilities with javascript or jQuery you need to create custom files and override the default framework files. What's more - If you end up using only 25% of the source the rest of it becomes useless or it becomes bloatware.
Stack UI being a Freeform and open UI platform gives direct access to the code without the need for installation so developers can choose what to include and what not to include creating a pretty optimized version of UI. This has the following benefits:-
- No need to download framework files.
- No need to create custom CSS or JS files to override default framework files.
- No need to study documentation, your knowledge and experience as a developer is enough.
- You have the choice to choose what to include and what not to include avoiding the chance of useless/bloatware code
- Create an optimized front-end stack for every project.
- React JS Components
- Vue JS Components
- Angular Components
- UI Blocks
There are many ways to contribute
- Report errors or raise an issue - Click here to report bug or raise an issue
- Submit your creation or work - Click here to submit your work!
- Raise a Pull request - Click here to raise Pull Request
To add new components follow the instructions:-
- Download the project files
- Make sure you have the latest version of Node JS installed on your computer or machine.
- Open the folder in VSCode
- Open the terminal and then run the following command - npm run dev to get the project running
Note: Right now there are only components made with HTML, CSS, and JS so the following instructions from here will be only for HTML, CSS, and JS Components. The rest of the instructions will be given when React, Vue, and Angular Components are released which is going to be soon.
- Everything inside the Basic folder which is inside the View folder are the components created using HTML, CSS, and JS.
- The CSS File for the components will be inside "public/dist/basic/css/components.css".
- JS Files for the components will be inside "public/dist/basic/js". (There are a total of 3 of them - Button.js, Click.js, Text.js)
- Routes are stored in - "routes/main.js".
I do honestly believe that UI Development resources should be free and Open to everyone, hence I have decided to keep Stack UI Free forever and make it available for everyone as I want to create the world's largest Open UI Resource Library. Hence this project requires a sufficient amount of sponsorship to survive. So if you think our effort is worthy then please consider sponsoring us.
Github link - https://github.com/sponsors/kaustubhdevstack
Patreon link - https://www.patreon.com/StackUI
Depending on the amount, you will receive special perks as well as early access to upcoming new updates as well.
Need to procure server space for launching React JS and Vue JS Components (Currently running this platform on a shared server which is not enough)
- To research and add new features, resources, UI components, and elements to https://stackui.co
- For maintaining the server space to operate the platform (Currently I am running it on Shared Server)
- Creating tutorial videos on how you can utilize Stack UI as a platform in your day-to-day life for developing projects.
- For creating Template + Plugins Library.
- For maintaining the Template + Plugins Library.