DEV Community

How to install react-grid-Layout ?

ddubois2 on November 14, 2020

Hello and thank you in advance for your help. I'm a reactjs beginner. I would like to use this reactjs tool : https://github.com/STRML/react-gr...
Read full post
Collapse
 
ekeijl profile image
Edwin •

It really depends on what you want to do.

You cloned the source code of that project, which you only want to do if you want to develop the source code of react-grid-layout yourself.

The thing you are looking for is how to use react-grid-layout in your own react application. So if you have not already done that, you should create a new react app on your local machine, the simplest one to get started is the project called "create-react-app".

So to create a new React app:

npx create-react-app my-app
cd my-app
Enter fullscreen mode Exit fullscreen mode

Here it created all the files to get you started. You now want to install the react-grid-layout package from NPM to add it to your new app and then start your app:

npm install react-grid-layout
npm start
Enter fullscreen mode Exit fullscreen mode

Now you need to create a component to use the react-grid-layout, follow the instructions at the usage section.

When you are finished developing, you create a production version of your React app using:

npm run build
Enter fullscreen mode Exit fullscreen mode

You can then deploy the files in the /build directory on your server.

Collapse
 
ddubois2 profile image
ddubois2 •

Hello Edwin,

Thank you very much for your reply, that's clear.

Enjoy your sunday.