FIX: error when trying to start the application locally

README.md

@@ -1,56 +1,64 @@
 # DHGWorkflow
+
 DHGWorkflow is a visual Directed Hypergraph Workflow Composer.
 
 # Developers
+
 For developers, this tool can be more than just a DHGWorkflow Editor. We aim at building an open-source generic simple graph builder which can be used for various applications that require some kind of building graphs by a user. It can easily be integrated with any web application and can even be customised to add custom logics.
 
-DHGWorkflow is built by adding custom logic over this Generic Graph Builder. 
+DHGWorkflow is built by adding custom logic over this Generic Graph Builder.
 
 Key Features of this graph builder:
-* Export-import graph as a graphml file.
-* Export graph as JPEG/PNG
-* Undo-Redo Actions
-* Drag Drop Nodes
-* Create Edges easily
-* Bend Edges
-* Resize and customise nodes and edges.  
 
-and many more!
+- Export-import graph as a graphml file.
+- Export graph as JPEG/PNG
+- Undo-Redo Actions
+- Drag Drop Nodes
+- Create Edges easily
+- Bend Edges
+- Resize and customise nodes and edges.
 
+and many more!
 
 ## Installing it locally
+
 This is a frontend tool built with React Js.
 Steps to start it locally
+
 1. Clone the repository
 2. At the root of the repository, run the following commands:
-    1. `npm i`
-    2. `npm start`
+   1. `npm i`
+   2. `npm start` if you're on Linux or macOS, use `npm run start:windows` if you're on windows
 3. It should a development server and tool will be accessible at
-    `http://localhost:3000/DHGWorkflow`
+   `http://localhost:3000/DHGWorkflow`
 
 ## Creating a generic Graph Builder.
 
 The generic graph can be built out of two ways.
 
 ### 1. Check out the Generic branch
+
 This branch will be synced with the changes from the main periodically. Easy to switch but do not guarantee up to date changes.
+
 1. `git checkout generic`
 2. `npm i`
 3. `npm start`
 
 This branch may contain `src/graph-builder/tailored-graph-builder.js`. It can be safely removed.
 
 ### 2. Make changes to the master branch
+
 You can convert the existing graph builder to generic by following these simple steps
 
-1. At `src/graph-builder/index.js` replace   
-`import GraphBuilder from './tailored-graph-builder';` with  
-`import GraphBuilder from './graph-core';`
+1. At `src/graph-builder/index.js` replace  
+   `import GraphBuilder from './tailored-graph-builder';` with  
+   `import GraphBuilder from './graph-core';`
 2. Delete `src/graph-builder/tailored-graph-builder.js` (Optional)
 
 This method is more error-prone.
 
 ### How it works?
+
 This project requires building a graph with some special kind of hyperedges.  
 `src/graph-builder/graph-core/*` contains all the classes required for building a generic GraphBuilder (with simple edges) and `src/graph-builder/tailored-graph-builder.js` extends the core graph and add logics to create hyperedges.
 
@@ -67,9 +75,9 @@ For "Source," select "Deploy from a branch."
 For "Branch," select "gh-pages" and "/root."
 
 Save.
- 
+
 It should say,
 
- Your site is live at https://YOUR-FORK.github.io/DHGWorkflow/ 
- 
- Now, you should be able to use DHGWorkflow from https://YOUR-FORK.github.io/DHGWorkflow/
+Your site is live at https://YOUR-FORK.github.io/DHGWorkflow/
+
+Now, you should be able to use DHGWorkflow from https://YOUR-FORK.github.io/DHGWorkflow/

package.json

@@ -24,7 +24,7 @@
     "react-dom": "^17.0.2",
     "react-icons": "^4.2.0",
     "react-modal": "^3.13.1",
-    "react-scripts": "4.0.3",
+    "react-scripts": "^4.0.3",
     "react-toastify": "^8.1.0",
     "react-tooltip": "^4.2.21",
     "web-vitals": "^0.2.4",
@@ -44,7 +44,8 @@
     "zealit": "^2.4.1"
   },
   "scripts": {
-    "start": "react-scripts start",
+    "start": "export NODE_OPTIONS=--openssl-legacy-provider && react-scripts start",
+    "start:windows": "set NODE_OPTIONS=--openssl-legacy-provider && react-scripts start",
     "build": "react-scripts build",
     "build-localhost": "PUBLIC_URL=/ react-scripts build",
     "test": "react-scripts test",