diff --git a/frontend/.npmrc b/frontend/.npmrc
new file mode 100644
index 0000000000..31dfb027b9
--- /dev/null
+++ b/frontend/.npmrc
@@ -0,0 +1 @@
+registry = 'https://registry.npmjs.org/'
\ No newline at end of file
diff --git a/frontend/README.md b/frontend/README.md
index 14c7799acd..34269bf73a 100644
--- a/frontend/README.md
+++ b/frontend/README.md
@@ -23,7 +23,7 @@ docker-compose up
 ```
 
 ## Without Docker
-Follow the steps below 
+Follow the steps below
 
 1. ```git clone https://github.com/SigNoz/signoz.git && cd signoz/frontend```
 1. change baseURL to ```<test environment URL>``` in file ```src/constants/env.ts```
@@ -31,7 +31,8 @@ Follow the steps below
 1. ```yarn install```
 1. ```yarn dev```
 
-```Note: Please ping us in #contributing channel in our slack community and we will DM you with <test environment URL>``` 
+```Note: Please ping us in #contributing channel in our slack community and we will DM you with <test environment URL>```
+
 # Getting Started with Create React App
 
 This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
diff --git a/frontend/package.json b/frontend/package.json
index bb1b04a08c..3d49b2d4c8 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -143,6 +143,7 @@
 		"less-plugin-npm-import": "^2.1.0",
 		"lint-staged": "10.5.3",
 		"lodash-es": "^4.17.21",
+		"portfinder-sync": "^0.0.2",
 		"prettier": "2.2.1",
 		"react-hot-loader": "^4.13.0",
 		"react-is": "^17.0.1",
diff --git a/frontend/webpack.config.js b/frontend/webpack.config.js
index 6e4a077a47..922dc017ed 100644
--- a/frontend/webpack.config.js
+++ b/frontend/webpack.config.js
@@ -1,6 +1,7 @@
 // shared config (dev and prod)
 const { resolve } = require("path");
 const HtmlWebpackPlugin = require("html-webpack-plugin");
+const portFinderSync = require('portfinder-sync')
 const dotenv = require("dotenv");
 const webpack = require("webpack");
 
@@ -22,7 +23,9 @@ module.exports = {
 		hot: true,
 		liveReload: false,
 		inline: true,
-		port: 3000,
+		// This is being used because if the port 3000 is being used
+		// then it will try to find another open port availble.
+		port: portFinderSync.getPort(3000),
 	},
 	output: {
 		filename: "js/bundle.[chunkhash].min.js",
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index dc73ce9921..5339fea9dd 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -10094,7 +10094,15 @@ polished@^4.1.2:
   dependencies:
     "@babel/runtime" "^7.13.17"
 
-portfinder@^1.0.26:
+portfinder-sync@^0.0.2:
+  version "0.0.2"
+  resolved "https://registry.yarnpkg.com/portfinder-sync/-/portfinder-sync-0.0.2.tgz#6e3409a73a718436de053ac949385350caabd8a2"
+  integrity sha1-bjQJpzpxhDbeBTrJSThTUMqr2KI=
+  dependencies:
+    minimist "^1.2.0"
+    portfinder "^1.0.10"
+
+portfinder@^1.0.10, portfinder@^1.0.26:
   version "1.0.28"
   resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.28.tgz#67c4622852bd5374dd1dd900f779f53462fac778"
   integrity sha512-Se+2isanIcEqf2XMHjyUKskczxbPH7dQnlMjXX6+dybayyHvAf/TCgyMRlzf/B6QDhAEFOGes0pzRo3by4AbMA==