Getting Started with React UI Components using Next.js

This application demonstrates the usage of the Syncfusion React Diagram component in Next.js. The Syncfusion React Diagram component is a feature-rich library that enables you to create and manipulate diagrams with ease. It supports various types of diagrams including flowcharts, organizational charts, mind maps, and network diagrams.

To know how to configure the Syncfusion React Diagram component in Next.js, refer to the documentation.

Prerequisites

• Node.js 14 or later
• npm or yarn package manager
• Basic knowledge of React and Next.js

Clone the repository

To clone the sample repository locally, follow these steps:

1. Open the command prompt in your desired location
2. Execute the following command:

git clone https://github.com/SyncfusionExamples/ej2-nextjs-diagram.git

Navigate to the project directory:

cd ej2-nextjs-diagram

Installing Packages

Install the required node modules by running the following command:

npm install

This will install all the necessary dependencies including the Syncfusion React Diagram component and its peer dependencies.

Run the application

To run the application in development mode, use the following command:

npm run dev

The application will start on http://localhost:3000. Open this URL in your browser to see the diagram component in action.

Build for Production

To create a production build, run:

npm run build