diff --git a/blog/2023-08-30-magazine-004.md b/blog/2023-08-30-magazine-004.md
index 1d993f097..7ef052c8d 100644
--- a/blog/2023-08-30-magazine-004.md
+++ b/blog/2023-08-30-magazine-004.md
@@ -6,6 +6,9 @@ authors:
 tags: [cloud-oriented programming, winglang, changelog, newsletter,]
 hide_table_of_contents: true
 ---
+import ReactPlayer from "react-player";
+import multi_file_errors_mp4 from "./assets/2023-08-30-magazine-004/multi-file-errors.mp4";
+
 > The 4th issue of the Wing Inflight Magazine.
 > <!--truncate-->
 
@@ -70,18 +73,14 @@ In an effort to accelerate our development processes, we transitioned from Nx to
 ❤️ Added by [Chris Rybicki](https://github.com/Chriscbr) ❤️
 <br />
 We’ve been working to enhance and improve Wing’s multi-file support and have just introduced the latest update. Despite an initial challenge that led to a rollback, the new multi-file support allows classes, structs, types, and other declarations to be shared across different files. Now, developers can now better organize their code, reducing naming collisions and improving composability.
-
-<video autoplay muted loop>
-  <source src="./assets/2023-08-30-magazine-004/multi-file-errors.mp4" type="video/mp4"/>
-</video>
+<br /><br />
+<ReactPlayer width="100%" height="100%" playing loop muted url={multi_file_errors_mp4}/>
 
 ### Integrated Console in VSCode: 
 
 We've improved the integration of the console within VSCode, moving beyond the basic iFramed version. This update offers developers better screen utilization. We're also working on further refinements for smoother integration in the future.
 
-<video autoplay muted loop>
-  <source src="https://github.com/winglang/wing/assets/5547636/0a787216-8c10-48d8-b42b-7d1020c85c9d" type="video/mp4"/>
-</video>
+<ReactPlayer width="100%" height="100%" playing loop muted url="https://github.com/winglang/wing/assets/5547636/0a787216-8c10-48d8-b42b-7d1020c85c9d"/>
 
 ### Summary
 That’s a wrap for this update!
diff --git a/package-lock.json b/package-lock.json
index 0c6a420c6..8d731d440 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -21,6 +21,7 @@
         "prism-react-renderer": "^1.3.5",
         "react": "^17.0.2",
         "react-dom": "^17.0.2",
+        "react-player": "^2.13.0",
         "sass": "^1.54.4",
         "semver": "^7.3.7",
         "ts-jest": "^28.0.8"
@@ -11825,6 +11826,11 @@
       "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
       "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg=="
     },
+    "node_modules/load-script": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/load-script/-/load-script-1.0.0.tgz",
+      "integrity": "sha512-kPEjMFtZvwL9TaZo0uZ2ml+Ye9HUMmPwbYRJ324qF9tqMejwykJ5ggTyvzmrbBeapCAbk98BSbTeovHEEP1uCA=="
+    },
     "node_modules/loader-runner": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-4.3.0.tgz",
@@ -12081,6 +12087,11 @@
         "node": ">= 4.0.0"
       }
     },
+    "node_modules/memoize-one": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-5.2.1.tgz",
+      "integrity": "sha512-zYiwtZUcYyXKo/np96AGZAckk+FWWsUdJ3cHGGmld7+AhvcWmQyGCYUh1hc4Q/pkOhb65dQR/pqCyK0cOaHz4Q=="
+    },
     "node_modules/memory-fs": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
@@ -14698,6 +14709,21 @@
         "webpack": ">=4.41.1 || 5.x"
       }
     },
+    "node_modules/react-player": {
+      "version": "2.13.0",
+      "resolved": "https://registry.npmjs.org/react-player/-/react-player-2.13.0.tgz",
+      "integrity": "sha512-gkY7ZdbVFztlKFFhCPcnDrFQm+L399b8fhWsKatZ+b2wpKJwfUHBXQFMRxqYQGT0ic1/wQ7D7EZEWy7ZBqk2pw==",
+      "dependencies": {
+        "deepmerge": "^4.0.0",
+        "load-script": "^1.0.0",
+        "memoize-one": "^5.1.1",
+        "prop-types": "^15.7.2",
+        "react-fast-compare": "^3.0.1"
+      },
+      "peerDependencies": {
+        "react": ">=16.6.0"
+      }
+    },
     "node_modules/react-router": {
       "version": "5.3.4",
       "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.3.4.tgz",
diff --git a/package.json b/package.json
index c2dc6e19f..8a4d2e58c 100644
--- a/package.json
+++ b/package.json
@@ -32,7 +32,8 @@
     "react-dom": "^17.0.2",
     "sass": "^1.54.4",
     "semver": "^7.3.7",
-    "ts-jest": "^28.0.8"
+    "ts-jest": "^28.0.8",
+    "react-player":"^2.13.0"
   },
   "devDependencies": {
     "@docusaurus/module-type-aliases": "2.0.1",