DEV Community

ddubois2
ddubois2

Posted on

How to install react-grid-Layout ?

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-grid-layout

I create a folder in htdocs, I clone the project.

Have I also use npm after the clone ?

I see this, but I'm not able to make something else :

Alt Text

Thank you in advance for your help and sorry for this question

Top comments (2)

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.