Skip to content

XigmaDev/ReactDashboard

Repository files navigation

React Single Page Project with Material Tailwind CSS and ApexCharts

This project showcases a single-page application built with React, Material Tailwind CSS, and ApexCharts. It fetches random data from a REST API and visualizes it using ApexCharts.

build NPM Code Size License

Table of Contents

Features

  • Single Page Application: A minimalistic single-page application using React.
  • Material Tailwind CSS: Styled using Material Tailwind CSS for a modern and responsive design.
  • REST API (Fetch): Utilizes the Fetch API to fetch random data from a RESTful endpoint.
  • ApexCharts: Integrates ApexCharts to visualize the fetched data.

Getting Started

Prerequisites

Make sure you have the following installed on your machine:

Installation

  1. Clone the repository:

    git clone https://github.com/aliaskarii/admin-dashboard.git
    
  2. Navigate to the project directory::

    cd admin-dashboard
    
  3. Install dependencies::

    npm install
    

Usage

  1. Run the development server:
    npm start
    
  2. Open your browser and visit http://localhost:3000.

Technologies Used

React: A JavaScript library for building user interfaces.
Material Tailwind CSS: A utility-first CSS framework combined with Material Design.
ApexCharts: A modern JavaScript charting library to visualize data.
REST API (Fetch): Fetches random data from a RESTful endpoint.

Contributing

If you'd like to contribute, please follow these steps:

Fork the repository.
Create a new branch (git checkout -b feature/new-feature).
Commit your changes (git commit -m 'Add new feature').
Push to the branch (git push origin feature/new-feature).
Open a pull request.

License

This project is licensed under the MIT License.

Customize this template according to your project's specific details. Ensure you replace placeholders like `aliaskarii` and `admin-dashboard` with your actual GitHub username and project name. Feel free to add more sections or details as needed. If you have further questions or need additional assistance, let me know!