Installation Guide

Step 1: Create a React App

Open your terminal and run the following command to create a new React app:

npx create-react-app my-app

Step 2: Navigate to Your Project Directory

After creating your project, navigate to your project directory:

cd my-app

Step 3: Install the Package

Run the following command in your project root to add the library as a dependency.

npm install zure-ui

Step 4: Start Building

You can now import any component directly into your React files.

import { Button } from 'zure-ui';
 
function App() {
  return <Button>Hello From Saurav Zure</Button>;
}

Step 1: Create a Components Directory

Ensure you have a dedicated folder for UI components (e.g., src/components/ui).

Step 2: Create the Component Folder

For each component you want to use, create a new folder named after the component.

• src
  • components
    • Button

Step 3: Add the Three Core Files

Inside that new folder, create these three files and paste the code provided in the component’s documentation:

1. Button.jsx (The Logic)
2. button.module.css (The Styles)
3. index.js (The Export)

Step 4: Configure the Export

Inside your index.js, ensure you have the following line so the component is easily accessible:

export { default as Button } from './Button';

Step 5: Local Usage

Import the component using your local path:

import { Button } from './components/Button';