Added config file

api/package-lock.json

@@ -10,6 +10,7 @@
       "license": "MIT",
       "dependencies": {
         "cheerio": "^1.0.0-rc.10",
+        "cors": "^2.8.5",
         "express": "^4.17.3",
         "mongodb": "^4.5.0",
         "phantom": "^6.3.0",
@@ -693,6 +694,18 @@
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz",
       "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ=="
     },
+    "node_modules/cors": {
+      "version": "2.8.5",
+      "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
+      "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
+      "dependencies": {
+        "object-assign": "^4",
+        "vary": "^1"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
     "node_modules/crypto-random-string": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-2.0.0.tgz",
@@ -1919,6 +1932,14 @@
         "node": "*"
       }
     },
+    "node_modules/object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/on-finished": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
@@ -3592,6 +3613,15 @@
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz",
       "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ=="
     },
+    "cors": {
+      "version": "2.8.5",
+      "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
+      "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
+      "requires": {
+        "object-assign": "^4",
+        "vary": "^1"
+      }
+    },
     "crypto-random-string": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-2.0.0.tgz",
@@ -4529,6 +4559,11 @@
       "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.9.0.tgz",
       "integrity": "sha512-fexhUFFPTGV8ybAtSIGbV6gOkSv8UtRbDBnAyLQw4QPKkgNlsH2ByPGtMUqdWkos6YCRmAqViwgZrJc/mRDzZQ=="
     },
+    "object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
+    },
     "on-finished": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",

api/package.json

@@ -10,6 +10,7 @@
   "license": "MIT",
   "dependencies": {
     "cheerio": "^1.0.0-rc.10",
+    "cors": "^2.8.5",
     "express": "^4.17.3",
     "mongodb": "^4.5.0",
     "phantom": "^6.3.0",

api/server.js

@@ -4,13 +4,17 @@ const { MongoClient, ObjectId } = require('mongodb');
 const request = require('request');
 const cheerio = require('cheerio');
 const URL = require('url-parse');
+const cors = require('cors');
+const config = require('../src/config.json')
 
-const port = process.env.PORT || 3001;
+const port = config.server.port;
 
-const uri = "mongodb://localhost:27017";
+const uri = config.server.mongodb_full_address;
 
 const client = new MongoClient(uri);
 
+app.use(cors());
+
 app.use(express.json());
 
 app.get('/get', async (req, res) => {

package.json

@@ -34,6 +34,5 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
-  },
-  "proxy": "http://localhost:3001/"
+  }
 }

src/App.js

@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react';
 import './styles/App.css';
 import List from './componets/List';
 import AddModal from './componets/AddModal';
+import config from './config.json';
 
 function App() {
   const [data, setData] = useState([]);
@@ -22,7 +23,8 @@ function App() {
 
   useEffect(() => {
     async function fetchData() {
-      const res = await fetch('/get');
+      const address = config.client.api_address + ":" + config.server.port;
+      const res = await fetch(address + '/get');
       const resJSON = await res.json();
       const Data = resJSON.sort((a, b) => { return b-a });
       setData(Data);

src/componets/AddModal.js

@@ -1,5 +1,6 @@
 import { useState } from 'react';
 import '../styles/Modal.css';
+import config from '../config.json';
 
 const AddModal = ({onExit}) => {
   const [name, setName] = useState('');
@@ -32,7 +33,8 @@ const AddModal = ({onExit}) => {
     }
 
     if(name != '' && isValidHttpUrl(link) && tag != '') {
-      fetch("/post", {
+      const address = config.client.api_address + ":" + config.server.port;
+      fetch(address + "/post", {
         
         // Adding method type
         method: "POST",

src/componets/List.js

@@ -1,8 +1,10 @@
 import '../styles/List.css';
+import config from '../config.json';
 
 const List = ({data}) => {
   function deleteEntity(id) {
-    fetch("/delete", {
+    const address = config.client.api_address + ":" + config.server.port;
+    fetch(address + "/delete", {
     
         // Adding method type
         method: "DELETE",
@@ -12,7 +14,7 @@ const List = ({data}) => {
         
         // Adding headers to the request
         headers: {
-            "Content-type": "application/json; charset=UTF-8"
+            "Content-type": "application/json; charset=UTF-8",
         }
     })
     .then(res => res.text())

src/config.json

@@ -0,0 +1,9 @@
+{
+    "client": {
+        "api_address": "http://localhost"
+    },
+    "server": {
+        "port": 5000,
+        "mongodb_full_address": "mongodb://localhost:27017"
+    }
+}