diff --git a/README.md b/README.md index 564c898..a0f8dc0 100644 --- a/README.md +++ b/README.md @@ -1,15 +1,77 @@ -# Sorting in the React Pivot Table Component +# Sorting in the React Pivot Table Component -A quick-start React project that helps you to sort field members and values in the React Pivot Table component of Syncfusion. +This sample demonstrates how to **sort field members and values** in the **Syncfusion React Pivot Table (PivotView) component**. It showcases how to enable value sorting and configure field member sorting using the `sortSettings` and `valueSortSettings` properties. -Documentation: https://ej2.syncfusion.com/react/documentation/pivotview/sorting/ +## 📖 Overview -Online examples: https://ej2.syncfusion.com/react/demos/#/bootstrap5/pivot-table/sorting +The **Syncfusion Pivot Table (PivotView)** is a powerful React component used for visualizing and analyzing large amounts of data. This example focuses on sorting capabilities within the Pivot Table, including: -## Project prerequisites +- **Field Member Sorting:** Sorts the row field members (e.g., `ProductID`) in ascending or descending order. +- **Value Sorting:** Sorts values (e.g., `Sold Amount`) based on specific headers using `valueSortSettings`. -Make sure that you have the latest versions of NodeJS and Visual Studio Code in your machine before starting to work on this project. +## 🛠 Prerequisites -### How to run this application? +Before running this project, ensure you have the following installed: -To run this application, you need to clone the `sorting-in-react-pivot-table` repository and then open it in Visual Studio Code. Now, simply install all the necessary react packages into your current project using the `npm install` command and run your project using the `npm start` command. +- [Node.js](https://nodejs.org/) (latest version recommended) +- [Visual Studio Code](https://code.visualstudio.com/) + +## 🚀 Getting Started + +Follow these steps to run the application locally: + +1. **Clone the repository:** + ```bash + git clone https://github.com/SyncfusionExamples/sorting-in-react-pivot-table + ``` + +2. **Navigate to the project folder:** + ```bash + cd sorting-in-react-pivot-table + ``` + +3. **Install dependencies:** + ```bash + npm install + ``` + +4. **Start the development server:** + ```bash + npm start + ``` + +5. Open your browser and go to `http://localhost:3000` to view the Pivot Table in action. + +## 📂 Project Structure + +``` +sorting-in-react-pivot-table/ +├── public/ +│ ├── index.html +│ └── ... +├── src/ +│ ├── App.tsx # Main component with Pivot Table configuration +│ ├── data.js # Sample data used in the Pivot Table +│ ├── App.css # Styling for the component +│ └── ... +├── package.json +├── README.md +└── tsconfig.json +``` + +## 🔗 Resources + +- [Syncfusion React Pivot Table Documentation](https://ej2.syncfusion.com/react/documentation/pivotview/sorting/) +- [Live Demo – Sorting in Pivot Table](https://ej2.syncfusion.com/react/demos/#/bootstrap5/pivot-table/sorting) + +## 💬 Support + +For questions or feedback, visit: + +- [Syncfusion Support Portal](https://support.syncfusion.com) +- [Syncfusion Community Forums](https://www.syncfusion.com/forums) + +## 📜 License + +This project uses Syncfusion components, which require a valid license for production use. +[View Syncfusion License Terms](https://www.syncfusion.com/license/studio/22.2.5/syncfusion_essential_studio_eula.pdf)