YAMLException: end of the stream or a document separator is expected at line 13, column 20: 3. and add scripts : ^

---

title: Set up concurrently for ReactJS and backend
tags: Web Dev

Set up concurrently for ReactJS and backend

1. Root folder should install concurrently and nodemon in devDependencies

   ​​​​​​​ npm install --save-dev nodemon concurrently
   

2. Run in root folder termial npx create-react-app client (creat your frontend react app)

3. and add scripts :

   ​​​​​​​ {
   ​​​​​​​     ”client” : ”npm start  -prefix client”,
   ​​​​​​​     “dev” : ”concurrently \”npm run server\” \”npm run client\””
   ​​​​​​​ }
   

   (If your frontend folder name is [client] )

   Copy:

   ​​​​​​​ "scripts": {
   ​​​​​​​     "start": "node server",
   ​​​​​​​     "server": "nodemon server",
   ​​​​​​​     "client": "npm start -prefix client",
   ​​​​​​​     "dev": "concurrently \"npm run server\" \"npm run client\""
   ​​​​​​​   },
   

   In package, json (root folder’s)

4. testing( npm run dev ) In root folder, it should be work

5. delete “READEME.md” and “.gitignore”

6. in client folder, terminal “rm -rf .git”

   // Do or not do up to you (Just convient for dev to request,axios, cut some string)

7. In client folder “pakage.json” add

   (If backend port number is [5000] )

   ​​​​​​​ “proxy” : “http://localhost:5000”
   ​​​​​​​          “http://127.0.0.1:5000”  (same)	
   

   Copy:

   ​​​​​​​   "proxy":"http://localhost:5000”,
   

   or

   ​​​​​​​   "proxy": "http://127.0.0.1:5000",
   

for setting pop browser, I already set environment variable to Microsoft edge, so no need to add.
( // "start": "BROWSER='Microsoft Edge' react-scripts start",
)

---

• Reference: https://stackoverflow.com/questions/51706882/create-react-app-how-do-i-npm-start-with-a-specific-browser