Skip to content

This is a lightweight and user-friendly CSS library, offering pre-designed styles for typography, buttons, forms, and etc. With a mobile-first approach, it simplifies web development, ensuring responsive and visually appealing designs.

PrateekSrivastava1/nahi-aati-css

Repository files navigation

nahi-aati-css

nahi-aati-css is a lightweight and user-friendly CSS library, offering pre-designed styles for typography, buttons, forms, and etc. With a mobile-first approach, it simplifies web development, ensuring responsive and visually appealing designs.

Contributing

Contributions are always welcome!

See CONTRIBUTING.md for ways to get started.

Please adhere to this project's CODE_OF_CONDUCT.md.

Installation

Install nahi-aati-css with npm

  npm install @prateeksrivastava1/nahi-aati-css --registry=https://npm.pkg.github.com/PrateekSrivastava1

License

MIT License

Want to play with some UI Components? just click on the link given below : D

nahi-aati-css

Screenshot 2023-08-12 at 8 22 30 PM

Run Locally

Clone the project

  git clone https://github.com/PrateekSrivastava1/nahi-aati-css

Go to the project directory

  cd nahi-aati-css

Install dependencies

  yarn install

Start Storybook

  yarn storybook

Tech Stack

Client: React, Typescript, Styled Component, Storybook, Jest, Node.

Running Tests

To run tests, run the following command

  npm run test

Usage/Examples

import { Button } from '@prateeksrivastava1/nahi-aati-css';

function App() {
  return <Button />;
}

Automated Deployment - The Coolest Feature of This Project! 🚀

Let's talk about what makes this project truly stand out - the seamless and automated deployment process!

Gone are the days of manually running a barrage of commands like npm install, npm build, and npm deploy. With this UI Component Library, I've implemented an efficient CI/CD pipeline using GitHub Actions that takes care of everything for us! 🛠️

Here's how it works:

Making Changes: Whenever I make any updates or enhancements to the library, I simply commit and push those changes to the main branch. No need to worry about the deployment process anymore!

Automated Testing: GitHub CI/CD springs into action automatically, running a suite of tests to ensure that everything is in perfect working order. Any issues or errors are caught early in the process, saving valuable time and effort.

Hassle-free Build: After the tests pass, the CI/CD pipeline proceeds to build the library, generating the optimized production-ready code.

Smooth Deployment: Once the build is complete, the deployment process takes over. The library is published as a GitHub Package, making it easily accessible for developers worldwide.

Storybook Automation: But that's not all! The automation magic extends to Storybook as well. Any changes made to the Storybook configuration are automatically deployed to GitHub Pages, creating a dynamic playground for developers to experiment with the components.

This automated deployment process ensures that the library is always up-to-date and readily available to the developer community. Say goodbye to manual deployment headaches and hello to seamless, efficient, and hassle-free updates!

Automated Deployment Screenshot

Failed because of same version, We always need to update the library version: Screenshot 2023-08-12 at 8 25 06 PM

Successfull deployment for Library (package) Screenshot 2023-08-12 at 8 25 32 PM

Successfull deployment for Storybook Screenshot 2023-08-12 at 8 27 05 PM

About

This is a lightweight and user-friendly CSS library, offering pre-designed styles for typography, buttons, forms, and etc. With a mobile-first approach, it simplifies web development, ensuring responsive and visually appealing designs.

Topics

Resources

Code of conduct

Stars

Watchers

Forks

Releases

No releases published