adel-gu / react-practice-components

Headless reusable and customized accordion component built with focus on practicing compound component pattern.

📗 Table of Contents

• 📖 About the Project
  • 🛠 Built With
    • Tech Stack
    • Key Features
• 💻 Getting Started
  • Setup
  • Install
  • Usage
• 🔭 Future Features
• ⭐️ Show your support

📖 Reusable Accordion component

Practicing compound component patterns by building a react reusable accordion component. The accordion is a headless component you can add your own CSS style or tailwind CSS.

🛠 Built With

Tech Stack

Client

• React.js
• TypeScript
• TailwindCSS

💻 Getting Started

To get a local copy up and running, follow these steps.

Setup

Clone this repository to your desired folder:

Example commands:

  cd my-folder
  git clone [e-mail]:adel-gu/react-practice-components.git

Install

Install this project with:

Example command:

  cd my-project
  yarn install

OR

  cd my-project
  npm install

Usage

To run the project, execute the following command:

Example command:

  yarn start

🔭 Future Features

• Accordion triggers: Implement an Accordion Trigger that wraps up the close and open buttons

(back to top)

⭐️ Show your support

This project shows how to build a reusable, headless component using react, typescript, and tailwindCSS. So if you like this project please give it a star.

(back to top)