React-resizable-grid

Contents

1. Overview
2. Features
3. Setup
4. Screens

Overview

---

• This Web App is made for the purpose of Precily AI web development assessment. Link deployed here.
• Tech stack used : React, NodeJS, MongoDB,
• Server is deployed on Heroku and Database on MongoDb Atlas

FEATURES

• Resizable components.
• Number of times component updated visible.
• Modular approach for coding.
• Code is easy to understand without any complexity.

Setup

---

Before proceeding please download and install NodeJS and MongoDB because it is required.

1. Download/Clone the Repository

2. Navigate into the Repository folder on your disk using Terminal

3. Make sure that you have the Node and MongoDB installed

4. Run the following command to run the setup,npm install

5. Go to server(NodeJs) folder

6. Create .env file for environment setup

   MONGODB_URL = mongodb://localhost:27017/gridDB
   

Now everything required should be installed, go ahead and run the following command whenever you want to run the app, node server.js

The Server would now be Up and Running on localhost:9000

Now run npm install on root folder(react app too) , go ahead and run the following command whenever you want to run the app, npm start

The React app would now be Up and Running on localhost:3000

Screens

---

Landing Page,

####Resize Grid

Edit Grid