feat: .env.local to change backend url

3 files changed, 10 insertions, 4 deletions

diff --git a/modern/.env b/modern/.env
index 6f809cc2..69efd744 100644
--- a/modern/.env
+++ b/modern/.env
@@ -1 +1,2 @@
 SKIP_PREFLIGHT_CHECK=true
+REACT_APP_URL_NAME='localhost:8082'
diff --git a/modern/README.md b/modern/README.md
index 6b8edbb3..c6092df7 100644
--- a/modern/README.md
+++ b/modern/README.md
@@ -4,8 +4,13 @@ It uses [React](https://reactjs.org/), [Material UI](https://material-ui.com/) a
 
 To run the project in development mode:
 
-- Make sure you have Traccar back-end running locally on port 8082
+- Make sure you have Traccar backend running.
 - Install dependencies using `npm install` command
 - Run development server using `npm start` command
 
+To change the backend server URL:
+
+- Copy the content of the .env to .env.local (new file)
+- Change REACT_APP_URL_NAME to your backend URL. Example: 'example.com:8081'
+
 Project was created using [Create React App](https://github.com/facebook/create-react-app). For more information see [user guide](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md).
diff --git a/modern/src/setupProxy.js b/modern/src/setupProxy.js
index 71312d50..c16655c8 100644
--- a/modern/src/setupProxy.js
+++ b/modern/src/setupProxy.js
@@ -1,6 +1,6 @@
 const proxy = require('http-proxy-middleware');
 
-module.exports = function(app) {
-    app.use(proxy('/api/socket', { target: 'ws://localhost:8082', ws: true }));
-    app.use(proxy('/api', { target: 'http://localhost:8082' }));
+module.exports = function (app) {
+    app.use(proxy('/api/socket', { target: 'ws://' + process.env.REACT_APP_URL_NAME, ws: true }));
+    app.use(proxy('/api', { target: 'http://' + process.env.REACT_APP_URL_NAME }));
 };