diff --git a/package-lock.json b/package-lock.json
index 6455989aea..6586fb3ac6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -30,7 +30,6 @@
         "@rollup/plugin-terser": "^0.4.4",
         "autoprefixer": "^10.4.21",
         "browser-sync": "3.0.3",
-        "connect": "^3.7.0",
         "cross-env": "^7.0.3",
         "editorconfig-checker": "^6.0.1",
         "eslint": "^8.57.0",
@@ -70,7 +69,6 @@
         "puppeteer": "^24.6.0",
         "rollup": "^4.38.0",
         "sass-export": "^2.1.2",
-        "serve-static": "^1.16.2",
         "sitemap": "^8.0.0",
         "slash": "^3.0.0",
         "slug": "^9.1.0",
@@ -6278,21 +6276,6 @@
         "proto-list": "~1.2.1"
       }
     },
-    "node_modules/connect": {
-      "version": "3.7.0",
-      "resolved": "https://registry.npmjs.org/connect/-/connect-3.7.0.tgz",
-      "integrity": "sha512-ZqRXc+tZukToSNmh5C2iWMSoV3X1YUcPbqEM4DkEG5tNQXrQUZCNVGGv3IuicnkMtPfGf3Xtp8WCXs295iQ1pQ==",
-      "dev": true,
-      "dependencies": {
-        "debug": "2.6.9",
-        "finalhandler": "1.1.2",
-        "parseurl": "~1.3.3",
-        "utils-merge": "1.0.1"
-      },
-      "engines": {
-        "node": ">= 0.10.0"
-      }
-    },
     "node_modules/connect-history-api-fallback": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz",
@@ -8765,24 +8748,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/finalhandler": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.2.tgz",
-      "integrity": "sha512-aAWcW57uxVNrQZqFXjITpW3sIUQmHGG3qSb9mUah9MgMC4NeWhNOlNjXEYq3HjRAvL6arUviZGGJsBg6z0zsWA==",
-      "dev": true,
-      "dependencies": {
-        "debug": "2.6.9",
-        "encodeurl": "~1.0.2",
-        "escape-html": "~1.0.3",
-        "on-finished": "~2.3.0",
-        "parseurl": "~1.3.3",
-        "statuses": "~1.5.0",
-        "unpipe": "~1.0.0"
-      },
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
     "node_modules/find-file-up": {
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/find-file-up/-/find-file-up-0.1.3.tgz",
diff --git a/package.json b/package.json
index 308f9b7221..f0bdba83f6 100644
--- a/package.json
+++ b/package.json
@@ -56,7 +56,6 @@
     "@rollup/plugin-terser": "^0.4.4",
     "autoprefixer": "^10.4.21",
     "browser-sync": "3.0.3",
-    "connect": "^3.7.0",
     "cross-env": "^7.0.3",
     "editorconfig-checker": "^6.0.1",
     "eslint": "^8.57.0",
@@ -96,7 +95,6 @@
     "puppeteer": "^24.6.0",
     "rollup": "^4.38.0",
     "sass-export": "^2.1.2",
-    "serve-static": "^1.16.2",
     "sitemap": "^8.0.0",
     "slash": "^3.0.0",
     "slug": "^9.1.0",
diff --git a/tasks/serve.js b/tasks/serve.js
index 8085d5f1f4..4330f9fca1 100644
--- a/tasks/serve.js
+++ b/tasks/serve.js
@@ -1,14 +1,31 @@
-const { createServer } = require('http')
-
-const connect = require('connect')
-const serveStatic = require('serve-static')
+const browserSync = require('browser-sync').create()
 
 const { paths, ports } = require('../config')
 
-// Create a simple server for serving static files
-const app = connect().use(serveStatic(paths.public))
-const server = createServer(app)
+browserSync.init(
+  {
+    // Prevent browser mirroring
+    ghostMode: false,
+
+    // Prevent browser opening
+    open: false,
+
+    // Disable BrowserStack UI
+    ui: false,
+
+    // Configure port
+    port: ports.preview,
 
-server.listen(ports.preview, () => {
-  console.log(`Server started at http://localhost:${ports.preview}`)
-})
+    // Serve files from directory
+    server: paths.public
+  },
+  (err, bs) => {
+    if (err) {
+      console.error('Encountered an error starting the local server:', err)
+    } else {
+      console.log(
+        `Server started at http://localhost:${bs.options.get('port')}`
+      )
+    }
+  }
+)