React Components

A collection of reusable React UI components built while learning component-based development and modern CSS practices.

Table of Contents

• Components
• Preview
• Features
• Tech Stack
• Project Structure
• Learning Objectives
• Getting Started
• Author

Components

• iPhone Countdown Card
• Product Card
• Payment Card
• Review Card

Preview

Features

• Component-based architecture
• Reusable React components
• Responsive Flexbox layout
• BEM naming convention
• Organized component structure
• Reusable props
• Modern card UI

Tech Stack

• React
• JavaScript (ES6+)
• CSS3
• Vite

Project Structure

src/
├── assets/
├── components/
│   ├── IPhoneCard/
│   ├── ProductCard/
│   ├── PaymentCard/
│   └── ReviewCard/
├── main.jsx
└── index.css

Learning Objectives

This project was created to practice:

• Building reusable React components
• Passing data through props
• Organizing scalable React projects
• Writing maintainable CSS
• Applying the BEM methodology
• Creating reusable UI cards

Getting Started

Clone the repository

git clone https://github.com/hadiashah01/react-components

Install dependencies

npm install

Start the development server

npm run dev

Author

Hadia Shahjahan