{"id":14970948,"url":"https://github.com/khazifire/dripui","last_synced_at":"2025-04-04T08:04:45.896Z","repository":{"id":56708092,"uuid":"523852225","full_name":"khazifire/DripUI","owner":"khazifire","description":"DripUI a collection of free Tailwind CSS components to bootstrap your new apps, projects or landing sites!","archived":false,"fork":false,"pushed_at":"2024-10-29T20:02:07.000Z","size":255,"stargazers_count":69,"open_issues_count":30,"forks_count":83,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-04-04T08:04:40.388Z","etag":null,"topics":["hacktoberfest","hacktoberfest-accepted","hacktoberfest2022","nextjs","tailwind","tailwind-components","tailwind-css","tailwindcss","tailwindcss-components","ui-components"],"latest_commit_sha":null,"homepage":"https://dripui.vercel.app/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/khazifire.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-08-11T19:58:09.000Z","updated_at":"2025-03-13T14:13:16.000Z","dependencies_parsed_at":"2024-08-18T19:06:50.192Z","dependency_job_id":null,"html_url":"https://github.com/khazifire/DripUI","commit_stats":{"total_commits":67,"total_committers":23,"mean_commits":"2.9130434782608696","dds":0.8059701492537313,"last_synced_commit":"4fb7b2ec688f747ef879c360a5a1c44cc5f49e56"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/khazifire%2FDripUI","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/khazifire%2FDripUI/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/khazifire%2FDripUI/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/khazifire%2FDripUI/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/khazifire","download_url":"https://codeload.github.com/khazifire/DripUI/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247142062,"owners_count":20890652,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["hacktoberfest","hacktoberfest-accepted","hacktoberfest2022","nextjs","tailwind","tailwind-components","tailwind-css","tailwindcss","tailwindcss-components","ui-components"],"created_at":"2024-09-24T13:44:24.297Z","updated_at":"2025-04-04T08:04:45.875Z","avatar_url":"https://github.com/khazifire.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# DripUI - Tailwind Components\nDripUI is an amazing collection of free UI components to help you develop projects faster and easier.\n\nThe most elegant code for a component you want, is one click away :)\n\n## :computer: Site Overview\nYou can check out the live site [here](http://dripui.vercel.app/)\n\nTo copy the code for a component, all you need to do is click on it :)\n\n![Screenshot of button components page on dripui](https://user-images.githubusercontent.com/81039882/193884729-cda99fc7-e944-45f7-a24b-2545e0c516f6.png)\n\n\n## :hammer: Tech Stack\nThis project is a product of:\n\n- [Next.js](https://nextjs.org/)\n- [Tailwindcss](https://tailwindcss.com/)\n\n## :bulb: Want to contribute?\nWe would love that! That is what open source is all about :tada: \n\nFound a typo on the site or this README file itself? Feature request? A bug? Feel free to raise an issue and we'll get to it. You can also try to fix the issue once you're assigned to it ;)\n\nTo see and/or contribute to this project, please follow the steps below.\n\n### :point_down: Prerequisites\nBefore installation, please make sure you have already installed the following tools:\n\n- [Nodejs](https://nodejs.org/en/download/package-manager)\n- [npm](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)\n\nTo check if you have nodejs and npm installed, run the commands: \n`node -v` and `npm -v`\n\n### :nut_and_bolt: Installation Steps\n1) Fork this repository\n2) Clone your fork of the repository\n3) In your local dev environment, navigate to the project directory\n4) Run `npm install` to install dependencies\n5) Run `npm run dev` to start the server on `https://localhost:3000`\n\n### :wrench: Adding a component\n- To add say, a new card component to existing card components, navigate to the `/components` folder. \n- Inside the `/components` folder, you'll find the `/drip` folder.\n- Existing component folders will be displayed inside `/drip`\n- To add a new card, open the `/cards` components folder, and add your new component to the existing code\n- Therefore, you would add the new card component code below the already existing ones.\n\n### :wrench: Adding a new type of an already existing component\n- As you can see in the `/cards` folder, we can have different types of files representing different types of cards.\n- To create a new type of card, say colored  shadow cards, you would need to create a new file in the `/cards` folder called `coloredShadowCard.js` \n\n\n#### Note\n\u003e There is a naming convention when naming files. It is [component type] + [type]. `coloredShadowCard.js` mentioned above is a good example. `coloredShadow` = [component type] and `Card` = [type].\n\n- Although we would appreciate contributions that help to expand the set of components we already have, we advise opening an issue where we can discuss if the new type of component you want to add is suitable for the collection.\n\n### :wrench: Adding a new collection of components\nSay you wanted to add a new collection of components. `Testimonials` for example.\n\n- In the `/drip` folder inside `/components`, create a new folder and give it the name of the new collection. That is `/testimonials`\n- Inside the new collection folder, create new files corresponding to the type of testimonial components you want to add. Please refer to the naming convention mentioned [here](#note)\n\n- Before you add a collection, please open an issue to have a brief discussion on how components would be presented.\n\n## License\nThis project adopts the [MIT License](https://opensource.org/licenses/MIT) and is open to all contributions.\n\n## 💪🏽 Thanks to all Contributors\n\nThanks a lot for spending your time helping DripUI grow. Thanks a lot! Keep being awesome🍻\n\n[![Contributors](https://contrib.rocks/image?repo=khazifire/DripUI)](https://github.com/khazifire/DripUI/graphs/contributors)\n\n## 🙏🏽 Support\n\nThis project needs a star️ from you. Don't forget to leave a star✨\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkhazifire%2Fdripui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkhazifire%2Fdripui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkhazifire%2Fdripui/lists"}