Assisn React Project

A modern React project using Vite, TypeScript, Tailwind CSS, and Storybook. Includes reusable components like DataTable, EditModal, and InputField, with demo pages for Dashboard, Form, and Table.

Demo Videos

You can find demo videos for the main components in the public folder:

• InputField Demo: public/inputField.mp4
• DataTable Demo: public/DataTable.mp4

Getting Started

1. Install dependencies:

   npm install

2. Run the development server:

   npm run dev

3. Open the app: Visit http://localhost:5173 in your browser.

Example Usage

Here is a simple example of using the InputField component:

import InputField from "./src/components/InputField/InputField";

function Demo() {
  return <InputField label="Name" placeholder="Enter your name" />;
}

Storybook

This project uses Storybook for developing and testing UI components in isolation.

• Start Storybook:

  npm run storybook

• View stories:
  • src/components/DataTable/DataTable.stories.tsx
  • src/components/InputField/InputField.stories.tsx

Project Structure

src/
  components/
    DataTable/
    EditModal/
    InputField/
  pages/
    Dashboard/
    Form/
    Table/
  types/
  utils/

License

MIT