diff --git a/404.html b/404.html
index d93160c..4909da0 100644
--- a/404.html
+++ b/404.html
@@ -54,6 +54,6 @@
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/404/index.html b/404/index.html
index 158d367..6f01508 100644
--- a/404/index.html
+++ b/404/index.html
@@ -54,6 +54,6 @@
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/CNAME b/CNAME
deleted file mode 100644
index aa5bc8d..0000000
--- a/CNAME
+++ /dev/null
@@ -1 +0,0 @@
-awalhossain.tech
\ No newline at end of file
diff --git a/_gatsby/slices/_gatsby-scripts-1.html b/_gatsby/slices/_gatsby-scripts-1.html
index 5035885..edcb2ec 100644
--- a/_gatsby/slices/_gatsby-scripts-1.html
+++ b/_gatsby/slices/_gatsby-scripts-1.html
@@ -2,6 +2,6 @@
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script>
\ No newline at end of file
diff --git a/blog/2023/jwt/index.html b/blog/2023/jwt/index.html
index 49003ac..7fab55f 100644
--- a/blog/2023/jwt/index.html
+++ b/blog/2023/jwt/index.html
@@ -75,6 +75,6 @@
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/blog/2024/Javascript-origin/index.html b/blog/2024/Javascript-origin/index.html
index 224cdf3..632eae4 100644
--- a/blog/2024/Javascript-origin/index.html
+++ b/blog/2024/Javascript-origin/index.html
@@ -79,6 +79,6 @@ <h2 id="nowlets-see-whats-actually-happening-inside-these-engine" style="positio
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/blog/2024/deploy/index.html b/blog/2024/deploy/index.html
index 7c1ac3f..1f2aa1d 100644
--- a/blog/2024/deploy/index.html
+++ b/blog/2024/deploy/index.html
@@ -218,6 +218,6 @@ <h2 id="github-actions" style="position:relative">Github Actions<a href="#github
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/blog/2024/streaming/index.html b/blog/2024/streaming/index.html
index 5455e91..6786d50 100644
--- a/blog/2024/streaming/index.html
+++ b/blog/2024/streaming/index.html
@@ -180,21 +180,22 @@ <h2 id="️-streaming" style="position:relative">📽️ Streaming<a href="#%EF%
 <p>On the right side of the video player, user can see the related videos.
 Below the video player, user can see the video details.</p>
 <h2 id="-upcoming-update-" style="position:relative">🚀** Upcoming Update **<a href="#-upcoming-update-" aria-label=" upcoming update  permalink" class="gatsby-remark-autolink-header-anchor after"><span><svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></span></a></h2>
-<p>Oviously This project isn&#x27;t done yet, there are lot other features that can be added to this project. Here are some of the features that I&#x27;m planning to add in the future:</p>
+<p>This project is a work in progress, and there&#x27;s so much more we can do to enhance it! Here are some of the features we&#x27;re planning to add in the future. We&#x27;d love to hear your thoughts on these:</p>
 <ul>
-<li><strong>User Profile:</strong> User can see their profile and update their profile.</li>
-<li><strong>Video Analytics:</strong> User can see the video analytics like views, likes, comments etc.</li>
-<li><strong>Video Comment:</strong> User can comment on the video.</li>
-<li><strong>Video Like:</strong> User can like the video.</li>
-<li><strong>Video Share:</strong> User can share the video.</li>
-<li><strong>Video Playlist:</strong> User can create playlist and add video to the playlist.</li>
-<li><strong>Video Subscription:</strong> User can subscribe to the channel and get notification when the channel upload a new video.</li>
-<li><strong>Video Notification:</strong> User can get notification when someone like, comment, share their video.</li>
-<li><strong>Video Embed:</strong> User can embed the video to their website.</li>
-<li><strong>Video Download:</strong> User can download the video.</li>
-<li><strong>Video Edit:</strong> User can edit the video title, description, tag etc.</li>
-<li><strong>Video Delete:</strong> User can delete the video.</li>
+<li><strong>User Profile:</strong> How about a feature where users can view and update their profiles?</li>
+<li><strong>Video Analytics:</strong> Wouldn&#x27;t it be great to see analytics like views, likes, and comments for each video?</li>
+<li><strong>Video Comment:</strong> How important do you think it is for users to be able to comment on videos?</li>
+<li><strong>Video Like:</strong> Should users be able to like videos?</li>
+<li><strong>Video Share:</strong> What about sharing videos? How often do you share videos you enjoy?</li>
+<li><strong>Video Playlist:</strong> How about creating playlists and adding videos to them?</li>
+<li><strong>Video Subscription:</strong> Should users be able to subscribe to channels and receive notifications for new uploads?</li>
+<li><strong>Video Notification:</strong> How would you feel about getting notifications when someone likes, comments, or shares your video?</li>
+<li><strong>Video Embed:</strong> Should users be able to embed videos on their websites?</li>
+<li><strong>Video Download:</strong> How about a feature for downloading videos?</li>
+<li><strong>Video Edit:</strong> Should users be able to edit video titles, descriptions, tags, etc.?</li>
+<li><strong>Video Delete:</strong> How important is it for users to be able to delete their videos?</li>
 </ul>
+<p>We&#x27;re excited about these potential features and would love to hear your feedback. Which of these features are you most interested in? Are there any other features you&#x27;d like to see added?</p>
 <h2 id="-technologies-used" style="position:relative">🤖 Technologies Used<a href="#-technologies-used" aria-label=" technologies used permalink" class="gatsby-remark-autolink-header-anchor after"><span><svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></span></a></h2>
 <ul>
 <li><strong>Backend:</strong> TypeScript, Node.js, Express.js,ffmpeg, MongoDB, Redis, BullMQ, Socket.io, AWS S3, ffmpeg, HLS.js</li>
@@ -202,10 +203,14 @@ <h2 id="-technologies-used" style="position:relative">🤖 Technologies Used<a h
 </ul>
 <h2 id="-github" style="position:relative">👨🏻‍💻 Github<a href="#-github" aria-label=" github permalink" class="gatsby-remark-autolink-header-anchor after"><span><svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></span></a></h2>
 <a href="https://github.com/AwalHossain/video_streaming_service_server" target="_blank"><p>Video Streaming Service Server</p></a>
-<a href="https://github.com/AwalHossain/video_streaming_client" target="_blank"><p>Video Streaming Service Client</p></a> </article></div><div class="flex flex-row justify-center items-center mt-16"><div class="max-w-md"></div></div></article><footer class="px-6 sm:px-12 py-12"><div class="flex flex-row items-center justify-center"><ul class="flex flex-row flex-wrap "><li class="flex flex-row items-center last:mr-0 mr-2 ml-2"><a href="https://www.linkedin.com/in/awal-hossain-0bb650108/" class="transition duration-200 ease-in-out flex flex-row items-center hover:text-red-600 " title="Awal Hossain on LinkedIn" target="_blank" rel="noreferrer"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 448 512" class="w-5 h-5" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"></path></svg></a></li><li class="flex flex-row items-center last:mr-0 mr-2 ml-2"><a href="https://github.com/awalHossain/" class="transition duration-200 ease-in-out flex flex-row items-center hover:text-red-600 " title="Awal Hossain on Github" target="_blank" rel="noreferrer"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 496 512" class="w-5 h-5" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"></path></svg></a></li><li class="flex flex-row items-center last:mr-0 mr-2 ml-2"><a href="https://twitter.com/AwalHosssaimn" class="transition duration-200 ease-in-out flex flex-row items-center hover:text-red-600 " title="Awal Hossain on Twitter" target="_blank" rel="noreferrer"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" class="w-5 h-5" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"></path></svg></a></li></ul></div><div style="flex:1" class="hidden sm:flex"> </div></footer></div></main></div><div id="gatsby-announcer" style="position:absolute;top:0;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0" aria-live="assertive" aria-atomic="true"></div></div><script id="gatsby-script-loader">/*<![CDATA[*/window.pagePath="/blog/2024/streaming/";/*]]>*/</script><!-- slice-start id="_gatsby-scripts-1" -->
+<a href="https://github.com/AwalHossain/video_streaming_client" target="_blank"><p>Video Streaming Service Client</p></a>
+<h2 id="-video-explanation" style="position:relative">📹 Video Explanation<a href="#-video-explanation" aria-label=" video explanation permalink" class="gatsby-remark-autolink-header-anchor after"><span><svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></span></a></h2>
+<p>Here is the video explanation of the project where i&#x27;ve explained How the web application works and how the backend services are communicating with each other.Hope this
+will help you to understand the project better.</p>
+<iframe width="80%" height="315" src="https://www.youtube.com/embed/RCRwublmR9E?si=kN1RwckxAq2zIKEm" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"></iframe> </article></div><div class="flex flex-row justify-center items-center mt-16"><div class="max-w-md"></div></div></article><footer class="px-6 sm:px-12 py-12"><div class="flex flex-row items-center justify-center"><ul class="flex flex-row flex-wrap "><li class="flex flex-row items-center last:mr-0 mr-2 ml-2"><a href="https://www.linkedin.com/in/awal-hossain-0bb650108/" class="transition duration-200 ease-in-out flex flex-row items-center hover:text-red-600 " title="Awal Hossain on LinkedIn" target="_blank" rel="noreferrer"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 448 512" class="w-5 h-5" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"></path></svg></a></li><li class="flex flex-row items-center last:mr-0 mr-2 ml-2"><a href="https://github.com/awalHossain/" class="transition duration-200 ease-in-out flex flex-row items-center hover:text-red-600 " title="Awal Hossain on Github" target="_blank" rel="noreferrer"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 496 512" class="w-5 h-5" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"></path></svg></a></li><li class="flex flex-row items-center last:mr-0 mr-2 ml-2"><a href="https://twitter.com/AwalHosssaimn" class="transition duration-200 ease-in-out flex flex-row items-center hover:text-red-600 " title="Awal Hossain on Twitter" target="_blank" rel="noreferrer"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" class="w-5 h-5" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"></path></svg></a></li></ul></div><div style="flex:1" class="hidden sm:flex"> </div></footer></div></main></div><div id="gatsby-announcer" style="position:absolute;top:0;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0" aria-live="assertive" aria-atomic="true"></div></div><script id="gatsby-script-loader">/*<![CDATA[*/window.pagePath="/blog/2024/streaming/";/*]]>*/</script><!-- slice-start id="_gatsby-scripts-1" -->
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/blog/index.html b/blog/index.html
index 728bb9e..7ce469a 100644
--- a/blog/index.html
+++ b/blog/index.html
@@ -54,6 +54,6 @@
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/chunk-map.json b/chunk-map.json
index 93ad107..640d9cb 100644
--- a/chunk-map.json
+++ b/chunk-map.json
@@ -1 +1 @@
-{"app":["/app-48e2fc747e435357e6ca.js"],"component---src-pages-404-tsx":["/component---src-pages-404-tsx-e52900953c2998f1b976.js"],"component---src-pages-blog-tsx":["/component---src-pages-blog-tsx-5f7059675b15af11c300.js"],"component---src-pages-index-tsx":["/component---src-pages-index-tsx-3dd77113240175e3e611.js"],"component---src-pages-projects-tsx":["/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx":["/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx":["/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx":["/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx":["/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js"],"component---src-templates-project-tsx":["/component---src-templates-project-tsx-2b0f8b1d26124b556601.js"]}
\ No newline at end of file
+{"app":["/app-48e2fc747e435357e6ca.js"],"component---src-pages-404-tsx":["/component---src-pages-404-tsx-e52900953c2998f1b976.js"],"component---src-pages-blog-tsx":["/component---src-pages-blog-tsx-5f7059675b15af11c300.js"],"component---src-pages-index-tsx":["/component---src-pages-index-tsx-3dd77113240175e3e611.js"],"component---src-pages-projects-tsx":["/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx":["/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx":["/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx":["/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx":["/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js"],"component---src-templates-project-tsx":["/component---src-templates-project-tsx-2b0f8b1d26124b556601.js"]}
\ No newline at end of file
diff --git a/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js.map b/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js.map
deleted file mode 100644
index abd4272..0000000
--- a/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js.map
+++ /dev/null
@@ -1 +0,0 @@
-{"version":3,"file":"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js","mappings":"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","sources":["webpack://portfolio/./node_modules/@react-icons/all-files/bi/BiErrorCircle.js","webpack://portfolio/./node_modules/@react-icons/all-files/bs/BsFillInfoCircleFill.js","webpack://portfolio/./node_modules/@react-icons/all-files/fi/FiCalendar.js","webpack://portfolio/./node_modules/@react-icons/all-files/fi/FiClock.js","webpack://portfolio/./src/posts/2024/streaming/index.mdx","webpack://portfolio/./src/templates/Post.tsx","webpack://portfolio/./src/components/elements/Post.tsx","webpack://portfolio/./src/components/screens/PostScreen.tsx","webpack://portfolio/./src/components/shared/Alert.tsx","webpack://portfolio/./src/components/shared/ErrorBoundary.tsx","webpack://portfolio/./src/components/shared/PageHeader.tsx","webpack://portfolio/./src/components/shared/Row.tsx","webpack://portfolio/./src/utils/time.ts","webpack://portfolio/./node_modules/@mdx-js/react/lib/index.js"],"sourcesContent":["// THIS FILE IS AUTO GENERATED\nvar GenIcon = require('../lib').GenIcon\nmodule.exports.BiErrorCircle = function BiErrorCircle (props) {\n  return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M11.953,2C6.465,2,2,6.486,2,12s4.486,10,10,10s10-4.486,10-10S17.493,2,11.953,2z M12,20c-4.411,0-8-3.589-8-8 s3.567-8,7.953-8C16.391,4,20,7.589,20,12S16.411,20,12,20z\"}},{\"tag\":\"path\",\"attr\":{\"d\":\"M11 7H13V14H11zM11 15H13V17H11z\"}}]})(props);\n};\n","// THIS FILE IS AUTO GENERATED\nvar GenIcon = require('../lib').GenIcon\nmodule.exports.BsFillInfoCircleFill = function BsFillInfoCircleFill (props) {\n  return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"fillRule\":\"evenodd\",\"d\":\"M8 16A8 8 0 108 0a8 8 0 000 16zm.93-9.412l-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM8 5.5a1 1 0 100-2 1 1 0 000 2z\",\"clipRule\":\"evenodd\"}}]})(props);\n};\n","// THIS FILE IS AUTO GENERATED\nvar GenIcon = require('../lib').GenIcon\nmodule.exports.FiCalendar = function FiCalendar (props) {\n  return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":\"2\",\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\"},\"child\":[{\"tag\":\"rect\",\"attr\":{\"x\":\"3\",\"y\":\"4\",\"width\":\"18\",\"height\":\"18\",\"rx\":\"2\",\"ry\":\"2\"}},{\"tag\":\"line\",\"attr\":{\"x1\":\"16\",\"y1\":\"2\",\"x2\":\"16\",\"y2\":\"6\"}},{\"tag\":\"line\",\"attr\":{\"x1\":\"8\",\"y1\":\"2\",\"x2\":\"8\",\"y2\":\"6\"}},{\"tag\":\"line\",\"attr\":{\"x1\":\"3\",\"y1\":\"10\",\"x2\":\"21\",\"y2\":\"10\"}}]})(props);\n};\n","// THIS FILE IS AUTO GENERATED\nvar GenIcon = require('../lib').GenIcon\nmodule.exports.FiClock = function FiClock (props) {\n  return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":\"2\",\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\"},\"child\":[{\"tag\":\"circle\",\"attr\":{\"cx\":\"12\",\"cy\":\"12\",\"r\":\"10\"}},{\"tag\":\"polyline\",\"attr\":{\"points\":\"12 6 12 12 16 14\"}}]})(props);\n};\n","/*@jsxRuntime classic @jsx React.createElement @jsxFrag React.Fragment*/\nimport {useMDXComponents as _provideComponents} from \"@mdx-js/react\";\nimport React from \"react\";\nfunction _createMdxContent(props) {\n  const _components = Object.assign({\n    h1: \"h1\",\n    a: \"a\",\n    span: \"span\",\n    img: \"img\",\n    p: \"p\",\n    ul: \"ul\",\n    li: \"li\",\n    h3: \"h3\",\n    ol: \"ol\",\n    strong: \"strong\",\n    h2: \"h2\"\n  }, _provideComponents(), props.components);\n  return React.createElement(React.Fragment, null, React.createElement(_components.h1, {\n    id: \"-overview\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🌐 Overview\", React.createElement(_components.a, {\n    href: \"#-overview\",\n    \"aria-label\": \" overview permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.img, {\n    src: \"https://github.com/AwalHossain/video_streaming_service_server/assets/80216813/9e6b1889-c9d6-45d8-806e-27865f674912\",\n    alt: \"Project Image\"\n  }), \"\\n\", React.createElement(_components.p, null, \"MERN Video Streaming is a cutting-edge, open-source platform for video streaming, offering a comprehensive, full-stack solution utilizing the latest MERN stack technologies. With MERN Video Streaming, users can easily upload, manage, and stream videos on demand, providing a seamless experience. This project features a video processing capability that provides real-time notifications upon completion.\"), \"\\n\", React.createElement(_components.p, null, \"The backend is comprised of three services, utilizing Redis messaging for communication. These include an API server, a video conversion service, and an HTTP server serving HLS video files. On the client side, the project uses create-react-app and MUI library, along with socket.io-client and React Context.\"), \"\\n\", React.createElement(_components.h1, {\n    id: \"-features\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🌟 Features\", React.createElement(_components.a, {\n    href: \"#-features\",\n    \"aria-label\": \" features permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.ul, null, \"\\n\", React.createElement(_components.li, null, \"Real-time video processing with notifications upon completion\"), \"\\n\", React.createElement(_components.li, null, \"Three-tier backend services for API, video conversion, and HTTP serving\"), \"\\n\", React.createElement(_components.li, null, \"Frontend built with create-react-app and MUI library\"), \"\\n\", React.createElement(_components.li, null, \"Real-time communication with the API server using socket.io-client and React Context\"), \"\\n\"), \"\\n\", React.createElement(_components.h1, {\n    id: \"️-architecture\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🏗️ Architecture\", React.createElement(_components.a, {\n    href: \"#%EF%B8%8F-architecture\",\n    \"aria-label\": \"️ architecture permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.img, {\n    src: \"https://user-images.githubusercontent.com/497812/220627727-04a26928-71df-4c9b-9637-92289a2beee2.png\",\n    alt: \"Architecture Image\"\n  }), \"\\n\", React.createElement(_components.h1, {\n    id: \"-backend-services\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"📡 Backend Services\", React.createElement(_components.a, {\n    href: \"#-backend-services\",\n    \"aria-label\": \" backend services permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.h3, {\n    id: \"️-api-server\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🖥️ API Server\", React.createElement(_components.a, {\n    href: \"#%EF%B8%8F-api-server\",\n    \"aria-label\": \"️ api server permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.p, null, \"The API server is an Expressjs app that uses Joi, Multer, BullMQ, Socket.io, and\\nMongoDB driver. The server communicates with Redis to process and store data,\\nand uses MongoDB as the primary database. The API server is responsible for the\\nfollowing:\"), \"\\n\", React.createElement(_components.ol, null, \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"User Authentication:\"), \" Handles user registration, login, and JWT token generation.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Upload:\"), \" Manages video uploads, stores video metadata in MongoDB, and sends a job to the video processing service.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Management:\"), \" Provides endpoints for fetching video metadata, deleting videos, and fetching video streams.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Real-time Notifications:\"), \" Sends real-time notifications to the client using socket.io upon video processing completion.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Job Queue Management:\"), \" Manages the job queue using BullMQ, passing one job to the next upon completion.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Redis Communication:\"), \" Communicates with Redis to store job data and send real-time notifications to the client.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Bucket Storage Integration:\"), \" Upload completed video file into a CDN bucket storage to store video files, ensuring optimal streaming quality.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Streaming:\"), \" Serves HLS video files to the client, allowing users to stream videos seamlessly.\"), \"\\n\"), \"\\n\", React.createElement(_components.p, null, \"The HTTP server communicates with Redis to fetch video metadata and stream video files.\\nThis server is not exposed to the public internet, ensuring a secure video streaming pipeline.\"), \"\\n\", React.createElement(_components.h3, {\n    id: \"️-video-processing-service\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🎞️ Video Processing Service\", React.createElement(_components.a, {\n    href: \"#%EF%B8%8F-video-processing-service\",\n    \"aria-label\": \"️ video processing service permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.p, null, \"The Video Conversion Service is a Node.js process with ffmpeg responsible for converting videos and managing tasks with the BullMQ library.\\nFirst of all, when user upload a video with an watermark image(optional), the API server sends a job to the video processing service. The job contains the video file, the watermark image, and the user ID. The video processing service then processes the video in three steps:\"), \"\\n\", React.createElement(_components.ol, null, \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Conversion:\"), \" Converts any format video into MP4 and applies a watermark if an image is provided.\"), \"\\n\"), \"\\n\", React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<span\\n      class=\\\"gatsby-resp-image-wrapper\\\"\\n      style=\\\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 1000px; \\\"\\n    >\\n      <span\\n    class=\\\"gatsby-resp-image-background-image\\\"\\n    style=\\\"padding-bottom: 48%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAB+ElEQVR42nWS7UtTURzH97cEgYGQMVgU9GBiDy5GD658Y1FvohcFQUEaaZDiix4gIrBe9CLfZCOfZmnJMufGdXPT1rOZGFRWoNuuzvZwd++nc+/uYnfWgS+/c36/3/mc3zm/Y6t1NXDq7AU8vQN0P+5fo0c9AyLmNey/4rpOnj5HrdON83AjtmpnPa3t19GHpmmUj1xOIZvJoih5i1/PLWZfbGmnRnBc7mPYdtUJYNu1/wKVbJpcJkVeya6JFfMN4H43riPHsW3fc5DLVwvAj98ySDMpJmdXCZt6/SVNTOjV/G/Cn1KETEkzK0zNraIKZlOrXqEJ3LHv0N8r9wW+cv/5d7peLNDl+8ED3wI9wZ88jSZ4Ni3jCS7RHVjCI/TQv0h/KI7+Es2lQH1SBEofZAbDcYanEgxFEvhiSfxvZcbfp/C/W2H0zbIB1jUUTRrrfHmFFqC4bl8oyZOojHdSZiSmQ8Q89MvYPBJbxhtJMigO65UWGY7GyeZUmlraqKkzm1IAFt5Q1fROalYJn6qkhVUt/tL+NV/pQP9+B46esFaoqqqQVvgSpTI7quZVI+/z7BwdYs/NG7fpvHuP+oZGHFt3sq16L7bdgnzm/CXGghOMBSRelsnwjRfsqD/IRGSaW3c6Wbe+gg2VG6morKLKvplNdgd2xxb+AL3wgHSOYXE+AAAAAElFTkSuQmCC'); background-size: cover; display: block;\\\"\\n  ></span>\\n  <img\\n        class=\\\"gatsby-resp-image-image\\\"\\n        alt=\\\"video-conversion\\\"\\n        title=\\\"\\\"\\n        src=\\\"/static/d6a4a8af05899993666207a38a052a6a/00d43/up.png\\\"\\n        srcset=\\\"/static/d6a4a8af05899993666207a38a052a6a/63868/up.png 250w,\\n/static/d6a4a8af05899993666207a38a052a6a/0b533/up.png 500w,\\n/static/d6a4a8af05899993666207a38a052a6a/00d43/up.png 1000w,\\n/static/d6a4a8af05899993666207a38a052a6a/6edca/up.png 1351w\\\"\\n        sizes=\\\"(max-width: 1000px) 100vw, 1000px\\\"\\n        style=\\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\\"\\n        loading=\\\"lazy\\\"\\n        decoding=\\\"async\\\"\\n      />\\n    </span>\"\n    }\n  }), \"\\n\", React.createElement(_components.ol, {\n    start: \"2\"\n  }, \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Adaptive Bitrate Processing:\"), \" Transforms the video into adaptive bitrate HLS format (480p & 1080p) for optimal streaming quality.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"CDN Upload:\"), \" Upon successful conversion, the video is uploaded to a CDN bucket storage. This allows users to stream videos seamlessly from anywhere in the world.\"), \"\\n\"), \"\\n\", React.createElement(_components.p, null, \"The video processing service communicates with the API server using Redis messaging to send real-time notifications upon completion.\"), \"\\n\", React.createElement(_components.h1, {\n    id: \"-frontend\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"📱 Frontend\", React.createElement(_components.a, {\n    href: \"#-frontend\",\n    \"aria-label\": \" frontend permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.h2, {\n    id: \"-upload\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"📥 Upload\", React.createElement(_components.a, {\n    href: \"#-upload\",\n    \"aria-label\": \" upload permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.p, null, \"To upload a video with watermark image, the user must first register and login. After logging in, the user can upload a video with an optional watermark image.\\nThe video is then processed and uploaded to the CDN bucket storage. Upon completion every process, the user receives a real-time notification.\"), \"\\n\", React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<span\\n      class=\\\"gatsby-resp-image-wrapper\\\"\\n      style=\\\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 1000px; \\\"\\n    >\\n      <span\\n    class=\\\"gatsby-resp-image-background-image\\\"\\n    style=\\\"padding-bottom: 49.6%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAAA7DAAAOwwHHb6hkAAACdklEQVR42k2S7UtTYRiH9ycEfuijJAUFQSAkDBMhUntRTEzISaJooKBiL5SKiqWbiC+E6VBrajQyUsPQ1KVGkVomhSZYIpaNCjN1O9vZ2Tnb7Oqc5cQPP57z/O5zX8/93PejcwgyokfBH9hG8fnx+QP4QqsqzQtpN7bzrez5R3B72HS60DkEEZdbQpIVvLIPUfLi2ZHo0STh9oT20k5MVj0pGHeLnqDvEsUgQ2f/ucba+maQrsGcgpsNhxDUluo5BBcbmw7+OFwIKkBL2pVXQVG2kX0B9YZaxT50WqJWgWZoJ5WW3STjQgp5mQYsbWba330jqW+BMtsXumZXaf9sp2FumYaPS1g/zDEx85ih0U56bc2s/JpB5xalYPlaL7xembgYPfojBzhx9CD5WQYuD80S3T7MxeZHtA++IH96EcPwNKmDU1SMTVFgzCC/PJGz+eEMTlrRyYoPTUGgLJN9KZ20xDgMyWe4ca2Qgoc9xBrriTXV0GjtpHLqE0UjKujZS6p7+iltbaL4jokrxjhGX3Wj2ztFDfzjt5P1LVGtWp2+JLH6fRVR7ZXnL2wKTuxfFxEUtV/qXnRtsby0wIYUQPKrr8Tv3wsMqEA10T6BtNLP/HgH4wNdbNjneTrQwtiwhTe2XmqryjCbSrhbU4LF3MxAdx02axPPO0wsvX8dAmpX3kZSK5ptS2O68hBFsfswnNbzdtJMeVYUdZnRPLFUER8ZQWFsONej93MrJ5mK9OO0FCdhTDzMQOvt/8BQDz3qcGrz4ik/F4YhKoz086e4X51NW0oMV3NOklWUSm5CJA9y9VQnRFBfmMaIuZDBujyqUo/Rd6+Rf+quiH3us8W/AAAAAElFTkSuQmCC'); background-size: cover; display: block;\\\"\\n  ></span>\\n  <img\\n        class=\\\"gatsby-resp-image-image\\\"\\n        alt=\\\"home-page\\\"\\n        title=\\\"\\\"\\n        src=\\\"/static/473ab1fa48833a7445ed2581a60fb278/00d43/cover.png\\\"\\n        srcset=\\\"/static/473ab1fa48833a7445ed2581a60fb278/63868/cover.png 250w,\\n/static/473ab1fa48833a7445ed2581a60fb278/0b533/cover.png 500w,\\n/static/473ab1fa48833a7445ed2581a60fb278/00d43/cover.png 1000w,\\n/static/473ab1fa48833a7445ed2581a60fb278/9ba38/cover.png 1329w\\\"\\n        sizes=\\\"(max-width: 1000px) 100vw, 1000px\\\"\\n        style=\\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\\"\\n        loading=\\\"lazy\\\"\\n        decoding=\\\"async\\\"\\n      />\\n    </span>\"\n    }\n  }), \"\\n\", React.createElement(_components.p, null, \"Below some feature of the frontend part of the project:\"), \"\\n\", React.createElement(_components.ul, null, \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Search:\"), \" Look for videos by typing in their title.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Filter:\"), \" Pick videos based on specific tags.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Sorting:\"), \" Put videos in order by date, views, likes, etc.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Edit Video metadata:\"), \" User can edit the video title, description, tag etc.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Tag:\"), \" Add tags to group your videos together.\"), \"\\n\"), \"\\n\", React.createElement(_components.h2, {\n    id: \"️-streaming\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"📽️ Streaming\", React.createElement(_components.a, {\n    href: \"#%EF%B8%8F-streaming\",\n    \"aria-label\": \"️ streaming permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.p, null, \"User will able to see their uploaded videos and stream them. The video player is built with HLS.js, allowing for seamless video streaming.\\nThis player has a built-in adaptive bitrate feature, ensuring optimal streaming quality. User can easily switch to different video quality options.\\nDepend on user internet speed, the video player will automatically switch to the best quality.\"), \"\\n\", React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<span\\n      class=\\\"gatsby-resp-image-wrapper\\\"\\n      style=\\\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 1000px; \\\"\\n    >\\n      <span\\n    class=\\\"gatsby-resp-image-background-image\\\"\\n    style=\\\"padding-bottom: 48.800000000000004%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAAA7DAAAOwwHHb6hkAAACnklEQVR42pWSa0uTARTH96ZvEL3sA/SiVxFFzOWtlS11j5aP87I23dyal6bTKYpJpgQlhmUZupnO2zQNgyhISDAKKiGlqKQgKEYznaVOt2eXX4/r8r4Dh3M4HA6//5+jCIb4r4jFYsTj8UQfl/twNMzmWoDAsh+f34/CO9yP1+tlaHgEz4CbEY+HQZebyfExhj2j9LpcuN19DA0OcPW6vDt5n+mpCbyD/UyN3+erL4bPt81qIM6Ll29RVBlzKcnPoUjM5XiaEo1GiybjFKZsNaJWQ4XZxOAtN/WOVhS7DyHqK+nquU1ZWQUOm50vvjCBH0FiMvHC4hsU1aWFGArPohfzsRn1OG1WGuw2anLUWDNUNDucdDovcrGujV17DpNXXMW9aS8jYx7m5mZY/h6V87dvH5aWUJgKdBj1JaSmZ1JVUkBb62VaOke50NSKet9eVKokrFqRm84WDu9PQhBLePR4kvef5nnydIaVwBabwW2kSISwFEFRbq+lpr4B8zkbztYumnse0HjrIefbXQiCQLpShV1XRqOlkmNpahoaGvHc6cPV3cnE6AgB2btv/jDrGxEi0ahMaCqkvMKE2V5HdccEBY4OiuxtGOzNFAgitjNm9GdyyRZySFELWIwGclOPkK08QLWllOBWjJ/rW4TCkQSlIk+rJl19kkxtHkZbLdpCC0npJ0g9qiJTeZDT2iyUySmczNCQrEqm6dIVeuY/c212kdmFjyz7JZlOShyTdiQ7Ks9RZinHYrZi1IlkZQpohdPk54sYDHosJjM6XTFWq4WaynLae90Yp5+R1TnAjSEv6+sh2cOthH9SRJa8urbBz40gIXmwg70dkohGY/8eOf63/nnmrxub9L1+R/fzee6+WmRtLcLKqpQ4GA5L/AJQgkG4HTSpQgAAAABJRU5ErkJggg=='); background-size: cover; display: block;\\\"\\n  ></span>\\n  <img\\n        class=\\\"gatsby-resp-image-image\\\"\\n        alt=\\\"video-player\\\"\\n        title=\\\"\\\"\\n        src=\\\"/static/1e8d680dc35f92e358a59fd2bbc4a2f8/00d43/pl.png\\\"\\n        srcset=\\\"/static/1e8d680dc35f92e358a59fd2bbc4a2f8/63868/pl.png 250w,\\n/static/1e8d680dc35f92e358a59fd2bbc4a2f8/0b533/pl.png 500w,\\n/static/1e8d680dc35f92e358a59fd2bbc4a2f8/00d43/pl.png 1000w,\\n/static/1e8d680dc35f92e358a59fd2bbc4a2f8/b1584/pl.png 1342w\\\"\\n        sizes=\\\"(max-width: 1000px) 100vw, 1000px\\\"\\n        style=\\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\\"\\n        loading=\\\"lazy\\\"\\n        decoding=\\\"async\\\"\\n      />\\n    </span>\"\n    }\n  }), \"\\n\", React.createElement(_components.p, null, \"On the right side of the video player, user can see the related videos.\\nBelow the video player, user can see the video details.\"), \"\\n\", React.createElement(_components.h2, {\n    id: \"-upcoming-update-\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🚀** Upcoming Update **\", React.createElement(_components.a, {\n    href: \"#-upcoming-update-\",\n    \"aria-label\": \" upcoming update  permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.p, null, \"Oviously This project isn't done yet, there are lot other features that can be added to this project. Here are some of the features that I'm planning to add in the future:\"), \"\\n\", React.createElement(_components.ul, null, \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"User Profile:\"), \" User can see their profile and update their profile.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Analytics:\"), \" User can see the video analytics like views, likes, comments etc.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Comment:\"), \" User can comment on the video.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Like:\"), \" User can like the video.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Share:\"), \" User can share the video.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Playlist:\"), \" User can create playlist and add video to the playlist.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Subscription:\"), \" User can subscribe to the channel and get notification when the channel upload a new video.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Notification:\"), \" User can get notification when someone like, comment, share their video.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Embed:\"), \" User can embed the video to their website.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Download:\"), \" User can download the video.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Edit:\"), \" User can edit the video title, description, tag etc.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Delete:\"), \" User can delete the video.\"), \"\\n\"), \"\\n\", React.createElement(_components.h2, {\n    id: \"-technologies-used\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🤖 Technologies Used\", React.createElement(_components.a, {\n    href: \"#-technologies-used\",\n    \"aria-label\": \" technologies used permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.ul, null, \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Backend:\"), \" TypeScript, Node.js, Express.js,ffmpeg, MongoDB, Redis, BullMQ, Socket.io, AWS S3, ffmpeg, HLS.js\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Frontend:\"), \" React, MUI, HLS.js, socket.io-client, React Context\"), \"\\n\"), \"\\n\", React.createElement(_components.h2, {\n    id: \"-github\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"👨🏻‍💻 Github\", React.createElement(_components.a, {\n    href: \"#-github\",\n    \"aria-label\": \" github permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(\"a\", {\n    href: \"https://github.com/AwalHossain/video_streaming_service_server\",\n    target: \"_blank\"\n  }, React.createElement(_components.p, null, \"Video Streaming Service Server\")), \"\\n\", React.createElement(\"a\", {\n    href: \"https://github.com/AwalHossain/video_streaming_client\",\n    target: \"_blank\"\n  }, React.createElement(_components.p, null, \"Video Streaming Service Client\")));\n}\nfunction MDXContent(props = {}) {\n  const {wrapper: MDXLayout} = Object.assign({}, _provideComponents(), props.components);\n  return MDXLayout ? React.createElement(MDXLayout, props, React.createElement(_createMdxContent, props)) : _createMdxContent(props);\n}\nexport default MDXContent;\n","import GATSBY_COMPILED_MDX from \"/home/runner/work/awalhossain.github.io/awalhossain.github.io/src/posts/2024/streaming/index.mdx\";\nimport React from 'react';\nimport PostScreen from '../components/screens/PostScreen';\nconst query = \"3821838164\";\nconsole.log(query, 'checking post template query');\nconst Post = props => {\n  const {data, children} = props;\n  return React.createElement(PostScreen, {\n    post: data\n  }, \" \", children, \" \");\n};\nPost\nexport default function GatsbyMDXWrapper(props) {\n  return React.createElement(Post, props, React.createElement(GATSBY_COMPILED_MDX, props));\n}\n","import { FiCalendar } from '@react-icons/all-files/fi/FiCalendar';\nimport { FiClock } from '@react-icons/all-files/fi/FiClock';\nimport React from 'react';\nimport { PostTemplateQuery } from '../../templates/__generated__/PostTemplateQuer';\nimport { timeToReadFromRemark } from '../../utils/time';\nimport ErrorBoundary from '../shared/ErrorBoundary';\nimport PageHeader from '../shared/PageHeader';\nimport Row from '../shared/Row';\n\ntype PostProps = {\n    post: PostTemplateQuery,\n    children: React.ReactNode,\n};\n\nconst Post = (props: PostProps): React.ReactElement | null => {\n  const { post, children } = props;\n\n  const dateElement = post?.mdx?.frontmatter?.date ? (\n    <Row className=\"mr-6 mb-6 text-gray-500 text-sm\">\n      <FiCalendar className=\"mr-1\" />\n      {post?.mdx?.frontmatter.date}\n    </Row>\n  ) : null;\n\n  const timeToRead = post?.mdx?.timeToRead ? (\n    <Row>\n      <FiClock className=\"mr-1\" />\n      {timeToReadFromRemark(post?.mdx?.timeToRead)} min to read\n    </Row>\n  ) : null;\n\n  return (\n    <div className=\"flex flex-col items-center\">\n      <article className=\"w-full prose prose-sm sm:prose overflow-hidden prose-red\" style={{ maxWidth: '860px' }}>\n        <PageHeader>{post.mdx?.frontmatter?.title || ''}</PageHeader>\n        <Row>\n          {dateElement}\n          {timeToRead}\n        </Row>\n        <ErrorBoundary>\n          {children}\n        </ErrorBoundary>\n      </article>\n    </div>\n  );\n};\n\nexport default Post;\n","import React from 'react';\nimport { PostTemplateQuery } from '../../templates/__generated__/PostTemplateQuer';\nimport Post from '../elements/Post';\nimport PageLayout from '../layouts/PageLayout';\nimport SEO, { ogTypeArticle, titleModeSuffix } from '../shared/SEO';\n\ntype PostProps = {\n    post: PostTemplateQuery,\n    children?: React.ReactNode\n}\n\nconst PostScreen = (props: PostProps): React.ReactElement => {\n  const { post, children } = props;\n\n  console.log(post, 'post', children, 'children');\n\n  return (\n    <PageLayout>\n      <SEO\n        title={post.mdx?.frontmatter?.title || ''}\n        titleMode={titleModeSuffix}\n        description={post.mdx?.frontmatter?.summary || ''}\n        image={post.mdx?.frontmatter?.cover?.childImageSharp?.gatsbyImageData?.images?.fallback?.src || ''}\n        type={ogTypeArticle}\n      />\n      <Post post={post}>{children}</Post>\n      <div className=\"flex flex-row justify-center items-center mt-16\">\n        <div className=\"max-w-md\" />\n      </div>\n    </PageLayout>\n  );\n};\n\nexport default PostScreen;\n","import { BiErrorCircle } from '@react-icons/all-files/bi/BiErrorCircle';\nimport { BsFillInfoCircleFill } from '@react-icons/all-files/bs/BsFillInfoCircleFill';\nimport React from 'react';\n\nimport Row from './Row';\n\ntype AlertType = 'error' | 'info';\n\ntype AlertProps = {\n    type: AlertType,\n    children: React.ReactNode | null,\n};\n\ntype alertIcons = Record<AlertType, React.ReactNode>;\n\ntype alertClasses = Record<AlertType, string>;\n\nexport const InfoAlert: AlertType = 'info';\nexport const ErrorAlert: AlertType = 'error';\n\nconst alertIcons: alertIcons = {\n  [InfoAlert]: <BsFillInfoCircleFill size={18} />,\n  [ErrorAlert]: <BiErrorCircle size={18} />,\n};\n\nconst alertClasses: alertClasses = {\n  [InfoAlert]: 'text-blue-600 bg-blue-100',\n  [ErrorAlert]: 'text-red-600 bg-red-100',\n};\n\nconst Alert = (props: AlertProps): React.ReactElement | null => {\n  const { children, type } = props;\n\n  if (!children) {\n    return null;\n  }\n\n  return (\n    <div className={`py-3 px-4 rounded-md ${alertClasses[type]}`}>\n      <Row>\n        <div className=\"mr-3\">\n          {alertIcons[type]}\n        </div>\n        <div className=\"text-sm\">\n          {children}\n        </div>\n      </Row>\n    </div>\n  );\n};\n\nexport default Alert;\n","import React, { ErrorInfo } from 'react';\nimport Alert, { ErrorAlert } from './Alert';\n\ntype Props = {\n    children: React.ReactNode,\n};\n\ntype State = {\n    hasError: boolean,\n};\n\nclass ErrorBoundary extends React.Component<Props, State> {\n  constructor(props: Props) {\n    super(props);\n    this.state = {\n      hasError: false,\n    };\n  }\n\n  static getDerivedStateFromError(): State {\n    // Update state so the next render will show the fallback UI.\n    return {\n      hasError: true,\n    };\n  }\n\n  componentDidCatch(error: Error, errorInfo: ErrorInfo): void {\n    // You can also log the error to an error reporting service.\n    // eslint-disable-next-line no-console\n    console.error(error, errorInfo);\n    this.setState({ hasError: true });\n  }\n\n  render(): React.ReactNode {\n    const { children } = this.props;\n    const { hasError } = this.state;\n\n    if (hasError) {\n      // You can render any custom fallback UI\n      return (\n        <Alert type={ErrorAlert}>\n          Component has crashed\n        </Alert>\n      );\n    }\n\n    return children;\n  }\n}\n\nexport default ErrorBoundary;\n","import React from 'react';\nimport H, { hLevel } from './H';\n\ntype PageHeaderProps = {\n    children: React.ReactNode,\n    className?: string,\n};\n\nconst PageHeader = (props: PageHeaderProps): React.ReactElement | null => {\n  const { children, className = '' } = props;\n  const commonClasses = 'mb-6 uppercase font-extrabold';\n\n  const classes = `${commonClasses} ${className}`;\n  return (\n    <H level={hLevel.h1} className={classes}>\n      {children}\n    </H>\n  );\n};\n\nexport default PageHeader;\n","import React, { CSSProperties } from 'react';\n\ntype RowProps = {\n  children: React.ReactNode,\n  className?: string,\n  responsive?: boolean,\n  style?: CSSProperties,\n};\n\nconst Row = (props: RowProps): React.ReactElement | null => {\n  const {\n    children,\n    className = '',\n    responsive = false,\n    style = {},\n  } = props;\n\n  if (!children) {\n    return null;\n  }\n\n  const classes = responsive ? 'flex flex-col sm:flex-row items-center' : 'flex flex-row items-center';\n\n  return (\n    <div style={style} className={`${classes} ${className}`}>\n      {children}\n    </div>\n  );\n};\n\nexport default Row;\n","// Adjusting the time to read.\n// gatsby-transformer-remark plugin relies on the 265 average words per minute.\n// @see: https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-transformer-remark/src/utils/time-to-read.js\nexport const timeToReadFromRemark = (\n  remarkTimeToRead?: number | null | undefined,\n): number | null => {\n  if (typeof remarkTimeToRead !== 'number') {\n    return null;\n  }\n  const timeToReadMultiplier = 1;\n  const minTimeToRead = 1;\n  return Math.ceil(remarkTimeToRead * timeToReadMultiplier) || minTimeToRead;\n};\n\nexport const wait = async (ms: number): Promise<void> => {\n  return new Promise((resolve) => {\n    setTimeout(resolve, ms);\n  });\n};\n","/**\n * @typedef {import('react').ReactNode} ReactNode\n * @typedef {import('mdx/types.js').MDXComponents} Components\n *\n * @typedef Props\n *   Configuration.\n * @property {Components | MergeComponents | null | undefined} [components]\n *   Mapping of names for JSX components to React components.\n * @property {boolean | null | undefined} [disableParentContext=false]\n *   Turn off outer component context.\n * @property {ReactNode | null | undefined} [children]\n *   Children.\n *\n * @callback MergeComponents\n *   Custom merge function.\n * @param {Components} currentComponents\n *   Current components from the context.\n * @returns {Components}\n *   Merged components.\n */\n\nimport React from 'react'\n\n/**\n * @type {import('react').Context<Components>}\n * @deprecated\n *   This export is marked as a legacy feature.\n *   That means it’s no longer recommended for use as it might be removed\n *   in a future major release.\n *\n *   Please use `useMDXComponents` to get context based components and\n *   `MDXProvider` to set context based components instead.\n */\nexport const MDXContext = React.createContext({})\n\n/**\n * @param {import('react').ComponentType<any>} Component\n * @deprecated\n *   This export is marked as a legacy feature.\n *   That means it’s no longer recommended for use as it might be removed\n *   in a future major release.\n *\n *   Please use `useMDXComponents` to get context based components instead.\n */\nexport function withMDXComponents(Component) {\n  return boundMDXComponent\n\n  /**\n   * @param {Record<string, unknown> & {components?: Components | null | undefined}} props\n   * @returns {JSX.Element}\n   */\n  function boundMDXComponent(props) {\n    const allComponents = useMDXComponents(props.components)\n    return React.createElement(Component, {...props, allComponents})\n  }\n}\n\n/**\n * Get current components from the MDX Context.\n *\n * @param {Components | MergeComponents | null | undefined} [components]\n *   Additional components to use or a function that takes the current\n *   components and filters/merges/changes them.\n * @returns {Components}\n *   Current components.\n */\nexport function useMDXComponents(components) {\n  const contextComponents = React.useContext(MDXContext)\n\n  // Memoize to avoid unnecessary top-level context changes\n  return React.useMemo(() => {\n    // Custom merge via a function prop\n    if (typeof components === 'function') {\n      return components(contextComponents)\n    }\n\n    return {...contextComponents, ...components}\n  }, [contextComponents, components])\n}\n\n/** @type {Components} */\nconst emptyObject = {}\n\n/**\n * Provider for MDX context\n *\n * @param {Props} props\n * @returns {JSX.Element}\n */\nexport function MDXProvider({components, children, disableParentContext}) {\n  /** @type {Components} */\n  let allComponents\n\n  if (disableParentContext) {\n    allComponents =\n      typeof components === 'function'\n        ? components({})\n        : components || emptyObject\n  } else {\n    allComponents = useMDXComponents(components)\n  }\n\n  return React.createElement(\n    MDXContext.Provider,\n    {value: allComponents},\n    children\n  )\n}\n"],"names":["GenIcon","module","exports","props","_createMdxContent","_components","Object","assign","h1","a","span","img","p","ul","li","h3","ol","strong","h2","_provideComponents","components","React","id","style","position","href","className","dangerouslySetInnerHTML","__html","src","alt","start","target","wrapper","MDXLayout","console","log","Post","data","children","PostScreen","post","GatsbyMDXWrapper","GATSBY_COMPILED_MDX","dateElement","mdx","_post$mdx","frontmatter","_post$mdx$frontmatter","date","Row","FiCalendar","_post$mdx2","timeToRead","_post$mdx3","FiClock","timeToReadFromRemark","_post$mdx4","maxWidth","PageHeader","_post$mdx5","_post$mdx5$frontmatte","title","ErrorBoundary","PageLayout","SEO","titleMode","titleModeSuffix","description","_post$mdx2$frontmatte","summary","image","_post$mdx3$frontmatte","cover","_post$mdx3$frontmatte2","childImageSharp","_post$mdx3$frontmatte3","gatsbyImageData","_post$mdx3$frontmatte4","images","_post$mdx3$frontmatte5","fallback","_post$mdx3$frontmatte6","type","ogTypeArticle","InfoAlert","ErrorAlert","alertIcons","BsFillInfoCircleFill","size","BiErrorCircle","alertClasses","_this","state","hasError","getDerivedStateFromError","componentDidCatch","error","errorInfo","this","setState","render","Alert","classes","commonClasses","H","level","hLevel","responsive","remarkTimeToRead","Math","ceil","MDXContext","useMDXComponents","contextComponents"],"sourceRoot":""}
\ No newline at end of file
diff --git a/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js b/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js
similarity index 69%
rename from component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js
rename to component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js
index ef4f1a4..8ba1624 100644
--- a/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js
+++ b/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js
@@ -1,2 +1,2 @@
-(self.webpackChunkportfolio=self.webpackChunkportfolio||[]).push([[882],{3150:function(e,t,n){var a=n(9720).w_;e.exports.C=function(e){return a({tag:"svg",attr:{viewBox:"0 0 24 24"},child:[{tag:"path",attr:{d:"M11.953,2C6.465,2,2,6.486,2,12s4.486,10,10,10s10-4.486,10-10S17.493,2,11.953,2z M12,20c-4.411,0-8-3.589-8-8 s3.567-8,7.953-8C16.391,4,20,7.589,20,12S16.411,20,12,20z"}},{tag:"path",attr:{d:"M11 7H13V14H11zM11 15H13V17H11z"}}]})(e)}},9881:function(e,t,n){var a=n(9720).w_;e.exports.L=function(e){return a({tag:"svg",attr:{viewBox:"0 0 16 16",fill:"currentColor"},child:[{tag:"path",attr:{fillRule:"evenodd",d:"M8 16A8 8 0 108 0a8 8 0 000 16zm.93-9.412l-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM8 5.5a1 1 0 100-2 1 1 0 000 2z",clipRule:"evenodd"}}]})(e)}},4363:function(e,t,n){var a=n(9720).w_;e.exports.v=function(e){return a({tag:"svg",attr:{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"rect",attr:{x:"3",y:"4",width:"18",height:"18",rx:"2",ry:"2"}},{tag:"line",attr:{x1:"16",y1:"2",x2:"16",y2:"6"}},{tag:"line",attr:{x1:"8",y1:"2",x2:"8",y2:"6"}},{tag:"line",attr:{x1:"3",y1:"10",x2:"21",y2:"10"}}]})(e)}},550:function(e,t,n){var a=n(9720).w_;e.exports.T=function(e){return a({tag:"svg",attr:{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"circle",attr:{cx:"12",cy:"12",r:"10"}},{tag:"polyline",attr:{points:"12 6 12 12 16 14"}}]})(e)}},5225:function(e,t,n){"use strict";n.r(t),n.d(t,{default:function(){return c}});var a=n(1151),r=n(7294);function l(e){const t=Object.assign({h1:"h1",a:"a",span:"span",img:"img",p:"p",ul:"ul",li:"li",h3:"h3",ol:"ol",strong:"strong",h2:"h2"},(0,a.ah)(),e.components);return r.createElement(r.Fragment,null,r.createElement(t.h1,{id:"-overview",style:{position:"relative"}},"🌐 Overview",r.createElement(t.a,{href:"#-overview","aria-label":" overview permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.img,{src:"https://github.com/AwalHossain/video_streaming_service_server/assets/80216813/9e6b1889-c9d6-45d8-806e-27865f674912",alt:"Project Image"}),"\n",r.createElement(t.p,null,"MERN Video Streaming is a cutting-edge, open-source platform for video streaming, offering a comprehensive, full-stack solution utilizing the latest MERN stack technologies. With MERN Video Streaming, users can easily upload, manage, and stream videos on demand, providing a seamless experience. This project features a video processing capability that provides real-time notifications upon completion."),"\n",r.createElement(t.p,null,"The backend is comprised of three services, utilizing Redis messaging for communication. These include an API server, a video conversion service, and an HTTP server serving HLS video files. On the client side, the project uses create-react-app and MUI library, along with socket.io-client and React Context."),"\n",r.createElement(t.h1,{id:"-features",style:{position:"relative"}},"🌟 Features",r.createElement(t.a,{href:"#-features","aria-label":" features permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.ul,null,"\n",r.createElement(t.li,null,"Real-time video processing with notifications upon completion"),"\n",r.createElement(t.li,null,"Three-tier backend services for API, video conversion, and HTTP serving"),"\n",r.createElement(t.li,null,"Frontend built with create-react-app and MUI library"),"\n",r.createElement(t.li,null,"Real-time communication with the API server using socket.io-client and React Context"),"\n"),"\n",r.createElement(t.h1,{id:"️-architecture",style:{position:"relative"}},"🏗️ Architecture",r.createElement(t.a,{href:"#%EF%B8%8F-architecture","aria-label":"️ architecture permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.img,{src:"https://user-images.githubusercontent.com/497812/220627727-04a26928-71df-4c9b-9637-92289a2beee2.png",alt:"Architecture Image"}),"\n",r.createElement(t.h1,{id:"-backend-services",style:{position:"relative"}},"📡 Backend Services",r.createElement(t.a,{href:"#-backend-services","aria-label":" backend services permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.h3,{id:"️-api-server",style:{position:"relative"}},"🖥️ API Server",r.createElement(t.a,{href:"#%EF%B8%8F-api-server","aria-label":"️ api server permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.p,null,"The API server is an Expressjs app that uses Joi, Multer, BullMQ, Socket.io, and\nMongoDB driver. The server communicates with Redis to process and store data,\nand uses MongoDB as the primary database. The API server is responsible for the\nfollowing:"),"\n",r.createElement(t.ol,null,"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"User Authentication:")," Handles user registration, login, and JWT token generation."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Upload:")," Manages video uploads, stores video metadata in MongoDB, and sends a job to the video processing service."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Management:")," Provides endpoints for fetching video metadata, deleting videos, and fetching video streams."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Real-time Notifications:")," Sends real-time notifications to the client using socket.io upon video processing completion."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Job Queue Management:")," Manages the job queue using BullMQ, passing one job to the next upon completion."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Redis Communication:")," Communicates with Redis to store job data and send real-time notifications to the client."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Bucket Storage Integration:")," Upload completed video file into a CDN bucket storage to store video files, ensuring optimal streaming quality."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Streaming:")," Serves HLS video files to the client, allowing users to stream videos seamlessly."),"\n"),"\n",r.createElement(t.p,null,"The HTTP server communicates with Redis to fetch video metadata and stream video files.\nThis server is not exposed to the public internet, ensuring a secure video streaming pipeline."),"\n",r.createElement(t.h3,{id:"️-video-processing-service",style:{position:"relative"}},"🎞️ Video Processing Service",r.createElement(t.a,{href:"#%EF%B8%8F-video-processing-service","aria-label":"️ video processing service permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.p,null,"The Video Conversion Service is a Node.js process with ffmpeg responsible for converting videos and managing tasks with the BullMQ library.\nFirst of all, when user upload a video with an watermark image(optional), the API server sends a job to the video processing service. The job contains the video file, the watermark image, and the user ID. The video processing service then processes the video in three steps:"),"\n",r.createElement(t.ol,null,"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Conversion:")," Converts any format video into MP4 and applies a watermark if an image is provided."),"\n"),"\n",r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<span\n      class="gatsby-resp-image-wrapper"\n      style="position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 1000px; "\n    >\n      <span\n    class="gatsby-resp-image-background-image"\n    style="padding-bottom: 48%; position: relative; bottom: 0; left: 0; background-image: url(\'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAB+ElEQVR42nWS7UtTURzH97cEgYGQMVgU9GBiDy5GD658Y1FvohcFQUEaaZDiix4gIrBe9CLfZCOfZmnJMufGdXPT1rOZGFRWoNuuzvZwd++nc+/uYnfWgS+/c36/3/mc3zm/Y6t1NXDq7AU8vQN0P+5fo0c9AyLmNey/4rpOnj5HrdON83AjtmpnPa3t19GHpmmUj1xOIZvJoih5i1/PLWZfbGmnRnBc7mPYdtUJYNu1/wKVbJpcJkVeya6JFfMN4H43riPHsW3fc5DLVwvAj98ySDMpJmdXCZt6/SVNTOjV/G/Cn1KETEkzK0zNraIKZlOrXqEJ3LHv0N8r9wW+cv/5d7peLNDl+8ED3wI9wZ88jSZ4Ni3jCS7RHVjCI/TQv0h/KI7+Es2lQH1SBEofZAbDcYanEgxFEvhiSfxvZcbfp/C/W2H0zbIB1jUUTRrrfHmFFqC4bl8oyZOojHdSZiSmQ8Q89MvYPBJbxhtJMigO65UWGY7GyeZUmlraqKkzm1IAFt5Q1fROalYJn6qkhVUt/tL+NV/pQP9+B46esFaoqqqQVvgSpTI7quZVI+/z7BwdYs/NG7fpvHuP+oZGHFt3sq16L7bdgnzm/CXGghOMBSRelsnwjRfsqD/IRGSaW3c6Wbe+gg2VG6morKLKvplNdgd2xxb+AL3wgHSOYXE+AAAAAElFTkSuQmCC\'); background-size: cover; display: block;"\n  ></span>\n  <img\n        class="gatsby-resp-image-image"\n        alt="video-conversion"\n        title=""\n        src="/static/d6a4a8af05899993666207a38a052a6a/00d43/up.png"\n        srcset="/static/d6a4a8af05899993666207a38a052a6a/63868/up.png 250w,\n/static/d6a4a8af05899993666207a38a052a6a/0b533/up.png 500w,\n/static/d6a4a8af05899993666207a38a052a6a/00d43/up.png 1000w,\n/static/d6a4a8af05899993666207a38a052a6a/6edca/up.png 1351w"\n        sizes="(max-width: 1000px) 100vw, 1000px"\n        style="width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"\n        loading="lazy"\n        decoding="async"\n      />\n    </span>'}}),"\n",r.createElement(t.ol,{start:"2"},"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Adaptive Bitrate Processing:")," Transforms the video into adaptive bitrate HLS format (480p & 1080p) for optimal streaming quality."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"CDN Upload:")," Upon successful conversion, the video is uploaded to a CDN bucket storage. This allows users to stream videos seamlessly from anywhere in the world."),"\n"),"\n",r.createElement(t.p,null,"The video processing service communicates with the API server using Redis messaging to send real-time notifications upon completion."),"\n",r.createElement(t.h1,{id:"-frontend",style:{position:"relative"}},"📱 Frontend",r.createElement(t.a,{href:"#-frontend","aria-label":" frontend permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.h2,{id:"-upload",style:{position:"relative"}},"📥 Upload",r.createElement(t.a,{href:"#-upload","aria-label":" upload permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.p,null,"To upload a video with watermark image, the user must first register and login. After logging in, the user can upload a video with an optional watermark image.\nThe video is then processed and uploaded to the CDN bucket storage. Upon completion every process, the user receives a real-time notification."),"\n",r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<span\n      class="gatsby-resp-image-wrapper"\n      style="position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 1000px; "\n    >\n      <span\n    class="gatsby-resp-image-background-image"\n    style="padding-bottom: 49.6%; position: relative; bottom: 0; left: 0; background-image: url(\'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAAA7DAAAOwwHHb6hkAAACdklEQVR42k2S7UtTYRiH9ycEfuijJAUFQSAkDBMhUntRTEzISaJooKBiL5SKiqWbiC+E6VBrajQyUsPQ1KVGkVomhSZYIpaNCjN1O9vZ2Tnb7Oqc5cQPP57z/O5zX8/93PejcwgyokfBH9hG8fnx+QP4QqsqzQtpN7bzrez5R3B72HS60DkEEZdbQpIVvLIPUfLi2ZHo0STh9oT20k5MVj0pGHeLnqDvEsUgQ2f/ucba+maQrsGcgpsNhxDUluo5BBcbmw7+OFwIKkBL2pVXQVG2kX0B9YZaxT50WqJWgWZoJ5WW3STjQgp5mQYsbWba330jqW+BMtsXumZXaf9sp2FumYaPS1g/zDEx85ih0U56bc2s/JpB5xalYPlaL7xembgYPfojBzhx9CD5WQYuD80S3T7MxeZHtA++IH96EcPwNKmDU1SMTVFgzCC/PJGz+eEMTlrRyYoPTUGgLJN9KZ20xDgMyWe4ca2Qgoc9xBrriTXV0GjtpHLqE0UjKujZS6p7+iltbaL4jokrxjhGX3Wj2ztFDfzjt5P1LVGtWp2+JLH6fRVR7ZXnL2wKTuxfFxEUtV/qXnRtsby0wIYUQPKrr8Tv3wsMqEA10T6BtNLP/HgH4wNdbNjneTrQwtiwhTe2XmqryjCbSrhbU4LF3MxAdx02axPPO0wsvX8dAmpX3kZSK5ptS2O68hBFsfswnNbzdtJMeVYUdZnRPLFUER8ZQWFsONej93MrJ5mK9OO0FCdhTDzMQOvt/8BQDz3qcGrz4ik/F4YhKoz086e4X51NW0oMV3NOklWUSm5CJA9y9VQnRFBfmMaIuZDBujyqUo/Rd6+Rf+quiH3us8W/AAAAAElFTkSuQmCC\'); background-size: cover; display: block;"\n  ></span>\n  <img\n        class="gatsby-resp-image-image"\n        alt="home-page"\n        title=""\n        src="/static/473ab1fa48833a7445ed2581a60fb278/00d43/cover.png"\n        srcset="/static/473ab1fa48833a7445ed2581a60fb278/63868/cover.png 250w,\n/static/473ab1fa48833a7445ed2581a60fb278/0b533/cover.png 500w,\n/static/473ab1fa48833a7445ed2581a60fb278/00d43/cover.png 1000w,\n/static/473ab1fa48833a7445ed2581a60fb278/9ba38/cover.png 1329w"\n        sizes="(max-width: 1000px) 100vw, 1000px"\n        style="width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"\n        loading="lazy"\n        decoding="async"\n      />\n    </span>'}}),"\n",r.createElement(t.p,null,"Below some feature of the frontend part of the project:"),"\n",r.createElement(t.ul,null,"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Search:")," Look for videos by typing in their title."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Filter:")," Pick videos based on specific tags."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Sorting:")," Put videos in order by date, views, likes, etc."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Edit Video metadata:")," User can edit the video title, description, tag etc."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Tag:")," Add tags to group your videos together."),"\n"),"\n",r.createElement(t.h2,{id:"️-streaming",style:{position:"relative"}},"📽️ Streaming",r.createElement(t.a,{href:"#%EF%B8%8F-streaming","aria-label":"️ streaming permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.p,null,"User will able to see their uploaded videos and stream them. The video player is built with HLS.js, allowing for seamless video streaming.\nThis player has a built-in adaptive bitrate feature, ensuring optimal streaming quality. User can easily switch to different video quality options.\nDepend on user internet speed, the video player will automatically switch to the best quality."),"\n",r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<span\n      class="gatsby-resp-image-wrapper"\n      style="position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 1000px; "\n    >\n      <span\n    class="gatsby-resp-image-background-image"\n    style="padding-bottom: 48.800000000000004%; position: relative; bottom: 0; left: 0; background-image: url(\'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAAA7DAAAOwwHHb6hkAAACnklEQVR42pWSa0uTARTH96ZvEL3sA/SiVxFFzOWtlS11j5aP87I23dyal6bTKYpJpgQlhmUZupnO2zQNgyhISDAKKiGlqKQgKEYznaVOt2eXX4/r8r4Dh3M4HA6//5+jCIb4r4jFYsTj8UQfl/twNMzmWoDAsh+f34/CO9yP1+tlaHgEz4CbEY+HQZebyfExhj2j9LpcuN19DA0OcPW6vDt5n+mpCbyD/UyN3+erL4bPt81qIM6Ll29RVBlzKcnPoUjM5XiaEo1GiybjFKZsNaJWQ4XZxOAtN/WOVhS7DyHqK+nquU1ZWQUOm50vvjCBH0FiMvHC4hsU1aWFGArPohfzsRn1OG1WGuw2anLUWDNUNDucdDovcrGujV17DpNXXMW9aS8jYx7m5mZY/h6V87dvH5aWUJgKdBj1JaSmZ1JVUkBb62VaOke50NSKet9eVKokrFqRm84WDu9PQhBLePR4kvef5nnydIaVwBabwW2kSISwFEFRbq+lpr4B8zkbztYumnse0HjrIefbXQiCQLpShV1XRqOlkmNpahoaGvHc6cPV3cnE6AgB2btv/jDrGxEi0ahMaCqkvMKE2V5HdccEBY4OiuxtGOzNFAgitjNm9GdyyRZySFELWIwGclOPkK08QLWllOBWjJ/rW4TCkQSlIk+rJl19kkxtHkZbLdpCC0npJ0g9qiJTeZDT2iyUySmczNCQrEqm6dIVeuY/c212kdmFjyz7JZlOShyTdiQ7Ks9RZinHYrZi1IlkZQpohdPk54sYDHosJjM6XTFWq4WaynLae90Yp5+R1TnAjSEv6+sh2cOthH9SRJa8urbBz40gIXmwg70dkohGY/8eOf63/nnmrxub9L1+R/fzee6+WmRtLcLKqpQ4GA5L/AJQgkG4HTSpQgAAAABJRU5ErkJggg==\'); background-size: cover; display: block;"\n  ></span>\n  <img\n        class="gatsby-resp-image-image"\n        alt="video-player"\n        title=""\n        src="/static/1e8d680dc35f92e358a59fd2bbc4a2f8/00d43/pl.png"\n        srcset="/static/1e8d680dc35f92e358a59fd2bbc4a2f8/63868/pl.png 250w,\n/static/1e8d680dc35f92e358a59fd2bbc4a2f8/0b533/pl.png 500w,\n/static/1e8d680dc35f92e358a59fd2bbc4a2f8/00d43/pl.png 1000w,\n/static/1e8d680dc35f92e358a59fd2bbc4a2f8/b1584/pl.png 1342w"\n        sizes="(max-width: 1000px) 100vw, 1000px"\n        style="width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"\n        loading="lazy"\n        decoding="async"\n      />\n    </span>'}}),"\n",r.createElement(t.p,null,"On the right side of the video player, user can see the related videos.\nBelow the video player, user can see the video details."),"\n",r.createElement(t.h2,{id:"-upcoming-update-",style:{position:"relative"}},"🚀** Upcoming Update **",r.createElement(t.a,{href:"#-upcoming-update-","aria-label":" upcoming update  permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.p,null,"Oviously This project isn't done yet, there are lot other features that can be added to this project. Here are some of the features that I'm planning to add in the future:"),"\n",r.createElement(t.ul,null,"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"User Profile:")," User can see their profile and update their profile."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Analytics:")," User can see the video analytics like views, likes, comments etc."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Comment:")," User can comment on the video."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Like:")," User can like the video."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Share:")," User can share the video."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Playlist:")," User can create playlist and add video to the playlist."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Subscription:")," User can subscribe to the channel and get notification when the channel upload a new video."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Notification:")," User can get notification when someone like, comment, share their video."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Embed:")," User can embed the video to their website."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Download:")," User can download the video."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Edit:")," User can edit the video title, description, tag etc."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Delete:")," User can delete the video."),"\n"),"\n",r.createElement(t.h2,{id:"-technologies-used",style:{position:"relative"}},"🤖 Technologies Used",r.createElement(t.a,{href:"#-technologies-used","aria-label":" technologies used permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.ul,null,"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Backend:")," TypeScript, Node.js, Express.js,ffmpeg, MongoDB, Redis, BullMQ, Socket.io, AWS S3, ffmpeg, HLS.js"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Frontend:")," React, MUI, HLS.js, socket.io-client, React Context"),"\n"),"\n",r.createElement(t.h2,{id:"-github",style:{position:"relative"}},"👨🏻‍💻 Github",r.createElement(t.a,{href:"#-github","aria-label":" github permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement("a",{href:"https://github.com/AwalHossain/video_streaming_service_server",target:"_blank"},r.createElement(t.p,null,"Video Streaming Service Server")),"\n",r.createElement("a",{href:"https://github.com/AwalHossain/video_streaming_client",target:"_blank"},r.createElement(t.p,null,"Video Streaming Service Client")))}var i=function(e){void 0===e&&(e={});const{wrapper:t}=Object.assign({},(0,a.ah)(),e.components);return t?r.createElement(t,e,r.createElement(l,e)):l(e)},o=n(7084);console.log("3821838164","checking post template query");const s=e=>{const{data:t,children:n}=e;return r.createElement(o.Z,{post:t}," ",n," ")};function c(e){return r.createElement(s,e,r.createElement(i,e))}},7084:function(e,t,n){"use strict";n.d(t,{Z:function(){return h}});var a=n(7294),r=n(4363),l=n(550),i=n(2717),o=n(8288),s=n(9737),c=n(5103);var d=e=>{var t,n,d,m,u,h,p;const{post:g,children:v}=e,f=null!=g&&null!==(t=g.mdx)&&void 0!==t&&null!==(n=t.frontmatter)&&void 0!==n&&n.date?a.createElement(c.Z,{className:"mr-6 mb-6 text-gray-500 text-sm"},a.createElement(r.v,{className:"mr-1"}),null==g||null===(d=g.mdx)||void 0===d?void 0:d.frontmatter.date):null,E=null!=g&&null!==(m=g.mdx)&&void 0!==m&&m.timeToRead?a.createElement(c.Z,null,a.createElement(l.T,{className:"mr-1"}),(0,i.j)(null==g||null===(u=g.mdx)||void 0===u?void 0:u.timeToRead)," min to read"):null;return a.createElement("div",{className:"flex flex-col items-center"},a.createElement("article",{className:"w-full prose prose-sm sm:prose overflow-hidden prose-red",style:{maxWidth:"860px"}},a.createElement(s.Z,null,(null===(h=g.mdx)||void 0===h||null===(p=h.frontmatter)||void 0===p?void 0:p.title)||""),a.createElement(c.Z,null,f,E),a.createElement(o.Z,null,v)))},m=n(7170),u=n(7943);var h=e=>{var t,n,r,l,i,o,s,c,h,p,g;const{post:v,children:f}=e;return console.log(v,"post",f,"children"),a.createElement(m.Z,null,a.createElement(u.ZP,{title:(null===(t=v.mdx)||void 0===t||null===(n=t.frontmatter)||void 0===n?void 0:n.title)||"",titleMode:u.H0,description:(null===(r=v.mdx)||void 0===r||null===(l=r.frontmatter)||void 0===l?void 0:l.summary)||"",image:(null===(i=v.mdx)||void 0===i||null===(o=i.frontmatter)||void 0===o||null===(s=o.cover)||void 0===s||null===(c=s.childImageSharp)||void 0===c||null===(h=c.gatsbyImageData)||void 0===h||null===(p=h.images)||void 0===p||null===(g=p.fallback)||void 0===g?void 0:g.src)||"",type:u.Sp}),a.createElement(d,{post:v},f),a.createElement("div",{className:"flex flex-row justify-center items-center mt-16"},a.createElement("div",{className:"max-w-md"})))}},2091:function(e,t,n){"use strict";n.d(t,{hW:function(){return s}});var a=n(3150),r=n(9881),l=n(7294),i=n(5103);const o="info",s="error",c={[o]:l.createElement(r.L,{size:18}),[s]:l.createElement(a.C,{size:18})},d={[o]:"text-blue-600 bg-blue-100",[s]:"text-red-600 bg-red-100"};t.ZP=e=>{const{children:t,type:n}=e;return t?l.createElement("div",{className:"py-3 px-4 rounded-md "+d[n]},l.createElement(i.Z,null,l.createElement("div",{className:"mr-3"},c[n]),l.createElement("div",{className:"text-sm"},t))):null}},8288:function(e,t,n){"use strict";var a=n(4578),r=n(7294),l=n(2091);let i=function(e){function t(t){var n;return(n=e.call(this,t)||this).state={hasError:!1},n}(0,a.Z)(t,e),t.getDerivedStateFromError=function(){return{hasError:!0}};var n=t.prototype;return n.componentDidCatch=function(e,t){console.error(e,t),this.setState({hasError:!0})},n.render=function(){const{children:e}=this.props,{hasError:t}=this.state;return t?r.createElement(l.ZP,{type:l.hW},"Component has crashed"):e},t}(r.Component);t.Z=i},9737:function(e,t,n){"use strict";var a=n(7294),r=n(4519);t.Z=e=>{const{children:t,className:n=""}=e,l="mb-6 uppercase font-extrabold "+n;return a.createElement(r.Z,{level:r._.h1,className:l},t)}},5103:function(e,t,n){"use strict";var a=n(7294);t.Z=e=>{const{children:t,className:n="",responsive:r=!1,style:l={}}=e;if(!t)return null;const i=r?"flex flex-col sm:flex-row items-center":"flex flex-row items-center";return a.createElement("div",{style:l,className:i+" "+n},t)}},2717:function(e,t,n){"use strict";n.d(t,{j:function(){return a}});const a=e=>{if("number"!=typeof e)return null;return Math.ceil(1*e)||1}},1151:function(e,t,n){"use strict";n.d(t,{ah:function(){return l}});var a=n(7294);const r=a.createContext({});function l(e){const t=a.useContext(r);return a.useMemo((()=>"function"==typeof e?e(t):{...t,...e}),[t,e])}}}]);
-//# sourceMappingURL=component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js.map
\ No newline at end of file
+(self.webpackChunkportfolio=self.webpackChunkportfolio||[]).push([[882],{3150:function(e,t,n){var a=n(9720).w_;e.exports.C=function(e){return a({tag:"svg",attr:{viewBox:"0 0 24 24"},child:[{tag:"path",attr:{d:"M11.953,2C6.465,2,2,6.486,2,12s4.486,10,10,10s10-4.486,10-10S17.493,2,11.953,2z M12,20c-4.411,0-8-3.589-8-8 s3.567-8,7.953-8C16.391,4,20,7.589,20,12S16.411,20,12,20z"}},{tag:"path",attr:{d:"M11 7H13V14H11zM11 15H13V17H11z"}}]})(e)}},9881:function(e,t,n){var a=n(9720).w_;e.exports.L=function(e){return a({tag:"svg",attr:{viewBox:"0 0 16 16",fill:"currentColor"},child:[{tag:"path",attr:{fillRule:"evenodd",d:"M8 16A8 8 0 108 0a8 8 0 000 16zm.93-9.412l-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM8 5.5a1 1 0 100-2 1 1 0 000 2z",clipRule:"evenodd"}}]})(e)}},4363:function(e,t,n){var a=n(9720).w_;e.exports.v=function(e){return a({tag:"svg",attr:{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"rect",attr:{x:"3",y:"4",width:"18",height:"18",rx:"2",ry:"2"}},{tag:"line",attr:{x1:"16",y1:"2",x2:"16",y2:"6"}},{tag:"line",attr:{x1:"8",y1:"2",x2:"8",y2:"6"}},{tag:"line",attr:{x1:"3",y1:"10",x2:"21",y2:"10"}}]})(e)}},550:function(e,t,n){var a=n(9720).w_;e.exports.T=function(e){return a({tag:"svg",attr:{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"circle",attr:{cx:"12",cy:"12",r:"10"}},{tag:"polyline",attr:{points:"12 6 12 12 16 14"}}]})(e)}},5225:function(e,t,n){"use strict";n.r(t),n.d(t,{default:function(){return c}});var a=n(1151),r=n(7294);function l(e){const t=Object.assign({h1:"h1",a:"a",span:"span",img:"img",p:"p",ul:"ul",li:"li",h3:"h3",ol:"ol",strong:"strong",h2:"h2"},(0,a.ah)(),e.components);return r.createElement(r.Fragment,null,r.createElement(t.h1,{id:"-overview",style:{position:"relative"}},"🌐 Overview",r.createElement(t.a,{href:"#-overview","aria-label":" overview permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.img,{src:"https://github.com/AwalHossain/video_streaming_service_server/assets/80216813/9e6b1889-c9d6-45d8-806e-27865f674912",alt:"Project Image"}),"\n",r.createElement(t.p,null,"MERN Video Streaming is a cutting-edge, open-source platform for video streaming, offering a comprehensive, full-stack solution utilizing the latest MERN stack technologies. With MERN Video Streaming, users can easily upload, manage, and stream videos on demand, providing a seamless experience. This project features a video processing capability that provides real-time notifications upon completion."),"\n",r.createElement(t.p,null,"The backend is comprised of three services, utilizing Redis messaging for communication. These include an API server, a video conversion service, and an HTTP server serving HLS video files. On the client side, the project uses create-react-app and MUI library, along with socket.io-client and React Context."),"\n",r.createElement(t.h1,{id:"-features",style:{position:"relative"}},"🌟 Features",r.createElement(t.a,{href:"#-features","aria-label":" features permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.ul,null,"\n",r.createElement(t.li,null,"Real-time video processing with notifications upon completion"),"\n",r.createElement(t.li,null,"Three-tier backend services for API, video conversion, and HTTP serving"),"\n",r.createElement(t.li,null,"Frontend built with create-react-app and MUI library"),"\n",r.createElement(t.li,null,"Real-time communication with the API server using socket.io-client and React Context"),"\n"),"\n",r.createElement(t.h1,{id:"️-architecture",style:{position:"relative"}},"🏗️ Architecture",r.createElement(t.a,{href:"#%EF%B8%8F-architecture","aria-label":"️ architecture permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.img,{src:"https://user-images.githubusercontent.com/497812/220627727-04a26928-71df-4c9b-9637-92289a2beee2.png",alt:"Architecture Image"}),"\n",r.createElement(t.h1,{id:"-backend-services",style:{position:"relative"}},"📡 Backend Services",r.createElement(t.a,{href:"#-backend-services","aria-label":" backend services permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.h3,{id:"️-api-server",style:{position:"relative"}},"🖥️ API Server",r.createElement(t.a,{href:"#%EF%B8%8F-api-server","aria-label":"️ api server permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.p,null,"The API server is an Expressjs app that uses Joi, Multer, BullMQ, Socket.io, and\nMongoDB driver. The server communicates with Redis to process and store data,\nand uses MongoDB as the primary database. The API server is responsible for the\nfollowing:"),"\n",r.createElement(t.ol,null,"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"User Authentication:")," Handles user registration, login, and JWT token generation."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Upload:")," Manages video uploads, stores video metadata in MongoDB, and sends a job to the video processing service."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Management:")," Provides endpoints for fetching video metadata, deleting videos, and fetching video streams."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Real-time Notifications:")," Sends real-time notifications to the client using socket.io upon video processing completion."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Job Queue Management:")," Manages the job queue using BullMQ, passing one job to the next upon completion."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Redis Communication:")," Communicates with Redis to store job data and send real-time notifications to the client."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Bucket Storage Integration:")," Upload completed video file into a CDN bucket storage to store video files, ensuring optimal streaming quality."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Streaming:")," Serves HLS video files to the client, allowing users to stream videos seamlessly."),"\n"),"\n",r.createElement(t.p,null,"The HTTP server communicates with Redis to fetch video metadata and stream video files.\nThis server is not exposed to the public internet, ensuring a secure video streaming pipeline."),"\n",r.createElement(t.h3,{id:"️-video-processing-service",style:{position:"relative"}},"🎞️ Video Processing Service",r.createElement(t.a,{href:"#%EF%B8%8F-video-processing-service","aria-label":"️ video processing service permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.p,null,"The Video Conversion Service is a Node.js process with ffmpeg responsible for converting videos and managing tasks with the BullMQ library.\nFirst of all, when user upload a video with an watermark image(optional), the API server sends a job to the video processing service. The job contains the video file, the watermark image, and the user ID. The video processing service then processes the video in three steps:"),"\n",r.createElement(t.ol,null,"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Conversion:")," Converts any format video into MP4 and applies a watermark if an image is provided."),"\n"),"\n",r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<span\n      class="gatsby-resp-image-wrapper"\n      style="position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 1000px; "\n    >\n      <span\n    class="gatsby-resp-image-background-image"\n    style="padding-bottom: 48%; position: relative; bottom: 0; left: 0; background-image: url(\'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAB+ElEQVR42nWS7UtTURzH97cEgYGQMVgU9GBiDy5GD658Y1FvohcFQUEaaZDiix4gIrBe9CLfZCOfZmnJMufGdXPT1rOZGFRWoNuuzvZwd++nc+/uYnfWgS+/c36/3/mc3zm/Y6t1NXDq7AU8vQN0P+5fo0c9AyLmNey/4rpOnj5HrdON83AjtmpnPa3t19GHpmmUj1xOIZvJoih5i1/PLWZfbGmnRnBc7mPYdtUJYNu1/wKVbJpcJkVeya6JFfMN4H43riPHsW3fc5DLVwvAj98ySDMpJmdXCZt6/SVNTOjV/G/Cn1KETEkzK0zNraIKZlOrXqEJ3LHv0N8r9wW+cv/5d7peLNDl+8ED3wI9wZ88jSZ4Ni3jCS7RHVjCI/TQv0h/KI7+Es2lQH1SBEofZAbDcYanEgxFEvhiSfxvZcbfp/C/W2H0zbIB1jUUTRrrfHmFFqC4bl8oyZOojHdSZiSmQ8Q89MvYPBJbxhtJMigO65UWGY7GyeZUmlraqKkzm1IAFt5Q1fROalYJn6qkhVUt/tL+NV/pQP9+B46esFaoqqqQVvgSpTI7quZVI+/z7BwdYs/NG7fpvHuP+oZGHFt3sq16L7bdgnzm/CXGghOMBSRelsnwjRfsqD/IRGSaW3c6Wbe+gg2VG6morKLKvplNdgd2xxb+AL3wgHSOYXE+AAAAAElFTkSuQmCC\'); background-size: cover; display: block;"\n  ></span>\n  <img\n        class="gatsby-resp-image-image"\n        alt="video-conversion"\n        title=""\n        src="/static/d6a4a8af05899993666207a38a052a6a/00d43/up.png"\n        srcset="/static/d6a4a8af05899993666207a38a052a6a/63868/up.png 250w,\n/static/d6a4a8af05899993666207a38a052a6a/0b533/up.png 500w,\n/static/d6a4a8af05899993666207a38a052a6a/00d43/up.png 1000w,\n/static/d6a4a8af05899993666207a38a052a6a/6edca/up.png 1351w"\n        sizes="(max-width: 1000px) 100vw, 1000px"\n        style="width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"\n        loading="lazy"\n        decoding="async"\n      />\n    </span>'}}),"\n",r.createElement(t.ol,{start:"2"},"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Adaptive Bitrate Processing:")," Transforms the video into adaptive bitrate HLS format (480p & 1080p) for optimal streaming quality."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"CDN Upload:")," Upon successful conversion, the video is uploaded to a CDN bucket storage. This allows users to stream videos seamlessly from anywhere in the world."),"\n"),"\n",r.createElement(t.p,null,"The video processing service communicates with the API server using Redis messaging to send real-time notifications upon completion."),"\n",r.createElement(t.h1,{id:"-frontend",style:{position:"relative"}},"📱 Frontend",r.createElement(t.a,{href:"#-frontend","aria-label":" frontend permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.h2,{id:"-upload",style:{position:"relative"}},"📥 Upload",r.createElement(t.a,{href:"#-upload","aria-label":" upload permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.p,null,"To upload a video with watermark image, the user must first register and login. After logging in, the user can upload a video with an optional watermark image.\nThe video is then processed and uploaded to the CDN bucket storage. Upon completion every process, the user receives a real-time notification."),"\n",r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<span\n      class="gatsby-resp-image-wrapper"\n      style="position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 1000px; "\n    >\n      <span\n    class="gatsby-resp-image-background-image"\n    style="padding-bottom: 49.6%; position: relative; bottom: 0; left: 0; background-image: url(\'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAAA7DAAAOwwHHb6hkAAACdklEQVR42k2S7UtTYRiH9ycEfuijJAUFQSAkDBMhUntRTEzISaJooKBiL5SKiqWbiC+E6VBrajQyUsPQ1KVGkVomhSZYIpaNCjN1O9vZ2Tnb7Oqc5cQPP57z/O5zX8/93PejcwgyokfBH9hG8fnx+QP4QqsqzQtpN7bzrez5R3B72HS60DkEEZdbQpIVvLIPUfLi2ZHo0STh9oT20k5MVj0pGHeLnqDvEsUgQ2f/ucba+maQrsGcgpsNhxDUluo5BBcbmw7+OFwIKkBL2pVXQVG2kX0B9YZaxT50WqJWgWZoJ5WW3STjQgp5mQYsbWba330jqW+BMtsXumZXaf9sp2FumYaPS1g/zDEx85ih0U56bc2s/JpB5xalYPlaL7xembgYPfojBzhx9CD5WQYuD80S3T7MxeZHtA++IH96EcPwNKmDU1SMTVFgzCC/PJGz+eEMTlrRyYoPTUGgLJN9KZ20xDgMyWe4ca2Qgoc9xBrriTXV0GjtpHLqE0UjKujZS6p7+iltbaL4jokrxjhGX3Wj2ztFDfzjt5P1LVGtWp2+JLH6fRVR7ZXnL2wKTuxfFxEUtV/qXnRtsby0wIYUQPKrr8Tv3wsMqEA10T6BtNLP/HgH4wNdbNjneTrQwtiwhTe2XmqryjCbSrhbU4LF3MxAdx02axPPO0wsvX8dAmpX3kZSK5ptS2O68hBFsfswnNbzdtJMeVYUdZnRPLFUER8ZQWFsONej93MrJ5mK9OO0FCdhTDzMQOvt/8BQDz3qcGrz4ik/F4YhKoz086e4X51NW0oMV3NOklWUSm5CJA9y9VQnRFBfmMaIuZDBujyqUo/Rd6+Rf+quiH3us8W/AAAAAElFTkSuQmCC\'); background-size: cover; display: block;"\n  ></span>\n  <img\n        class="gatsby-resp-image-image"\n        alt="home-page"\n        title=""\n        src="/static/473ab1fa48833a7445ed2581a60fb278/00d43/cover.png"\n        srcset="/static/473ab1fa48833a7445ed2581a60fb278/63868/cover.png 250w,\n/static/473ab1fa48833a7445ed2581a60fb278/0b533/cover.png 500w,\n/static/473ab1fa48833a7445ed2581a60fb278/00d43/cover.png 1000w,\n/static/473ab1fa48833a7445ed2581a60fb278/9ba38/cover.png 1329w"\n        sizes="(max-width: 1000px) 100vw, 1000px"\n        style="width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"\n        loading="lazy"\n        decoding="async"\n      />\n    </span>'}}),"\n",r.createElement(t.p,null,"Below some feature of the frontend part of the project:"),"\n",r.createElement(t.ul,null,"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Search:")," Look for videos by typing in their title."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Filter:")," Pick videos based on specific tags."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Sorting:")," Put videos in order by date, views, likes, etc."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Edit Video metadata:")," User can edit the video title, description, tag etc."),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Tag:")," Add tags to group your videos together."),"\n"),"\n",r.createElement(t.h2,{id:"️-streaming",style:{position:"relative"}},"📽️ Streaming",r.createElement(t.a,{href:"#%EF%B8%8F-streaming","aria-label":"️ streaming permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.p,null,"User will able to see their uploaded videos and stream them. The video player is built with HLS.js, allowing for seamless video streaming.\nThis player has a built-in adaptive bitrate feature, ensuring optimal streaming quality. User can easily switch to different video quality options.\nDepend on user internet speed, the video player will automatically switch to the best quality."),"\n",r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<span\n      class="gatsby-resp-image-wrapper"\n      style="position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 1000px; "\n    >\n      <span\n    class="gatsby-resp-image-background-image"\n    style="padding-bottom: 48.800000000000004%; position: relative; bottom: 0; left: 0; background-image: url(\'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAAA7DAAAOwwHHb6hkAAACnklEQVR42pWSa0uTARTH96ZvEL3sA/SiVxFFzOWtlS11j5aP87I23dyal6bTKYpJpgQlhmUZupnO2zQNgyhISDAKKiGlqKQgKEYznaVOt2eXX4/r8r4Dh3M4HA6//5+jCIb4r4jFYsTj8UQfl/twNMzmWoDAsh+f34/CO9yP1+tlaHgEz4CbEY+HQZebyfExhj2j9LpcuN19DA0OcPW6vDt5n+mpCbyD/UyN3+erL4bPt81qIM6Ll29RVBlzKcnPoUjM5XiaEo1GiybjFKZsNaJWQ4XZxOAtN/WOVhS7DyHqK+nquU1ZWQUOm50vvjCBH0FiMvHC4hsU1aWFGArPohfzsRn1OG1WGuw2anLUWDNUNDucdDovcrGujV17DpNXXMW9aS8jYx7m5mZY/h6V87dvH5aWUJgKdBj1JaSmZ1JVUkBb62VaOke50NSKet9eVKokrFqRm84WDu9PQhBLePR4kvef5nnydIaVwBabwW2kSISwFEFRbq+lpr4B8zkbztYumnse0HjrIefbXQiCQLpShV1XRqOlkmNpahoaGvHc6cPV3cnE6AgB2btv/jDrGxEi0ahMaCqkvMKE2V5HdccEBY4OiuxtGOzNFAgitjNm9GdyyRZySFELWIwGclOPkK08QLWllOBWjJ/rW4TCkQSlIk+rJl19kkxtHkZbLdpCC0npJ0g9qiJTeZDT2iyUySmczNCQrEqm6dIVeuY/c212kdmFjyz7JZlOShyTdiQ7Ks9RZinHYrZi1IlkZQpohdPk54sYDHosJjM6XTFWq4WaynLae90Yp5+R1TnAjSEv6+sh2cOthH9SRJa8urbBz40gIXmwg70dkohGY/8eOf63/nnmrxub9L1+R/fzee6+WmRtLcLKqpQ4GA5L/AJQgkG4HTSpQgAAAABJRU5ErkJggg==\'); background-size: cover; display: block;"\n  ></span>\n  <img\n        class="gatsby-resp-image-image"\n        alt="video-player"\n        title=""\n        src="/static/1e8d680dc35f92e358a59fd2bbc4a2f8/00d43/pl.png"\n        srcset="/static/1e8d680dc35f92e358a59fd2bbc4a2f8/63868/pl.png 250w,\n/static/1e8d680dc35f92e358a59fd2bbc4a2f8/0b533/pl.png 500w,\n/static/1e8d680dc35f92e358a59fd2bbc4a2f8/00d43/pl.png 1000w,\n/static/1e8d680dc35f92e358a59fd2bbc4a2f8/b1584/pl.png 1342w"\n        sizes="(max-width: 1000px) 100vw, 1000px"\n        style="width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"\n        loading="lazy"\n        decoding="async"\n      />\n    </span>'}}),"\n",r.createElement(t.p,null,"On the right side of the video player, user can see the related videos.\nBelow the video player, user can see the video details."),"\n",r.createElement(t.h2,{id:"-upcoming-update-",style:{position:"relative"}},"🚀** Upcoming Update **",r.createElement(t.a,{href:"#-upcoming-update-","aria-label":" upcoming update  permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.p,null,"This project is a work in progress, and there's so much more we can do to enhance it! Here are some of the features we're planning to add in the future. We'd love to hear your thoughts on these:"),"\n",r.createElement(t.ul,null,"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"User Profile:")," How about a feature where users can view and update their profiles?"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Analytics:")," Wouldn't it be great to see analytics like views, likes, and comments for each video?"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Comment:")," How important do you think it is for users to be able to comment on videos?"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Like:")," Should users be able to like videos?"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Share:")," What about sharing videos? How often do you share videos you enjoy?"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Playlist:")," How about creating playlists and adding videos to them?"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Subscription:")," Should users be able to subscribe to channels and receive notifications for new uploads?"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Notification:")," How would you feel about getting notifications when someone likes, comments, or shares your video?"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Embed:")," Should users be able to embed videos on their websites?"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Download:")," How about a feature for downloading videos?"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Edit:")," Should users be able to edit video titles, descriptions, tags, etc.?"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Video Delete:")," How important is it for users to be able to delete their videos?"),"\n"),"\n",r.createElement(t.p,null,"We're excited about these potential features and would love to hear your feedback. Which of these features are you most interested in? Are there any other features you'd like to see added?"),"\n",r.createElement(t.h2,{id:"-technologies-used",style:{position:"relative"}},"🤖 Technologies Used",r.createElement(t.a,{href:"#-technologies-used","aria-label":" technologies used permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.ul,null,"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Backend:")," TypeScript, Node.js, Express.js,ffmpeg, MongoDB, Redis, BullMQ, Socket.io, AWS S3, ffmpeg, HLS.js"),"\n",r.createElement(t.li,null,r.createElement(t.strong,null,"Frontend:")," React, MUI, HLS.js, socket.io-client, React Context"),"\n"),"\n",r.createElement(t.h2,{id:"-github",style:{position:"relative"}},"👨🏻‍💻 Github",r.createElement(t.a,{href:"#-github","aria-label":" github permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement("a",{href:"https://github.com/AwalHossain/video_streaming_service_server",target:"_blank"},r.createElement(t.p,null,"Video Streaming Service Server")),"\n",r.createElement("a",{href:"https://github.com/AwalHossain/video_streaming_client",target:"_blank"},r.createElement(t.p,null,"Video Streaming Service Client")),"\n",r.createElement(t.h2,{id:"-video-explanation",style:{position:"relative"}},"📹 Video Explanation",r.createElement(t.a,{href:"#-video-explanation","aria-label":" video explanation permalink",className:"gatsby-remark-autolink-header-anchor after"},r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<svg aria-hidden="true" focusable="false" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>'}}))),"\n",r.createElement(t.p,null,"Here is the video explanation of the project where i've explained How the web application works and how the backend services are communicating with each other.Hope this\nwill help you to understand the project better."),"\n",r.createElement("iframe",{width:"80%",height:"315",src:"https://www.youtube.com/embed/RCRwublmR9E?si=kN1RwckxAq2zIKEm",title:"YouTube video player",frameborder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",allowfullscreen:!0}))}var i=function(e){void 0===e&&(e={});const{wrapper:t}=Object.assign({},(0,a.ah)(),e.components);return t?r.createElement(t,e,r.createElement(l,e)):l(e)},o=n(7084);console.log("3821838164","checking post template query");const s=e=>{const{data:t,children:n}=e;return r.createElement(o.Z,{post:t}," ",n," ")};function c(e){return r.createElement(s,e,r.createElement(i,e))}},7084:function(e,t,n){"use strict";n.d(t,{Z:function(){return h}});var a=n(7294),r=n(4363),l=n(550),i=n(2717),o=n(8288),s=n(9737),c=n(5103);var d=e=>{var t,n,d,m,u,h,p;const{post:g,children:v}=e,f=null!=g&&null!==(t=g.mdx)&&void 0!==t&&null!==(n=t.frontmatter)&&void 0!==n&&n.date?a.createElement(c.Z,{className:"mr-6 mb-6 text-gray-500 text-sm"},a.createElement(r.v,{className:"mr-1"}),null==g||null===(d=g.mdx)||void 0===d?void 0:d.frontmatter.date):null,b=null!=g&&null!==(m=g.mdx)&&void 0!==m&&m.timeToRead?a.createElement(c.Z,null,a.createElement(l.T,{className:"mr-1"}),(0,i.j)(null==g||null===(u=g.mdx)||void 0===u?void 0:u.timeToRead)," min to read"):null;return a.createElement("div",{className:"flex flex-col items-center"},a.createElement("article",{className:"w-full prose prose-sm sm:prose overflow-hidden prose-red",style:{maxWidth:"860px"}},a.createElement(s.Z,null,(null===(h=g.mdx)||void 0===h||null===(p=h.frontmatter)||void 0===p?void 0:p.title)||""),a.createElement(c.Z,null,f,b),a.createElement(o.Z,null,v)))},m=n(7170),u=n(7943);var h=e=>{var t,n,r,l,i,o,s,c,h,p,g;const{post:v,children:f}=e;return console.log(v,"post",f,"children"),a.createElement(m.Z,null,a.createElement(u.ZP,{title:(null===(t=v.mdx)||void 0===t||null===(n=t.frontmatter)||void 0===n?void 0:n.title)||"",titleMode:u.H0,description:(null===(r=v.mdx)||void 0===r||null===(l=r.frontmatter)||void 0===l?void 0:l.summary)||"",image:(null===(i=v.mdx)||void 0===i||null===(o=i.frontmatter)||void 0===o||null===(s=o.cover)||void 0===s||null===(c=s.childImageSharp)||void 0===c||null===(h=c.gatsbyImageData)||void 0===h||null===(p=h.images)||void 0===p||null===(g=p.fallback)||void 0===g?void 0:g.src)||"",type:u.Sp}),a.createElement(d,{post:v},f),a.createElement("div",{className:"flex flex-row justify-center items-center mt-16"},a.createElement("div",{className:"max-w-md"})))}},2091:function(e,t,n){"use strict";n.d(t,{hW:function(){return s}});var a=n(3150),r=n(9881),l=n(7294),i=n(5103);const o="info",s="error",c={[o]:l.createElement(r.L,{size:18}),[s]:l.createElement(a.C,{size:18})},d={[o]:"text-blue-600 bg-blue-100",[s]:"text-red-600 bg-red-100"};t.ZP=e=>{const{children:t,type:n}=e;return t?l.createElement("div",{className:"py-3 px-4 rounded-md "+d[n]},l.createElement(i.Z,null,l.createElement("div",{className:"mr-3"},c[n]),l.createElement("div",{className:"text-sm"},t))):null}},8288:function(e,t,n){"use strict";var a=n(4578),r=n(7294),l=n(2091);let i=function(e){function t(t){var n;return(n=e.call(this,t)||this).state={hasError:!1},n}(0,a.Z)(t,e),t.getDerivedStateFromError=function(){return{hasError:!0}};var n=t.prototype;return n.componentDidCatch=function(e,t){console.error(e,t),this.setState({hasError:!0})},n.render=function(){const{children:e}=this.props,{hasError:t}=this.state;return t?r.createElement(l.ZP,{type:l.hW},"Component has crashed"):e},t}(r.Component);t.Z=i},9737:function(e,t,n){"use strict";var a=n(7294),r=n(4519);t.Z=e=>{const{children:t,className:n=""}=e,l="mb-6 uppercase font-extrabold "+n;return a.createElement(r.Z,{level:r._.h1,className:l},t)}},5103:function(e,t,n){"use strict";var a=n(7294);t.Z=e=>{const{children:t,className:n="",responsive:r=!1,style:l={}}=e;if(!t)return null;const i=r?"flex flex-col sm:flex-row items-center":"flex flex-row items-center";return a.createElement("div",{style:l,className:i+" "+n},t)}},2717:function(e,t,n){"use strict";n.d(t,{j:function(){return a}});const a=e=>{if("number"!=typeof e)return null;return Math.ceil(1*e)||1}},1151:function(e,t,n){"use strict";n.d(t,{ah:function(){return l}});var a=n(7294);const r=a.createContext({});function l(e){const t=a.useContext(r);return a.useMemo((()=>"function"==typeof e?e(t):{...t,...e}),[t,e])}}}]);
+//# sourceMappingURL=component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js.map
\ No newline at end of file
diff --git a/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js.map b/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js.map
new file mode 100644
index 0000000..1bc9ef0
--- /dev/null
+++ b/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js.map
@@ -0,0 +1 @@
+{"version":3,"file":"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js","mappings":"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","sources":["webpack://portfolio/./node_modules/@react-icons/all-files/bi/BiErrorCircle.js","webpack://portfolio/./node_modules/@react-icons/all-files/bs/BsFillInfoCircleFill.js","webpack://portfolio/./node_modules/@react-icons/all-files/fi/FiCalendar.js","webpack://portfolio/./node_modules/@react-icons/all-files/fi/FiClock.js","webpack://portfolio/./src/posts/2024/streaming/index.mdx","webpack://portfolio/./src/templates/Post.tsx","webpack://portfolio/./src/components/elements/Post.tsx","webpack://portfolio/./src/components/screens/PostScreen.tsx","webpack://portfolio/./src/components/shared/Alert.tsx","webpack://portfolio/./src/components/shared/ErrorBoundary.tsx","webpack://portfolio/./src/components/shared/PageHeader.tsx","webpack://portfolio/./src/components/shared/Row.tsx","webpack://portfolio/./src/utils/time.ts","webpack://portfolio/./node_modules/@mdx-js/react/lib/index.js"],"sourcesContent":["// THIS FILE IS AUTO GENERATED\nvar GenIcon = require('../lib').GenIcon\nmodule.exports.BiErrorCircle = function BiErrorCircle (props) {\n  return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M11.953,2C6.465,2,2,6.486,2,12s4.486,10,10,10s10-4.486,10-10S17.493,2,11.953,2z M12,20c-4.411,0-8-3.589-8-8 s3.567-8,7.953-8C16.391,4,20,7.589,20,12S16.411,20,12,20z\"}},{\"tag\":\"path\",\"attr\":{\"d\":\"M11 7H13V14H11zM11 15H13V17H11z\"}}]})(props);\n};\n","// THIS FILE IS AUTO GENERATED\nvar GenIcon = require('../lib').GenIcon\nmodule.exports.BsFillInfoCircleFill = function BsFillInfoCircleFill (props) {\n  return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 16 16\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"fillRule\":\"evenodd\",\"d\":\"M8 16A8 8 0 108 0a8 8 0 000 16zm.93-9.412l-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM8 5.5a1 1 0 100-2 1 1 0 000 2z\",\"clipRule\":\"evenodd\"}}]})(props);\n};\n","// THIS FILE IS AUTO GENERATED\nvar GenIcon = require('../lib').GenIcon\nmodule.exports.FiCalendar = function FiCalendar (props) {\n  return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":\"2\",\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\"},\"child\":[{\"tag\":\"rect\",\"attr\":{\"x\":\"3\",\"y\":\"4\",\"width\":\"18\",\"height\":\"18\",\"rx\":\"2\",\"ry\":\"2\"}},{\"tag\":\"line\",\"attr\":{\"x1\":\"16\",\"y1\":\"2\",\"x2\":\"16\",\"y2\":\"6\"}},{\"tag\":\"line\",\"attr\":{\"x1\":\"8\",\"y1\":\"2\",\"x2\":\"8\",\"y2\":\"6\"}},{\"tag\":\"line\",\"attr\":{\"x1\":\"3\",\"y1\":\"10\",\"x2\":\"21\",\"y2\":\"10\"}}]})(props);\n};\n","// THIS FILE IS AUTO GENERATED\nvar GenIcon = require('../lib').GenIcon\nmodule.exports.FiClock = function FiClock (props) {\n  return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":\"2\",\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\"},\"child\":[{\"tag\":\"circle\",\"attr\":{\"cx\":\"12\",\"cy\":\"12\",\"r\":\"10\"}},{\"tag\":\"polyline\",\"attr\":{\"points\":\"12 6 12 12 16 14\"}}]})(props);\n};\n","/*@jsxRuntime classic @jsx React.createElement @jsxFrag React.Fragment*/\nimport {useMDXComponents as _provideComponents} from \"@mdx-js/react\";\nimport React from \"react\";\nfunction _createMdxContent(props) {\n  const _components = Object.assign({\n    h1: \"h1\",\n    a: \"a\",\n    span: \"span\",\n    img: \"img\",\n    p: \"p\",\n    ul: \"ul\",\n    li: \"li\",\n    h3: \"h3\",\n    ol: \"ol\",\n    strong: \"strong\",\n    h2: \"h2\"\n  }, _provideComponents(), props.components);\n  return React.createElement(React.Fragment, null, React.createElement(_components.h1, {\n    id: \"-overview\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🌐 Overview\", React.createElement(_components.a, {\n    href: \"#-overview\",\n    \"aria-label\": \" overview permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.img, {\n    src: \"https://github.com/AwalHossain/video_streaming_service_server/assets/80216813/9e6b1889-c9d6-45d8-806e-27865f674912\",\n    alt: \"Project Image\"\n  }), \"\\n\", React.createElement(_components.p, null, \"MERN Video Streaming is a cutting-edge, open-source platform for video streaming, offering a comprehensive, full-stack solution utilizing the latest MERN stack technologies. With MERN Video Streaming, users can easily upload, manage, and stream videos on demand, providing a seamless experience. This project features a video processing capability that provides real-time notifications upon completion.\"), \"\\n\", React.createElement(_components.p, null, \"The backend is comprised of three services, utilizing Redis messaging for communication. These include an API server, a video conversion service, and an HTTP server serving HLS video files. On the client side, the project uses create-react-app and MUI library, along with socket.io-client and React Context.\"), \"\\n\", React.createElement(_components.h1, {\n    id: \"-features\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🌟 Features\", React.createElement(_components.a, {\n    href: \"#-features\",\n    \"aria-label\": \" features permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.ul, null, \"\\n\", React.createElement(_components.li, null, \"Real-time video processing with notifications upon completion\"), \"\\n\", React.createElement(_components.li, null, \"Three-tier backend services for API, video conversion, and HTTP serving\"), \"\\n\", React.createElement(_components.li, null, \"Frontend built with create-react-app and MUI library\"), \"\\n\", React.createElement(_components.li, null, \"Real-time communication with the API server using socket.io-client and React Context\"), \"\\n\"), \"\\n\", React.createElement(_components.h1, {\n    id: \"️-architecture\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🏗️ Architecture\", React.createElement(_components.a, {\n    href: \"#%EF%B8%8F-architecture\",\n    \"aria-label\": \"️ architecture permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.img, {\n    src: \"https://user-images.githubusercontent.com/497812/220627727-04a26928-71df-4c9b-9637-92289a2beee2.png\",\n    alt: \"Architecture Image\"\n  }), \"\\n\", React.createElement(_components.h1, {\n    id: \"-backend-services\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"📡 Backend Services\", React.createElement(_components.a, {\n    href: \"#-backend-services\",\n    \"aria-label\": \" backend services permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.h3, {\n    id: \"️-api-server\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🖥️ API Server\", React.createElement(_components.a, {\n    href: \"#%EF%B8%8F-api-server\",\n    \"aria-label\": \"️ api server permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.p, null, \"The API server is an Expressjs app that uses Joi, Multer, BullMQ, Socket.io, and\\nMongoDB driver. The server communicates with Redis to process and store data,\\nand uses MongoDB as the primary database. The API server is responsible for the\\nfollowing:\"), \"\\n\", React.createElement(_components.ol, null, \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"User Authentication:\"), \" Handles user registration, login, and JWT token generation.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Upload:\"), \" Manages video uploads, stores video metadata in MongoDB, and sends a job to the video processing service.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Management:\"), \" Provides endpoints for fetching video metadata, deleting videos, and fetching video streams.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Real-time Notifications:\"), \" Sends real-time notifications to the client using socket.io upon video processing completion.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Job Queue Management:\"), \" Manages the job queue using BullMQ, passing one job to the next upon completion.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Redis Communication:\"), \" Communicates with Redis to store job data and send real-time notifications to the client.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Bucket Storage Integration:\"), \" Upload completed video file into a CDN bucket storage to store video files, ensuring optimal streaming quality.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Streaming:\"), \" Serves HLS video files to the client, allowing users to stream videos seamlessly.\"), \"\\n\"), \"\\n\", React.createElement(_components.p, null, \"The HTTP server communicates with Redis to fetch video metadata and stream video files.\\nThis server is not exposed to the public internet, ensuring a secure video streaming pipeline.\"), \"\\n\", React.createElement(_components.h3, {\n    id: \"️-video-processing-service\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🎞️ Video Processing Service\", React.createElement(_components.a, {\n    href: \"#%EF%B8%8F-video-processing-service\",\n    \"aria-label\": \"️ video processing service permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.p, null, \"The Video Conversion Service is a Node.js process with ffmpeg responsible for converting videos and managing tasks with the BullMQ library.\\nFirst of all, when user upload a video with an watermark image(optional), the API server sends a job to the video processing service. The job contains the video file, the watermark image, and the user ID. The video processing service then processes the video in three steps:\"), \"\\n\", React.createElement(_components.ol, null, \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Conversion:\"), \" Converts any format video into MP4 and applies a watermark if an image is provided.\"), \"\\n\"), \"\\n\", React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<span\\n      class=\\\"gatsby-resp-image-wrapper\\\"\\n      style=\\\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 1000px; \\\"\\n    >\\n      <span\\n    class=\\\"gatsby-resp-image-background-image\\\"\\n    style=\\\"padding-bottom: 48%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAB+ElEQVR42nWS7UtTURzH97cEgYGQMVgU9GBiDy5GD658Y1FvohcFQUEaaZDiix4gIrBe9CLfZCOfZmnJMufGdXPT1rOZGFRWoNuuzvZwd++nc+/uYnfWgS+/c36/3/mc3zm/Y6t1NXDq7AU8vQN0P+5fo0c9AyLmNey/4rpOnj5HrdON83AjtmpnPa3t19GHpmmUj1xOIZvJoih5i1/PLWZfbGmnRnBc7mPYdtUJYNu1/wKVbJpcJkVeya6JFfMN4H43riPHsW3fc5DLVwvAj98ySDMpJmdXCZt6/SVNTOjV/G/Cn1KETEkzK0zNraIKZlOrXqEJ3LHv0N8r9wW+cv/5d7peLNDl+8ED3wI9wZ88jSZ4Ni3jCS7RHVjCI/TQv0h/KI7+Es2lQH1SBEofZAbDcYanEgxFEvhiSfxvZcbfp/C/W2H0zbIB1jUUTRrrfHmFFqC4bl8oyZOojHdSZiSmQ8Q89MvYPBJbxhtJMigO65UWGY7GyeZUmlraqKkzm1IAFt5Q1fROalYJn6qkhVUt/tL+NV/pQP9+B46esFaoqqqQVvgSpTI7quZVI+/z7BwdYs/NG7fpvHuP+oZGHFt3sq16L7bdgnzm/CXGghOMBSRelsnwjRfsqD/IRGSaW3c6Wbe+gg2VG6morKLKvplNdgd2xxb+AL3wgHSOYXE+AAAAAElFTkSuQmCC'); background-size: cover; display: block;\\\"\\n  ></span>\\n  <img\\n        class=\\\"gatsby-resp-image-image\\\"\\n        alt=\\\"video-conversion\\\"\\n        title=\\\"\\\"\\n        src=\\\"/static/d6a4a8af05899993666207a38a052a6a/00d43/up.png\\\"\\n        srcset=\\\"/static/d6a4a8af05899993666207a38a052a6a/63868/up.png 250w,\\n/static/d6a4a8af05899993666207a38a052a6a/0b533/up.png 500w,\\n/static/d6a4a8af05899993666207a38a052a6a/00d43/up.png 1000w,\\n/static/d6a4a8af05899993666207a38a052a6a/6edca/up.png 1351w\\\"\\n        sizes=\\\"(max-width: 1000px) 100vw, 1000px\\\"\\n        style=\\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\\"\\n        loading=\\\"lazy\\\"\\n        decoding=\\\"async\\\"\\n      />\\n    </span>\"\n    }\n  }), \"\\n\", React.createElement(_components.ol, {\n    start: \"2\"\n  }, \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Adaptive Bitrate Processing:\"), \" Transforms the video into adaptive bitrate HLS format (480p & 1080p) for optimal streaming quality.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"CDN Upload:\"), \" Upon successful conversion, the video is uploaded to a CDN bucket storage. This allows users to stream videos seamlessly from anywhere in the world.\"), \"\\n\"), \"\\n\", React.createElement(_components.p, null, \"The video processing service communicates with the API server using Redis messaging to send real-time notifications upon completion.\"), \"\\n\", React.createElement(_components.h1, {\n    id: \"-frontend\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"📱 Frontend\", React.createElement(_components.a, {\n    href: \"#-frontend\",\n    \"aria-label\": \" frontend permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.h2, {\n    id: \"-upload\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"📥 Upload\", React.createElement(_components.a, {\n    href: \"#-upload\",\n    \"aria-label\": \" upload permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.p, null, \"To upload a video with watermark image, the user must first register and login. After logging in, the user can upload a video with an optional watermark image.\\nThe video is then processed and uploaded to the CDN bucket storage. Upon completion every process, the user receives a real-time notification.\"), \"\\n\", React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<span\\n      class=\\\"gatsby-resp-image-wrapper\\\"\\n      style=\\\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 1000px; \\\"\\n    >\\n      <span\\n    class=\\\"gatsby-resp-image-background-image\\\"\\n    style=\\\"padding-bottom: 49.6%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAAA7DAAAOwwHHb6hkAAACdklEQVR42k2S7UtTYRiH9ycEfuijJAUFQSAkDBMhUntRTEzISaJooKBiL5SKiqWbiC+E6VBrajQyUsPQ1KVGkVomhSZYIpaNCjN1O9vZ2Tnb7Oqc5cQPP57z/O5zX8/93PejcwgyokfBH9hG8fnx+QP4QqsqzQtpN7bzrez5R3B72HS60DkEEZdbQpIVvLIPUfLi2ZHo0STh9oT20k5MVj0pGHeLnqDvEsUgQ2f/ucba+maQrsGcgpsNhxDUluo5BBcbmw7+OFwIKkBL2pVXQVG2kX0B9YZaxT50WqJWgWZoJ5WW3STjQgp5mQYsbWba330jqW+BMtsXumZXaf9sp2FumYaPS1g/zDEx85ih0U56bc2s/JpB5xalYPlaL7xembgYPfojBzhx9CD5WQYuD80S3T7MxeZHtA++IH96EcPwNKmDU1SMTVFgzCC/PJGz+eEMTlrRyYoPTUGgLJN9KZ20xDgMyWe4ca2Qgoc9xBrriTXV0GjtpHLqE0UjKujZS6p7+iltbaL4jokrxjhGX3Wj2ztFDfzjt5P1LVGtWp2+JLH6fRVR7ZXnL2wKTuxfFxEUtV/qXnRtsby0wIYUQPKrr8Tv3wsMqEA10T6BtNLP/HgH4wNdbNjneTrQwtiwhTe2XmqryjCbSrhbU4LF3MxAdx02axPPO0wsvX8dAmpX3kZSK5ptS2O68hBFsfswnNbzdtJMeVYUdZnRPLFUER8ZQWFsONej93MrJ5mK9OO0FCdhTDzMQOvt/8BQDz3qcGrz4ik/F4YhKoz086e4X51NW0oMV3NOklWUSm5CJA9y9VQnRFBfmMaIuZDBujyqUo/Rd6+Rf+quiH3us8W/AAAAAElFTkSuQmCC'); background-size: cover; display: block;\\\"\\n  ></span>\\n  <img\\n        class=\\\"gatsby-resp-image-image\\\"\\n        alt=\\\"home-page\\\"\\n        title=\\\"\\\"\\n        src=\\\"/static/473ab1fa48833a7445ed2581a60fb278/00d43/cover.png\\\"\\n        srcset=\\\"/static/473ab1fa48833a7445ed2581a60fb278/63868/cover.png 250w,\\n/static/473ab1fa48833a7445ed2581a60fb278/0b533/cover.png 500w,\\n/static/473ab1fa48833a7445ed2581a60fb278/00d43/cover.png 1000w,\\n/static/473ab1fa48833a7445ed2581a60fb278/9ba38/cover.png 1329w\\\"\\n        sizes=\\\"(max-width: 1000px) 100vw, 1000px\\\"\\n        style=\\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\\"\\n        loading=\\\"lazy\\\"\\n        decoding=\\\"async\\\"\\n      />\\n    </span>\"\n    }\n  }), \"\\n\", React.createElement(_components.p, null, \"Below some feature of the frontend part of the project:\"), \"\\n\", React.createElement(_components.ul, null, \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Search:\"), \" Look for videos by typing in their title.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Filter:\"), \" Pick videos based on specific tags.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Sorting:\"), \" Put videos in order by date, views, likes, etc.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Edit Video metadata:\"), \" User can edit the video title, description, tag etc.\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Tag:\"), \" Add tags to group your videos together.\"), \"\\n\"), \"\\n\", React.createElement(_components.h2, {\n    id: \"️-streaming\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"📽️ Streaming\", React.createElement(_components.a, {\n    href: \"#%EF%B8%8F-streaming\",\n    \"aria-label\": \"️ streaming permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.p, null, \"User will able to see their uploaded videos and stream them. The video player is built with HLS.js, allowing for seamless video streaming.\\nThis player has a built-in adaptive bitrate feature, ensuring optimal streaming quality. User can easily switch to different video quality options.\\nDepend on user internet speed, the video player will automatically switch to the best quality.\"), \"\\n\", React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<span\\n      class=\\\"gatsby-resp-image-wrapper\\\"\\n      style=\\\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 1000px; \\\"\\n    >\\n      <span\\n    class=\\\"gatsby-resp-image-background-image\\\"\\n    style=\\\"padding-bottom: 48.800000000000004%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAAA7DAAAOwwHHb6hkAAACnklEQVR42pWSa0uTARTH96ZvEL3sA/SiVxFFzOWtlS11j5aP87I23dyal6bTKYpJpgQlhmUZupnO2zQNgyhISDAKKiGlqKQgKEYznaVOt2eXX4/r8r4Dh3M4HA6//5+jCIb4r4jFYsTj8UQfl/twNMzmWoDAsh+f34/CO9yP1+tlaHgEz4CbEY+HQZebyfExhj2j9LpcuN19DA0OcPW6vDt5n+mpCbyD/UyN3+erL4bPt81qIM6Ll29RVBlzKcnPoUjM5XiaEo1GiybjFKZsNaJWQ4XZxOAtN/WOVhS7DyHqK+nquU1ZWQUOm50vvjCBH0FiMvHC4hsU1aWFGArPohfzsRn1OG1WGuw2anLUWDNUNDucdDovcrGujV17DpNXXMW9aS8jYx7m5mZY/h6V87dvH5aWUJgKdBj1JaSmZ1JVUkBb62VaOke50NSKet9eVKokrFqRm84WDu9PQhBLePR4kvef5nnydIaVwBabwW2kSISwFEFRbq+lpr4B8zkbztYumnse0HjrIefbXQiCQLpShV1XRqOlkmNpahoaGvHc6cPV3cnE6AgB2btv/jDrGxEi0ahMaCqkvMKE2V5HdccEBY4OiuxtGOzNFAgitjNm9GdyyRZySFELWIwGclOPkK08QLWllOBWjJ/rW4TCkQSlIk+rJl19kkxtHkZbLdpCC0npJ0g9qiJTeZDT2iyUySmczNCQrEqm6dIVeuY/c212kdmFjyz7JZlOShyTdiQ7Ks9RZinHYrZi1IlkZQpohdPk54sYDHosJjM6XTFWq4WaynLae90Yp5+R1TnAjSEv6+sh2cOthH9SRJa8urbBz40gIXmwg70dkohGY/8eOf63/nnmrxub9L1+R/fzee6+WmRtLcLKqpQ4GA5L/AJQgkG4HTSpQgAAAABJRU5ErkJggg=='); background-size: cover; display: block;\\\"\\n  ></span>\\n  <img\\n        class=\\\"gatsby-resp-image-image\\\"\\n        alt=\\\"video-player\\\"\\n        title=\\\"\\\"\\n        src=\\\"/static/1e8d680dc35f92e358a59fd2bbc4a2f8/00d43/pl.png\\\"\\n        srcset=\\\"/static/1e8d680dc35f92e358a59fd2bbc4a2f8/63868/pl.png 250w,\\n/static/1e8d680dc35f92e358a59fd2bbc4a2f8/0b533/pl.png 500w,\\n/static/1e8d680dc35f92e358a59fd2bbc4a2f8/00d43/pl.png 1000w,\\n/static/1e8d680dc35f92e358a59fd2bbc4a2f8/b1584/pl.png 1342w\\\"\\n        sizes=\\\"(max-width: 1000px) 100vw, 1000px\\\"\\n        style=\\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\\"\\n        loading=\\\"lazy\\\"\\n        decoding=\\\"async\\\"\\n      />\\n    </span>\"\n    }\n  }), \"\\n\", React.createElement(_components.p, null, \"On the right side of the video player, user can see the related videos.\\nBelow the video player, user can see the video details.\"), \"\\n\", React.createElement(_components.h2, {\n    id: \"-upcoming-update-\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🚀** Upcoming Update **\", React.createElement(_components.a, {\n    href: \"#-upcoming-update-\",\n    \"aria-label\": \" upcoming update  permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.p, null, \"This project is a work in progress, and there's so much more we can do to enhance it! Here are some of the features we're planning to add in the future. We'd love to hear your thoughts on these:\"), \"\\n\", React.createElement(_components.ul, null, \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"User Profile:\"), \" How about a feature where users can view and update their profiles?\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Analytics:\"), \" Wouldn't it be great to see analytics like views, likes, and comments for each video?\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Comment:\"), \" How important do you think it is for users to be able to comment on videos?\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Like:\"), \" Should users be able to like videos?\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Share:\"), \" What about sharing videos? How often do you share videos you enjoy?\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Playlist:\"), \" How about creating playlists and adding videos to them?\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Subscription:\"), \" Should users be able to subscribe to channels and receive notifications for new uploads?\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Notification:\"), \" How would you feel about getting notifications when someone likes, comments, or shares your video?\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Embed:\"), \" Should users be able to embed videos on their websites?\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Download:\"), \" How about a feature for downloading videos?\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Edit:\"), \" Should users be able to edit video titles, descriptions, tags, etc.?\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Video Delete:\"), \" How important is it for users to be able to delete their videos?\"), \"\\n\"), \"\\n\", React.createElement(_components.p, null, \"We're excited about these potential features and would love to hear your feedback. Which of these features are you most interested in? Are there any other features you'd like to see added?\"), \"\\n\", React.createElement(_components.h2, {\n    id: \"-technologies-used\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"🤖 Technologies Used\", React.createElement(_components.a, {\n    href: \"#-technologies-used\",\n    \"aria-label\": \" technologies used permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.ul, null, \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Backend:\"), \" TypeScript, Node.js, Express.js,ffmpeg, MongoDB, Redis, BullMQ, Socket.io, AWS S3, ffmpeg, HLS.js\"), \"\\n\", React.createElement(_components.li, null, React.createElement(_components.strong, null, \"Frontend:\"), \" React, MUI, HLS.js, socket.io-client, React Context\"), \"\\n\"), \"\\n\", React.createElement(_components.h2, {\n    id: \"-github\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"👨🏻‍💻 Github\", React.createElement(_components.a, {\n    href: \"#-github\",\n    \"aria-label\": \" github permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(\"a\", {\n    href: \"https://github.com/AwalHossain/video_streaming_service_server\",\n    target: \"_blank\"\n  }, React.createElement(_components.p, null, \"Video Streaming Service Server\")), \"\\n\", React.createElement(\"a\", {\n    href: \"https://github.com/AwalHossain/video_streaming_client\",\n    target: \"_blank\"\n  }, React.createElement(_components.p, null, \"Video Streaming Service Client\")), \"\\n\", React.createElement(_components.h2, {\n    id: \"-video-explanation\",\n    style: {\n      position: \"relative\"\n    }\n  }, \"📹 Video Explanation\", React.createElement(_components.a, {\n    href: \"#-video-explanation\",\n    \"aria-label\": \" video explanation permalink\",\n    className: \"gatsby-remark-autolink-header-anchor after\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<svg aria-hidden=\\\"true\\\" focusable=\\\"false\\\" height=\\\"16\\\" version=\\\"1.1\\\" viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\"><path fill-rule=\\\"evenodd\\\" d=\\\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\\\"></path></svg>\"\n    }\n  }))), \"\\n\", React.createElement(_components.p, null, \"Here is the video explanation of the project where i've explained How the web application works and how the backend services are communicating with each other.Hope this\\nwill help you to understand the project better.\"), \"\\n\", React.createElement(\"iframe\", {\n    width: \"80%\",\n    height: \"315\",\n    src: \"https://www.youtube.com/embed/RCRwublmR9E?si=kN1RwckxAq2zIKEm\",\n    title: \"YouTube video player\",\n    frameborder: \"0\",\n    allow: \"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\",\n    allowfullscreen: true\n  }));\n}\nfunction MDXContent(props = {}) {\n  const {wrapper: MDXLayout} = Object.assign({}, _provideComponents(), props.components);\n  return MDXLayout ? React.createElement(MDXLayout, props, React.createElement(_createMdxContent, props)) : _createMdxContent(props);\n}\nexport default MDXContent;\n","import GATSBY_COMPILED_MDX from \"/home/runner/work/awalhossain.github.io/awalhossain.github.io/src/posts/2024/streaming/index.mdx\";\nimport React from 'react';\nimport PostScreen from '../components/screens/PostScreen';\nconst query = \"3821838164\";\nconsole.log(query, 'checking post template query');\nconst Post = props => {\n  const {data, children} = props;\n  return React.createElement(PostScreen, {\n    post: data\n  }, \" \", children, \" \");\n};\nPost\nexport default function GatsbyMDXWrapper(props) {\n  return React.createElement(Post, props, React.createElement(GATSBY_COMPILED_MDX, props));\n}\n","import { FiCalendar } from '@react-icons/all-files/fi/FiCalendar';\nimport { FiClock } from '@react-icons/all-files/fi/FiClock';\nimport React from 'react';\nimport { PostTemplateQuery } from '../../templates/__generated__/PostTemplateQuer';\nimport { timeToReadFromRemark } from '../../utils/time';\nimport ErrorBoundary from '../shared/ErrorBoundary';\nimport PageHeader from '../shared/PageHeader';\nimport Row from '../shared/Row';\n\ntype PostProps = {\n    post: PostTemplateQuery,\n    children: React.ReactNode,\n};\n\nconst Post = (props: PostProps): React.ReactElement | null => {\n  const { post, children } = props;\n\n  const dateElement = post?.mdx?.frontmatter?.date ? (\n    <Row className=\"mr-6 mb-6 text-gray-500 text-sm\">\n      <FiCalendar className=\"mr-1\" />\n      {post?.mdx?.frontmatter.date}\n    </Row>\n  ) : null;\n\n  const timeToRead = post?.mdx?.timeToRead ? (\n    <Row>\n      <FiClock className=\"mr-1\" />\n      {timeToReadFromRemark(post?.mdx?.timeToRead)} min to read\n    </Row>\n  ) : null;\n\n  return (\n    <div className=\"flex flex-col items-center\">\n      <article className=\"w-full prose prose-sm sm:prose overflow-hidden prose-red\" style={{ maxWidth: '860px' }}>\n        <PageHeader>{post.mdx?.frontmatter?.title || ''}</PageHeader>\n        <Row>\n          {dateElement}\n          {timeToRead}\n        </Row>\n        <ErrorBoundary>\n          {children}\n        </ErrorBoundary>\n      </article>\n    </div>\n  );\n};\n\nexport default Post;\n","import React from 'react';\nimport { PostTemplateQuery } from '../../templates/__generated__/PostTemplateQuer';\nimport Post from '../elements/Post';\nimport PageLayout from '../layouts/PageLayout';\nimport SEO, { ogTypeArticle, titleModeSuffix } from '../shared/SEO';\n\ntype PostProps = {\n    post: PostTemplateQuery,\n    children?: React.ReactNode\n}\n\nconst PostScreen = (props: PostProps): React.ReactElement => {\n  const { post, children } = props;\n\n  console.log(post, 'post', children, 'children');\n\n  return (\n    <PageLayout>\n      <SEO\n        title={post.mdx?.frontmatter?.title || ''}\n        titleMode={titleModeSuffix}\n        description={post.mdx?.frontmatter?.summary || ''}\n        image={post.mdx?.frontmatter?.cover?.childImageSharp?.gatsbyImageData?.images?.fallback?.src || ''}\n        type={ogTypeArticle}\n      />\n      <Post post={post}>{children}</Post>\n      <div className=\"flex flex-row justify-center items-center mt-16\">\n        <div className=\"max-w-md\" />\n      </div>\n    </PageLayout>\n  );\n};\n\nexport default PostScreen;\n","import { BiErrorCircle } from '@react-icons/all-files/bi/BiErrorCircle';\nimport { BsFillInfoCircleFill } from '@react-icons/all-files/bs/BsFillInfoCircleFill';\nimport React from 'react';\n\nimport Row from './Row';\n\ntype AlertType = 'error' | 'info';\n\ntype AlertProps = {\n    type: AlertType,\n    children: React.ReactNode | null,\n};\n\ntype alertIcons = Record<AlertType, React.ReactNode>;\n\ntype alertClasses = Record<AlertType, string>;\n\nexport const InfoAlert: AlertType = 'info';\nexport const ErrorAlert: AlertType = 'error';\n\nconst alertIcons: alertIcons = {\n  [InfoAlert]: <BsFillInfoCircleFill size={18} />,\n  [ErrorAlert]: <BiErrorCircle size={18} />,\n};\n\nconst alertClasses: alertClasses = {\n  [InfoAlert]: 'text-blue-600 bg-blue-100',\n  [ErrorAlert]: 'text-red-600 bg-red-100',\n};\n\nconst Alert = (props: AlertProps): React.ReactElement | null => {\n  const { children, type } = props;\n\n  if (!children) {\n    return null;\n  }\n\n  return (\n    <div className={`py-3 px-4 rounded-md ${alertClasses[type]}`}>\n      <Row>\n        <div className=\"mr-3\">\n          {alertIcons[type]}\n        </div>\n        <div className=\"text-sm\">\n          {children}\n        </div>\n      </Row>\n    </div>\n  );\n};\n\nexport default Alert;\n","import React, { ErrorInfo } from 'react';\nimport Alert, { ErrorAlert } from './Alert';\n\ntype Props = {\n    children: React.ReactNode,\n};\n\ntype State = {\n    hasError: boolean,\n};\n\nclass ErrorBoundary extends React.Component<Props, State> {\n  constructor(props: Props) {\n    super(props);\n    this.state = {\n      hasError: false,\n    };\n  }\n\n  static getDerivedStateFromError(): State {\n    // Update state so the next render will show the fallback UI.\n    return {\n      hasError: true,\n    };\n  }\n\n  componentDidCatch(error: Error, errorInfo: ErrorInfo): void {\n    // You can also log the error to an error reporting service.\n    // eslint-disable-next-line no-console\n    console.error(error, errorInfo);\n    this.setState({ hasError: true });\n  }\n\n  render(): React.ReactNode {\n    const { children } = this.props;\n    const { hasError } = this.state;\n\n    if (hasError) {\n      // You can render any custom fallback UI\n      return (\n        <Alert type={ErrorAlert}>\n          Component has crashed\n        </Alert>\n      );\n    }\n\n    return children;\n  }\n}\n\nexport default ErrorBoundary;\n","import React from 'react';\nimport H, { hLevel } from './H';\n\ntype PageHeaderProps = {\n    children: React.ReactNode,\n    className?: string,\n};\n\nconst PageHeader = (props: PageHeaderProps): React.ReactElement | null => {\n  const { children, className = '' } = props;\n  const commonClasses = 'mb-6 uppercase font-extrabold';\n\n  const classes = `${commonClasses} ${className}`;\n  return (\n    <H level={hLevel.h1} className={classes}>\n      {children}\n    </H>\n  );\n};\n\nexport default PageHeader;\n","import React, { CSSProperties } from 'react';\n\ntype RowProps = {\n  children: React.ReactNode,\n  className?: string,\n  responsive?: boolean,\n  style?: CSSProperties,\n};\n\nconst Row = (props: RowProps): React.ReactElement | null => {\n  const {\n    children,\n    className = '',\n    responsive = false,\n    style = {},\n  } = props;\n\n  if (!children) {\n    return null;\n  }\n\n  const classes = responsive ? 'flex flex-col sm:flex-row items-center' : 'flex flex-row items-center';\n\n  return (\n    <div style={style} className={`${classes} ${className}`}>\n      {children}\n    </div>\n  );\n};\n\nexport default Row;\n","// Adjusting the time to read.\n// gatsby-transformer-remark plugin relies on the 265 average words per minute.\n// @see: https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-transformer-remark/src/utils/time-to-read.js\nexport const timeToReadFromRemark = (\n  remarkTimeToRead?: number | null | undefined,\n): number | null => {\n  if (typeof remarkTimeToRead !== 'number') {\n    return null;\n  }\n  const timeToReadMultiplier = 1;\n  const minTimeToRead = 1;\n  return Math.ceil(remarkTimeToRead * timeToReadMultiplier) || minTimeToRead;\n};\n\nexport const wait = async (ms: number): Promise<void> => {\n  return new Promise((resolve) => {\n    setTimeout(resolve, ms);\n  });\n};\n","/**\n * @typedef {import('react').ReactNode} ReactNode\n * @typedef {import('mdx/types.js').MDXComponents} Components\n *\n * @typedef Props\n *   Configuration.\n * @property {Components | MergeComponents | null | undefined} [components]\n *   Mapping of names for JSX components to React components.\n * @property {boolean | null | undefined} [disableParentContext=false]\n *   Turn off outer component context.\n * @property {ReactNode | null | undefined} [children]\n *   Children.\n *\n * @callback MergeComponents\n *   Custom merge function.\n * @param {Components} currentComponents\n *   Current components from the context.\n * @returns {Components}\n *   Merged components.\n */\n\nimport React from 'react'\n\n/**\n * @type {import('react').Context<Components>}\n * @deprecated\n *   This export is marked as a legacy feature.\n *   That means it’s no longer recommended for use as it might be removed\n *   in a future major release.\n *\n *   Please use `useMDXComponents` to get context based components and\n *   `MDXProvider` to set context based components instead.\n */\nexport const MDXContext = React.createContext({})\n\n/**\n * @param {import('react').ComponentType<any>} Component\n * @deprecated\n *   This export is marked as a legacy feature.\n *   That means it’s no longer recommended for use as it might be removed\n *   in a future major release.\n *\n *   Please use `useMDXComponents` to get context based components instead.\n */\nexport function withMDXComponents(Component) {\n  return boundMDXComponent\n\n  /**\n   * @param {Record<string, unknown> & {components?: Components | null | undefined}} props\n   * @returns {JSX.Element}\n   */\n  function boundMDXComponent(props) {\n    const allComponents = useMDXComponents(props.components)\n    return React.createElement(Component, {...props, allComponents})\n  }\n}\n\n/**\n * Get current components from the MDX Context.\n *\n * @param {Components | MergeComponents | null | undefined} [components]\n *   Additional components to use or a function that takes the current\n *   components and filters/merges/changes them.\n * @returns {Components}\n *   Current components.\n */\nexport function useMDXComponents(components) {\n  const contextComponents = React.useContext(MDXContext)\n\n  // Memoize to avoid unnecessary top-level context changes\n  return React.useMemo(() => {\n    // Custom merge via a function prop\n    if (typeof components === 'function') {\n      return components(contextComponents)\n    }\n\n    return {...contextComponents, ...components}\n  }, [contextComponents, components])\n}\n\n/** @type {Components} */\nconst emptyObject = {}\n\n/**\n * Provider for MDX context\n *\n * @param {Props} props\n * @returns {JSX.Element}\n */\nexport function MDXProvider({components, children, disableParentContext}) {\n  /** @type {Components} */\n  let allComponents\n\n  if (disableParentContext) {\n    allComponents =\n      typeof components === 'function'\n        ? components({})\n        : components || emptyObject\n  } else {\n    allComponents = useMDXComponents(components)\n  }\n\n  return React.createElement(\n    MDXContext.Provider,\n    {value: allComponents},\n    children\n  )\n}\n"],"names":["GenIcon","module","exports","props","_createMdxContent","_components","Object","assign","h1","a","span","img","p","ul","li","h3","ol","strong","h2","_provideComponents","components","React","id","style","position","href","className","dangerouslySetInnerHTML","__html","src","alt","start","target","width","height","title","frameborder","allow","allowfullscreen","wrapper","MDXLayout","console","log","Post","data","children","PostScreen","post","GatsbyMDXWrapper","GATSBY_COMPILED_MDX","dateElement","mdx","_post$mdx","frontmatter","_post$mdx$frontmatter","date","Row","FiCalendar","_post$mdx2","timeToRead","_post$mdx3","FiClock","timeToReadFromRemark","_post$mdx4","maxWidth","PageHeader","_post$mdx5","_post$mdx5$frontmatte","ErrorBoundary","PageLayout","SEO","titleMode","titleModeSuffix","description","_post$mdx2$frontmatte","summary","image","_post$mdx3$frontmatte","cover","_post$mdx3$frontmatte2","childImageSharp","_post$mdx3$frontmatte3","gatsbyImageData","_post$mdx3$frontmatte4","images","_post$mdx3$frontmatte5","fallback","_post$mdx3$frontmatte6","type","ogTypeArticle","InfoAlert","ErrorAlert","alertIcons","BsFillInfoCircleFill","size","BiErrorCircle","alertClasses","_this","state","hasError","getDerivedStateFromError","componentDidCatch","error","errorInfo","this","setState","render","Alert","classes","commonClasses","H","level","hLevel","responsive","remarkTimeToRead","Math","ceil","MDXContext","useMDXComponents","contextComponents"],"sourceRoot":""}
\ No newline at end of file
diff --git a/index.html b/index.html
index a3f0fd8..1b4274e 100644
--- a/index.html
+++ b/index.html
@@ -54,6 +54,6 @@
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/page-data/app-data.json b/page-data/app-data.json
index a08b507..dc6b612 100644
--- a/page-data/app-data.json
+++ b/page-data/app-data.json
@@ -1 +1 @@
-{"webpackCompilationHash":"44c45cc6ef5d80f74174"}
+{"webpackCompilationHash":"680104f77018762e30be"}
diff --git a/page-data/blog/2024/streaming/page-data.json b/page-data/blog/2024/streaming/page-data.json
index 16348c8..9afabee 100644
--- a/page-data/blog/2024/streaming/page-data.json
+++ b/page-data/blog/2024/streaming/page-data.json
@@ -1 +1 @@
-{"componentChunkName":"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx","path":"/blog/2024/streaming/","result":{"data":{"mdx":{"id":"f745a12f-6978-5bc5-9caa-4e128ddcb65b","body":"\n# 🌐 Overview\n\n![Project Image](https://github.com/AwalHossain/video_streaming_service_server/assets/80216813/9e6b1889-c9d6-45d8-806e-27865f674912)\n\nMERN Video Streaming is a cutting-edge, open-source platform for video streaming, offering a comprehensive, full-stack solution utilizing the latest MERN stack technologies. With MERN Video Streaming, users can easily upload, manage, and stream videos on demand, providing a seamless experience. This project features a video processing capability that provides real-time notifications upon completion.\n\nThe backend is comprised of three services, utilizing Redis messaging for communication. These include an API server, a video conversion service, and an HTTP server serving HLS video files. On the client side, the project uses create-react-app and MUI library, along with socket.io-client and React Context.\n\n# 🌟 Features\n\n- Real-time video processing with notifications upon completion\n- Three-tier backend services for API, video conversion, and HTTP serving\n- Frontend built with create-react-app and MUI library\n- Real-time communication with the API server using socket.io-client and React Context\n\n# 🏗️ Architecture\n\n![Architecture Image](https://user-images.githubusercontent.com/497812/220627727-04a26928-71df-4c9b-9637-92289a2beee2.png)\n\n# 📡 Backend Services\n\n### 🖥️ API Server\n\nThe API server is an Expressjs app that uses Joi, Multer, BullMQ, Socket.io, and\nMongoDB driver. The server communicates with Redis to process and store data,\nand uses MongoDB as the primary database. The API server is responsible for the\nfollowing:\n\n1. **User Authentication:** Handles user registration, login, and JWT token generation.\n2. **Video Upload:** Manages video uploads, stores video metadata in MongoDB, and sends a job to the video processing service.\n3. **Video Management:** Provides endpoints for fetching video metadata, deleting videos, and fetching video streams.\n4. **Real-time Notifications:** Sends real-time notifications to the client using socket.io upon video processing completion.\n5. **Job Queue Management:** Manages the job queue using BullMQ, passing one job to the next upon completion.\n6. **Redis Communication:** Communicates with Redis to store job data and send real-time notifications to the client.\n7. **Bucket Storage Integration:** Upload completed video file into a CDN bucket storage to store video files, ensuring optimal streaming quality.\n8. **Video Streaming:** Serves HLS video files to the client, allowing users to stream videos seamlessly.\n\nThe HTTP server communicates with Redis to fetch video metadata and stream video files.\nThis server is not exposed to the public internet, ensuring a secure video streaming pipeline.\n\n### 🎞️ Video Processing Service\n\nThe Video Conversion Service is a Node.js process with ffmpeg responsible for converting videos and managing tasks with the BullMQ library.\nFirst of all, when user upload a video with an watermark image(optional), the API server sends a job to the video processing service. The job contains the video file, the watermark image, and the user ID. The video processing service then processes the video in three steps:\n\n1. **Video Conversion:** Converts any format video into MP4 and applies a watermark if an image is provided.\n\n![video-conversion](./assets/up.png)\n\n2. **Adaptive Bitrate Processing:** Transforms the video into adaptive bitrate HLS format (480p & 1080p) for optimal streaming quality.\n3. **CDN Upload:** Upon successful conversion, the video is uploaded to a CDN bucket storage. This allows users to stream videos seamlessly from anywhere in the world.\n\nThe video processing service communicates with the API server using Redis messaging to send real-time notifications upon completion.\n\n# 📱 Frontend\n\n## 📥 Upload\n\nTo upload a video with watermark image, the user must first register and login. After logging in, the user can upload a video with an optional watermark image.\nThe video is then processed and uploaded to the CDN bucket storage. Upon completion every process, the user receives a real-time notification.\n\n![home-page](./assets/cover.png)\n\nBelow some feature of the frontend part of the project:\n\n- **Video Search:** Look for videos by typing in their title.\n- **Video Filter:** Pick videos based on specific tags.\n- **Video Sorting:** Put videos in order by date, views, likes, etc.\n- **Edit Video metadata:** User can edit the video title, description, tag etc.\n- **Video Tag:** Add tags to group your videos together.\n\n## 📽️ Streaming\n\nUser will able to see their uploaded videos and stream them. The video player is built with HLS.js, allowing for seamless video streaming.\nThis player has a built-in adaptive bitrate feature, ensuring optimal streaming quality. User can easily switch to different video quality options.\nDepend on user internet speed, the video player will automatically switch to the best quality.\n\n![video-player](./assets/pl.png)\n\nOn the right side of the video player, user can see the related videos.\nBelow the video player, user can see the video details.\n\n## 🚀** Upcoming Update **\n\nOviously This project isn't done yet, there are lot other features that can be added to this project. Here are some of the features that I'm planning to add in the future:\n\n- **User Profile:** User can see their profile and update their profile.\n- **Video Analytics:** User can see the video analytics like views, likes, comments etc.\n- **Video Comment:** User can comment on the video.\n- **Video Like:** User can like the video.\n- **Video Share:** User can share the video.\n- **Video Playlist:** User can create playlist and add video to the playlist.\n- **Video Subscription:** User can subscribe to the channel and get notification when the channel upload a new video.\n- **Video Notification:** User can get notification when someone like, comment, share their video.\n- **Video Embed:** User can embed the video to their website.\n- **Video Download:** User can download the video.\n- **Video Edit:** User can edit the video title, description, tag etc.\n- **Video Delete:** User can delete the video.\n\n## 🤖 Technologies Used\n\n- **Backend:** TypeScript, Node.js, Express.js,ffmpeg, MongoDB, Redis, BullMQ, Socket.io, AWS S3, ffmpeg, HLS.js\n- **Frontend:** React, MUI, HLS.js, socket.io-client, React Context\n\n## 👨🏻‍💻 Github\n\n<a\n  href=\"https://github.com/AwalHossain/video_streaming_service_server\"\n  target=\"_blank\"\n>\n  Video Streaming Service Server\n</a>\n\n<a href=\"https://github.com/AwalHossain/video_streaming_client\" target=\"_blank\">\n  Video Streaming Service Client\n</a>\n","fields":{"slug":"/blog/2024/streaming/"},"internal":{"contentFilePath":"/home/runner/work/awalhossain.github.io/awalhossain.github.io/src/posts/2024/streaming/index.mdx"},"frontmatter":{"title":"MERN Video Streaming- [Behind the Scene] ","summary":" In-depth explanation of how JavaScript engines work, focusing on Google's V8 engine. It discusses the process of lexical analysis, the role of interpreters and compilers, and the concept of Just-In-Time (JIT) compilation for optimizing JavaScript execution","date":"03 March, 2024","cover":{"childImageSharp":{"gatsbyImageData":{"layout":"fullWidth","backgroundColor":"#080808","images":{"fallback":{"src":"/static/2bb943ed9cd8518723ace122afae0e91/c678f/reely.png","srcSet":"/static/2bb943ed9cd8518723ace122afae0e91/d1822/reely.png 750w,\n/static/2bb943ed9cd8518723ace122afae0e91/dab75/reely.png 1080w,\n/static/2bb943ed9cd8518723ace122afae0e91/c678f/reely.png 1280w","sizes":"100vw"},"sources":[{"srcSet":"/static/2bb943ed9cd8518723ace122afae0e91/ee401/reely.webp 750w,\n/static/2bb943ed9cd8518723ace122afae0e91/de1b1/reely.webp 1080w,\n/static/2bb943ed9cd8518723ace122afae0e91/92bb1/reely.webp 1280w","type":"image/webp","sizes":"100vw"}]},"width":1,"height":0.5625}}}}}},"pageContext":{"slug":"/blog/2024/streaming/","frontmatter":{"title":"MERN Video Streaming- [Behind the Scene] ","summary":" In-depth explanation of how JavaScript engines work, focusing on Google's V8 engine. It discusses the process of lexical analysis, the role of interpreters and compilers, and the concept of Just-In-Time (JIT) compilation for optimizing JavaScript execution","cover":"assets/reely.png","date":"2024-03-03T00:00:00.000Z"}}},"staticQueryHashes":[],"slicesMap":{}}
\ No newline at end of file
+{"componentChunkName":"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx","path":"/blog/2024/streaming/","result":{"data":{"mdx":{"id":"f745a12f-6978-5bc5-9caa-4e128ddcb65b","body":"\n# 🌐 Overview\n\n![Project Image](https://github.com/AwalHossain/video_streaming_service_server/assets/80216813/9e6b1889-c9d6-45d8-806e-27865f674912)\n\nMERN Video Streaming is a cutting-edge, open-source platform for video streaming, offering a comprehensive, full-stack solution utilizing the latest MERN stack technologies. With MERN Video Streaming, users can easily upload, manage, and stream videos on demand, providing a seamless experience. This project features a video processing capability that provides real-time notifications upon completion.\n\nThe backend is comprised of three services, utilizing Redis messaging for communication. These include an API server, a video conversion service, and an HTTP server serving HLS video files. On the client side, the project uses create-react-app and MUI library, along with socket.io-client and React Context.\n\n# 🌟 Features\n\n- Real-time video processing with notifications upon completion\n- Three-tier backend services for API, video conversion, and HTTP serving\n- Frontend built with create-react-app and MUI library\n- Real-time communication with the API server using socket.io-client and React Context\n\n# 🏗️ Architecture\n\n![Architecture Image](https://user-images.githubusercontent.com/497812/220627727-04a26928-71df-4c9b-9637-92289a2beee2.png)\n\n# 📡 Backend Services\n\n### 🖥️ API Server\n\nThe API server is an Expressjs app that uses Joi, Multer, BullMQ, Socket.io, and\nMongoDB driver. The server communicates with Redis to process and store data,\nand uses MongoDB as the primary database. The API server is responsible for the\nfollowing:\n\n1. **User Authentication:** Handles user registration, login, and JWT token generation.\n2. **Video Upload:** Manages video uploads, stores video metadata in MongoDB, and sends a job to the video processing service.\n3. **Video Management:** Provides endpoints for fetching video metadata, deleting videos, and fetching video streams.\n4. **Real-time Notifications:** Sends real-time notifications to the client using socket.io upon video processing completion.\n5. **Job Queue Management:** Manages the job queue using BullMQ, passing one job to the next upon completion.\n6. **Redis Communication:** Communicates with Redis to store job data and send real-time notifications to the client.\n7. **Bucket Storage Integration:** Upload completed video file into a CDN bucket storage to store video files, ensuring optimal streaming quality.\n8. **Video Streaming:** Serves HLS video files to the client, allowing users to stream videos seamlessly.\n\nThe HTTP server communicates with Redis to fetch video metadata and stream video files.\nThis server is not exposed to the public internet, ensuring a secure video streaming pipeline.\n\n### 🎞️ Video Processing Service\n\nThe Video Conversion Service is a Node.js process with ffmpeg responsible for converting videos and managing tasks with the BullMQ library.\nFirst of all, when user upload a video with an watermark image(optional), the API server sends a job to the video processing service. The job contains the video file, the watermark image, and the user ID. The video processing service then processes the video in three steps:\n\n1. **Video Conversion:** Converts any format video into MP4 and applies a watermark if an image is provided.\n\n![video-conversion](./assets/up.png)\n\n2. **Adaptive Bitrate Processing:** Transforms the video into adaptive bitrate HLS format (480p & 1080p) for optimal streaming quality.\n3. **CDN Upload:** Upon successful conversion, the video is uploaded to a CDN bucket storage. This allows users to stream videos seamlessly from anywhere in the world.\n\nThe video processing service communicates with the API server using Redis messaging to send real-time notifications upon completion.\n\n# 📱 Frontend\n\n## 📥 Upload\n\nTo upload a video with watermark image, the user must first register and login. After logging in, the user can upload a video with an optional watermark image.\nThe video is then processed and uploaded to the CDN bucket storage. Upon completion every process, the user receives a real-time notification.\n\n![home-page](./assets/cover.png)\n\nBelow some feature of the frontend part of the project:\n\n- **Video Search:** Look for videos by typing in their title.\n- **Video Filter:** Pick videos based on specific tags.\n- **Video Sorting:** Put videos in order by date, views, likes, etc.\n- **Edit Video metadata:** User can edit the video title, description, tag etc.\n- **Video Tag:** Add tags to group your videos together.\n\n## 📽️ Streaming\n\nUser will able to see their uploaded videos and stream them. The video player is built with HLS.js, allowing for seamless video streaming.\nThis player has a built-in adaptive bitrate feature, ensuring optimal streaming quality. User can easily switch to different video quality options.\nDepend on user internet speed, the video player will automatically switch to the best quality.\n\n![video-player](./assets/pl.png)\n\nOn the right side of the video player, user can see the related videos.\nBelow the video player, user can see the video details.\n\n## 🚀** Upcoming Update **\n\nThis project is a work in progress, and there's so much more we can do to enhance it! Here are some of the features we're planning to add in the future. We'd love to hear your thoughts on these:\n\n- **User Profile:** How about a feature where users can view and update their profiles?\n- **Video Analytics:** Wouldn't it be great to see analytics like views, likes, and comments for each video?\n- **Video Comment:** How important do you think it is for users to be able to comment on videos?\n- **Video Like:** Should users be able to like videos?\n- **Video Share:** What about sharing videos? How often do you share videos you enjoy?\n- **Video Playlist:** How about creating playlists and adding videos to them?\n- **Video Subscription:** Should users be able to subscribe to channels and receive notifications for new uploads?\n- **Video Notification:** How would you feel about getting notifications when someone likes, comments, or shares your video?\n- **Video Embed:** Should users be able to embed videos on their websites?\n- **Video Download:** How about a feature for downloading videos?\n- **Video Edit:** Should users be able to edit video titles, descriptions, tags, etc.?\n- **Video Delete:** How important is it for users to be able to delete their videos?\n\nWe're excited about these potential features and would love to hear your feedback. Which of these features are you most interested in? Are there any other features you'd like to see added?\n\n## 🤖 Technologies Used\n\n- **Backend:** TypeScript, Node.js, Express.js,ffmpeg, MongoDB, Redis, BullMQ, Socket.io, AWS S3, ffmpeg, HLS.js\n- **Frontend:** React, MUI, HLS.js, socket.io-client, React Context\n\n## 👨🏻‍💻 Github\n\n<a\n  href=\"https://github.com/AwalHossain/video_streaming_service_server\"\n  target=\"_blank\"\n>\n  Video Streaming Service Server\n</a>\n\n<a href=\"https://github.com/AwalHossain/video_streaming_client\" target=\"_blank\">\n  Video Streaming Service Client\n</a>\n\n## 📹 Video Explanation\n\nHere is the video explanation of the project where i've explained How the web application works and how the backend services are communicating with each other.Hope this\nwill help you to understand the project better.\n\n<iframe\n  width=\"80%\"\n  height=\"315\"\n  src=\"https://www.youtube.com/embed/RCRwublmR9E?si=kN1RwckxAq2zIKEm\"\n  title=\"YouTube video player\"\n  frameborder=\"0\"\n  allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\"\n  allowfullscreen\n></iframe>\n","fields":{"slug":"/blog/2024/streaming/"},"internal":{"contentFilePath":"/home/runner/work/awalhossain.github.io/awalhossain.github.io/src/posts/2024/streaming/index.mdx"},"frontmatter":{"title":"MERN Video Streaming- [Behind the Scene] ","summary":" In-depth explanation of how JavaScript engines work, focusing on Google's V8 engine. It discusses the process of lexical analysis, the role of interpreters and compilers, and the concept of Just-In-Time (JIT) compilation for optimizing JavaScript execution","date":"03 March, 2024","cover":{"childImageSharp":{"gatsbyImageData":{"layout":"fullWidth","backgroundColor":"#080808","images":{"fallback":{"src":"/static/2bb943ed9cd8518723ace122afae0e91/c678f/reely.png","srcSet":"/static/2bb943ed9cd8518723ace122afae0e91/d1822/reely.png 750w,\n/static/2bb943ed9cd8518723ace122afae0e91/dab75/reely.png 1080w,\n/static/2bb943ed9cd8518723ace122afae0e91/c678f/reely.png 1280w","sizes":"100vw"},"sources":[{"srcSet":"/static/2bb943ed9cd8518723ace122afae0e91/ee401/reely.webp 750w,\n/static/2bb943ed9cd8518723ace122afae0e91/de1b1/reely.webp 1080w,\n/static/2bb943ed9cd8518723ace122afae0e91/92bb1/reely.webp 1280w","type":"image/webp","sizes":"100vw"}]},"width":1,"height":0.5625}}}}}},"pageContext":{"slug":"/blog/2024/streaming/","frontmatter":{"title":"MERN Video Streaming- [Behind the Scene] ","summary":" In-depth explanation of how JavaScript engines work, focusing on Google's V8 engine. It discusses the process of lexical analysis, the role of interpreters and compilers, and the concept of Just-In-Time (JIT) compilation for optimizing JavaScript execution","cover":"assets/reely.png","date":"2024-03-03T00:00:00.000Z"}}},"staticQueryHashes":[],"slicesMap":{}}
\ No newline at end of file
diff --git a/projects/Bookish-A-Book-Management-Site/index.html b/projects/Bookish-A-Book-Management-Site/index.html
index d3e8c03..e2b7889 100644
--- a/projects/Bookish-A-Book-Management-Site/index.html
+++ b/projects/Bookish-A-Book-Management-Site/index.html
@@ -54,6 +54,6 @@
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/projects/DevBlog-a-developer-blog-site/index.html b/projects/DevBlog-a-developer-blog-site/index.html
index c0f5a5a..a4d6933 100644
--- a/projects/DevBlog-a-developer-blog-site/index.html
+++ b/projects/DevBlog-a-developer-blog-site/index.html
@@ -54,6 +54,6 @@
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/projects/Reely-A-MERN-Video-Streaming-App/index.html b/projects/Reely-A-MERN-Video-Streaming-App/index.html
index 9344552..c8ef5f5 100644
--- a/projects/Reely-A-MERN-Video-Streaming-App/index.html
+++ b/projects/Reely-A-MERN-Video-Streaming-App/index.html
@@ -54,6 +54,6 @@
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/projects/health-coach/index.html b/projects/health-coach/index.html
index 31d2fe4..8b72688 100644
--- a/projects/health-coach/index.html
+++ b/projects/health-coach/index.html
@@ -54,6 +54,6 @@
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/projects/index.html b/projects/index.html
index 372c386..71ec927 100644
--- a/projects/index.html
+++ b/projects/index.html
@@ -54,6 +54,6 @@
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/projects/pc-builder/index.html b/projects/pc-builder/index.html
index f51b5f6..f45567b 100644
--- a/projects/pc-builder/index.html
+++ b/projects/pc-builder/index.html
@@ -54,6 +54,6 @@
           <script
             id="gatsby-chunk-mapping"
           >
-            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
+            window.___chunkMapping="{\"app\":[\"/app-48e2fc747e435357e6ca.js\"],\"component---src-pages-404-tsx\":[\"/component---src-pages-404-tsx-e52900953c2998f1b976.js\"],\"component---src-pages-blog-tsx\":[\"/component---src-pages-blog-tsx-5f7059675b15af11c300.js\"],\"component---src-pages-index-tsx\":[\"/component---src-pages-index-tsx-3dd77113240175e3e611.js\"],\"component---src-pages-projects-tsx\":[\"/component---src-pages-projects-tsx-dd50460c8c9595d66a51.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js\"],\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\":[\"/component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js\"],\"component---src-templates-project-tsx\":[\"/component---src-templates-project-tsx-2b0f8b1d26124b556601.js\"]}";
           </script>
-        <script>window.___webpackCompilationHash="44c45cc6ef5d80f74174";</script><script src="/webpack-runtime-605beca16f3744607e3b.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
+        <script>window.___webpackCompilationHash="680104f77018762e30be";</script><script src="/webpack-runtime-8343fc1e0704ae98e641.js" async></script><script src="/framework-e817803d957448322269.js" async></script><script src="/app-48e2fc747e435357e6ca.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
\ No newline at end of file
diff --git a/webpack-runtime-605beca16f3744607e3b.js b/webpack-runtime-8343fc1e0704ae98e641.js
similarity index 97%
rename from webpack-runtime-605beca16f3744607e3b.js
rename to webpack-runtime-8343fc1e0704ae98e641.js
index 452d097..9854fe8 100644
--- a/webpack-runtime-605beca16f3744607e3b.js
+++ b/webpack-runtime-8343fc1e0704ae98e641.js
@@ -1,2 +1,2 @@
-!function(){"use strict";var e,t,n,r,o,c={},i={};function f(e){var t=i[e];if(void 0!==t)return t.exports;var n=i[e]={exports:{}};return c[e].call(n.exports,n,n.exports,f),n.exports}f.m=c,e=[],f.O=function(t,n,r,o){if(!n){var c=1/0;for(s=0;s<e.length;s++){n=e[s][0],r=e[s][1],o=e[s][2];for(var i=!0,a=0;a<n.length;a++)(!1&o||c>=o)&&Object.keys(f.O).every((function(e){return f.O[e](n[a])}))?n.splice(a--,1):(i=!1,o<c&&(c=o));if(i){e.splice(s--,1);var u=r();void 0!==u&&(t=u)}}return t}o=o||0;for(var s=e.length;s>0&&e[s-1][2]>o;s--)e[s]=e[s-1];e[s]=[n,r,o]},f.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return f.d(t,{a:t}),t},n=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},f.t=function(e,r){if(1&r&&(e=this(e)),8&r)return e;if("object"==typeof e&&e){if(4&r&&e.__esModule)return e;if(16&r&&"function"==typeof e.then)return e}var o=Object.create(null);f.r(o);var c={};t=t||[null,n({}),n([]),n(n)];for(var i=2&r&&e;"object"==typeof i&&!~t.indexOf(i);i=n(i))Object.getOwnPropertyNames(i).forEach((function(t){c[t]=function(){return e[t]}}));return c.default=function(){return e},f.d(o,c),o},f.d=function(e,t){for(var n in t)f.o(t,n)&&!f.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},f.f={},f.e=function(e){return Promise.all(Object.keys(f.f).reduce((function(t,n){return f.f[n](e,t),t}),[]))},f.u=function(e){return({142:"component---src-templates-project-tsx",218:"component---src-pages-404-tsx",317:"component---src-pages-projects-tsx",351:"commons",410:"component---src-pages-blog-tsx",590:"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx",675:"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx",691:"component---src-pages-index-tsx",823:"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx",882:"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx",886:"1254dea0549e67f9c6b7574de1277b85c557acbf"}[e]||e)+"-"+{142:"2b0f8b1d26124b556601",218:"e52900953c2998f1b976",317:"dd50460c8c9595d66a51",351:"3e3623170d8bfd1cd9fd",410:"5f7059675b15af11c300",590:"349bcd1144540fe9ca71",675:"2d109719aed234f0e08d",691:"3dd77113240175e3e611",731:"57ca67b4bc099aebb100",823:"5adf3b8163c9b41c8414",843:"9e6b01c437ea801c1b7e",882:"637c6389798f4553f4a4",886:"5f6dfe8312ab1569d41e"}[e]+".js"},f.miniCssF=function(e){return"styles.6c80396f0a4b75094c7c.css"},f.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),f.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r={},o="portfolio:",f.l=function(e,t,n,c){if(r[e])r[e].push(t);else{var i,a;if(void 0!==n)for(var u=document.getElementsByTagName("script"),s=0;s<u.length;s++){var p=u[s];if(p.getAttribute("src")==e||p.getAttribute("data-webpack")==o+n){i=p;break}}i||(a=!0,(i=document.createElement("script")).charset="utf-8",i.timeout=120,f.nc&&i.setAttribute("nonce",f.nc),i.setAttribute("data-webpack",o+n),i.src=e),r[e]=[t];var l=function(t,n){i.onerror=i.onload=null,clearTimeout(d);var o=r[e];if(delete r[e],i.parentNode&&i.parentNode.removeChild(i),o&&o.forEach((function(e){return e(n)})),t)return t(n)},d=setTimeout(l.bind(null,void 0,{type:"timeout",target:i}),12e4);i.onerror=l.bind(null,i.onerror),i.onload=l.bind(null,i.onload),a&&document.head.appendChild(i)}},f.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},f.p="/",function(){var e={658:0,532:0};f.f.j=function(t,n){var r=f.o(e,t)?e[t]:void 0;if(0!==r)if(r)n.push(r[2]);else if(/^(532|658)$/.test(t))e[t]=0;else{var o=new Promise((function(n,o){r=e[t]=[n,o]}));n.push(r[2]=o);var c=f.p+f.u(t),i=new Error;f.l(c,(function(n){if(f.o(e,t)&&(0!==(r=e[t])&&(e[t]=void 0),r)){var o=n&&("load"===n.type?"missing":n.type),c=n&&n.target&&n.target.src;i.message="Loading chunk "+t+" failed.\n("+o+": "+c+")",i.name="ChunkLoadError",i.type=o,i.request=c,r[1](i)}}),"chunk-"+t,t)}},f.O.j=function(t){return 0===e[t]};var t=function(t,n){var r,o,c=n[0],i=n[1],a=n[2],u=0;if(c.some((function(t){return 0!==e[t]}))){for(r in i)f.o(i,r)&&(f.m[r]=i[r]);if(a)var s=a(f)}for(t&&t(n);u<c.length;u++)o=c[u],f.o(e,o)&&e[o]&&e[o][0](),e[o]=0;return f.O(s)},n=self.webpackChunkportfolio=self.webpackChunkportfolio||[];n.forEach(t.bind(null,0)),n.push=t.bind(null,n.push.bind(n))}()}();
-//# sourceMappingURL=webpack-runtime-605beca16f3744607e3b.js.map
\ No newline at end of file
+!function(){"use strict";var e,t,n,r,o,c={},i={};function f(e){var t=i[e];if(void 0!==t)return t.exports;var n=i[e]={exports:{}};return c[e].call(n.exports,n,n.exports,f),n.exports}f.m=c,e=[],f.O=function(t,n,r,o){if(!n){var c=1/0;for(s=0;s<e.length;s++){n=e[s][0],r=e[s][1],o=e[s][2];for(var i=!0,a=0;a<n.length;a++)(!1&o||c>=o)&&Object.keys(f.O).every((function(e){return f.O[e](n[a])}))?n.splice(a--,1):(i=!1,o<c&&(c=o));if(i){e.splice(s--,1);var u=r();void 0!==u&&(t=u)}}return t}o=o||0;for(var s=e.length;s>0&&e[s-1][2]>o;s--)e[s]=e[s-1];e[s]=[n,r,o]},f.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return f.d(t,{a:t}),t},n=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},f.t=function(e,r){if(1&r&&(e=this(e)),8&r)return e;if("object"==typeof e&&e){if(4&r&&e.__esModule)return e;if(16&r&&"function"==typeof e.then)return e}var o=Object.create(null);f.r(o);var c={};t=t||[null,n({}),n([]),n(n)];for(var i=2&r&&e;"object"==typeof i&&!~t.indexOf(i);i=n(i))Object.getOwnPropertyNames(i).forEach((function(t){c[t]=function(){return e[t]}}));return c.default=function(){return e},f.d(o,c),o},f.d=function(e,t){for(var n in t)f.o(t,n)&&!f.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},f.f={},f.e=function(e){return Promise.all(Object.keys(f.f).reduce((function(t,n){return f.f[n](e,t),t}),[]))},f.u=function(e){return({142:"component---src-templates-project-tsx",218:"component---src-pages-404-tsx",317:"component---src-pages-projects-tsx",351:"commons",410:"component---src-pages-blog-tsx",590:"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx",675:"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx",691:"component---src-pages-index-tsx",823:"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx",882:"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx",886:"1254dea0549e67f9c6b7574de1277b85c557acbf"}[e]||e)+"-"+{142:"2b0f8b1d26124b556601",218:"e52900953c2998f1b976",317:"dd50460c8c9595d66a51",351:"3e3623170d8bfd1cd9fd",410:"5f7059675b15af11c300",590:"349bcd1144540fe9ca71",675:"2d109719aed234f0e08d",691:"3dd77113240175e3e611",731:"57ca67b4bc099aebb100",823:"5adf3b8163c9b41c8414",843:"9e6b01c437ea801c1b7e",882:"813d64ba0f45836bb668",886:"5f6dfe8312ab1569d41e"}[e]+".js"},f.miniCssF=function(e){return"styles.6c80396f0a4b75094c7c.css"},f.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),f.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r={},o="portfolio:",f.l=function(e,t,n,c){if(r[e])r[e].push(t);else{var i,a;if(void 0!==n)for(var u=document.getElementsByTagName("script"),s=0;s<u.length;s++){var p=u[s];if(p.getAttribute("src")==e||p.getAttribute("data-webpack")==o+n){i=p;break}}i||(a=!0,(i=document.createElement("script")).charset="utf-8",i.timeout=120,f.nc&&i.setAttribute("nonce",f.nc),i.setAttribute("data-webpack",o+n),i.src=e),r[e]=[t];var l=function(t,n){i.onerror=i.onload=null,clearTimeout(d);var o=r[e];if(delete r[e],i.parentNode&&i.parentNode.removeChild(i),o&&o.forEach((function(e){return e(n)})),t)return t(n)},d=setTimeout(l.bind(null,void 0,{type:"timeout",target:i}),12e4);i.onerror=l.bind(null,i.onerror),i.onload=l.bind(null,i.onload),a&&document.head.appendChild(i)}},f.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},f.p="/",function(){var e={658:0,532:0};f.f.j=function(t,n){var r=f.o(e,t)?e[t]:void 0;if(0!==r)if(r)n.push(r[2]);else if(/^(532|658)$/.test(t))e[t]=0;else{var o=new Promise((function(n,o){r=e[t]=[n,o]}));n.push(r[2]=o);var c=f.p+f.u(t),i=new Error;f.l(c,(function(n){if(f.o(e,t)&&(0!==(r=e[t])&&(e[t]=void 0),r)){var o=n&&("load"===n.type?"missing":n.type),c=n&&n.target&&n.target.src;i.message="Loading chunk "+t+" failed.\n("+o+": "+c+")",i.name="ChunkLoadError",i.type=o,i.request=c,r[1](i)}}),"chunk-"+t,t)}},f.O.j=function(t){return 0===e[t]};var t=function(t,n){var r,o,c=n[0],i=n[1],a=n[2],u=0;if(c.some((function(t){return 0!==e[t]}))){for(r in i)f.o(i,r)&&(f.m[r]=i[r]);if(a)var s=a(f)}for(t&&t(n);u<c.length;u++)o=c[u],f.o(e,o)&&e[o]&&e[o][0](),e[o]=0;return f.O(s)},n=self.webpackChunkportfolio=self.webpackChunkportfolio||[];n.forEach(t.bind(null,0)),n.push=t.bind(null,n.push.bind(n))}()}();
+//# sourceMappingURL=webpack-runtime-8343fc1e0704ae98e641.js.map
\ No newline at end of file
diff --git a/webpack-runtime-605beca16f3744607e3b.js.map b/webpack-runtime-8343fc1e0704ae98e641.js.map
similarity index 99%
rename from webpack-runtime-605beca16f3744607e3b.js.map
rename to webpack-runtime-8343fc1e0704ae98e641.js.map
index e1d0879..33f59ab 100644
--- a/webpack-runtime-605beca16f3744607e3b.js.map
+++ b/webpack-runtime-8343fc1e0704ae98e641.js.map
@@ -1 +1 @@
-{"version":3,"file":"webpack-runtime-605beca16f3744607e3b.js","mappings":"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","sources":["webpack://portfolio/webpack/runtime/chunk loaded","webpack://portfolio/webpack/runtime/create fake namespace object","webpack://portfolio/webpack/runtime/load script","webpack://portfolio/webpack/bootstrap","webpack://portfolio/webpack/runtime/compat get default export","webpack://portfolio/webpack/runtime/define property getters","webpack://portfolio/webpack/runtime/ensure chunk","webpack://portfolio/webpack/runtime/get javascript chunk filename","webpack://portfolio/webpack/runtime/get mini-css chunk filename","webpack://portfolio/webpack/runtime/global","webpack://portfolio/webpack/runtime/hasOwnProperty shorthand","webpack://portfolio/webpack/runtime/make namespace object","webpack://portfolio/webpack/runtime/publicPath","webpack://portfolio/webpack/runtime/jsonp chunk loading"],"sourcesContent":["var deferred = [];\n__webpack_require__.O = function(result, chunkIds, fn, priority) {\n\tif(chunkIds) {\n\t\tpriority = priority || 0;\n\t\tfor(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];\n\t\tdeferred[i] = [chunkIds, fn, priority];\n\t\treturn;\n\t}\n\tvar notFulfilled = Infinity;\n\tfor (var i = 0; i < deferred.length; i++) {\n\t\tvar chunkIds = deferred[i][0];\n\t\tvar fn = deferred[i][1];\n\t\tvar priority = deferred[i][2];\n\t\tvar fulfilled = true;\n\t\tfor (var j = 0; j < chunkIds.length; j++) {\n\t\t\tif ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every(function(key) { return __webpack_require__.O[key](chunkIds[j]); })) {\n\t\t\t\tchunkIds.splice(j--, 1);\n\t\t\t} else {\n\t\t\t\tfulfilled = false;\n\t\t\t\tif(priority < notFulfilled) notFulfilled = priority;\n\t\t\t}\n\t\t}\n\t\tif(fulfilled) {\n\t\t\tdeferred.splice(i--, 1)\n\t\t\tvar r = fn();\n\t\t\tif (r !== undefined) result = r;\n\t\t}\n\t}\n\treturn result;\n};","var getProto = Object.getPrototypeOf ? function(obj) { return Object.getPrototypeOf(obj); } : function(obj) { return obj.__proto__; };\nvar leafPrototypes;\n// create a fake namespace object\n// mode & 1: value is a module id, require it\n// mode & 2: merge all properties of value into the ns\n// mode & 4: return value when already ns object\n// mode & 16: return value when it's Promise-like\n// mode & 8|1: behave like require\n__webpack_require__.t = function(value, mode) {\n\tif(mode & 1) value = this(value);\n\tif(mode & 8) return value;\n\tif(typeof value === 'object' && value) {\n\t\tif((mode & 4) && value.__esModule) return value;\n\t\tif((mode & 16) && typeof value.then === 'function') return value;\n\t}\n\tvar ns = Object.create(null);\n\t__webpack_require__.r(ns);\n\tvar def = {};\n\tleafPrototypes = leafPrototypes || [null, getProto({}), getProto([]), getProto(getProto)];\n\tfor(var current = mode & 2 && value; typeof current == 'object' && !~leafPrototypes.indexOf(current); current = getProto(current)) {\n\t\tObject.getOwnPropertyNames(current).forEach(function(key) { def[key] = function() { return value[key]; }; });\n\t}\n\tdef['default'] = function() { return value; };\n\t__webpack_require__.d(ns, def);\n\treturn ns;\n};","var inProgress = {};\nvar dataWebpackPrefix = \"portfolio:\";\n// loadScript function to load a script via script tag\n__webpack_require__.l = function(url, done, key, chunkId) {\n\tif(inProgress[url]) { inProgress[url].push(done); return; }\n\tvar script, needAttach;\n\tif(key !== undefined) {\n\t\tvar scripts = document.getElementsByTagName(\"script\");\n\t\tfor(var i = 0; i < scripts.length; i++) {\n\t\t\tvar s = scripts[i];\n\t\t\tif(s.getAttribute(\"src\") == url || s.getAttribute(\"data-webpack\") == dataWebpackPrefix + key) { script = s; break; }\n\t\t}\n\t}\n\tif(!script) {\n\t\tneedAttach = true;\n\t\tscript = document.createElement('script');\n\n\t\tscript.charset = 'utf-8';\n\t\tscript.timeout = 120;\n\t\tif (__webpack_require__.nc) {\n\t\t\tscript.setAttribute(\"nonce\", __webpack_require__.nc);\n\t\t}\n\t\tscript.setAttribute(\"data-webpack\", dataWebpackPrefix + key);\n\n\t\tscript.src = url;\n\t}\n\tinProgress[url] = [done];\n\tvar onScriptComplete = function(prev, event) {\n\t\t// avoid mem leaks in IE.\n\t\tscript.onerror = script.onload = null;\n\t\tclearTimeout(timeout);\n\t\tvar doneFns = inProgress[url];\n\t\tdelete inProgress[url];\n\t\tscript.parentNode && script.parentNode.removeChild(script);\n\t\tdoneFns && doneFns.forEach(function(fn) { return fn(event); });\n\t\tif(prev) return prev(event);\n\t}\n\tvar timeout = setTimeout(onScriptComplete.bind(null, undefined, { type: 'timeout', target: script }), 120000);\n\tscript.onerror = onScriptComplete.bind(null, script.onerror);\n\tscript.onload = onScriptComplete.bind(null, script.onload);\n\tneedAttach && document.head.appendChild(script);\n};","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n// expose the modules object (__webpack_modules__)\n__webpack_require__.m = __webpack_modules__;\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = function(module) {\n\tvar getter = module && module.__esModule ?\n\t\tfunction() { return module['default']; } :\n\t\tfunction() { return module; };\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = function(exports, definition) {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.f = {};\n// This file contains only the entry chunk.\n// The chunk loading function for additional chunks\n__webpack_require__.e = function(chunkId) {\n\treturn Promise.all(Object.keys(__webpack_require__.f).reduce(function(promises, key) {\n\t\t__webpack_require__.f[key](chunkId, promises);\n\t\treturn promises;\n\t}, []));\n};","// This function allow to reference async chunks\n__webpack_require__.u = function(chunkId) {\n\t// return url for filenames based on template\n\treturn \"\" + ({\"142\":\"component---src-templates-project-tsx\",\"218\":\"component---src-pages-404-tsx\",\"317\":\"component---src-pages-projects-tsx\",\"351\":\"commons\",\"410\":\"component---src-pages-blog-tsx\",\"590\":\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\",\"675\":\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\",\"691\":\"component---src-pages-index-tsx\",\"823\":\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\",\"882\":\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\",\"886\":\"1254dea0549e67f9c6b7574de1277b85c557acbf\"}[chunkId] || chunkId) + \"-\" + {\"142\":\"2b0f8b1d26124b556601\",\"218\":\"e52900953c2998f1b976\",\"317\":\"dd50460c8c9595d66a51\",\"351\":\"3e3623170d8bfd1cd9fd\",\"410\":\"5f7059675b15af11c300\",\"590\":\"349bcd1144540fe9ca71\",\"675\":\"2d109719aed234f0e08d\",\"691\":\"3dd77113240175e3e611\",\"731\":\"57ca67b4bc099aebb100\",\"823\":\"5adf3b8163c9b41c8414\",\"843\":\"9e6b01c437ea801c1b7e\",\"882\":\"637c6389798f4553f4a4\",\"886\":\"5f6dfe8312ab1569d41e\"}[chunkId] + \".js\";\n};","// This function allow to reference all chunks\n__webpack_require__.miniCssF = function(chunkId) {\n\t// return url for filenames based on template\n\treturn \"\" + \"styles\" + \".\" + \"6c80396f0a4b75094c7c\" + \".css\";\n};","__webpack_require__.g = (function() {\n\tif (typeof globalThis === 'object') return globalThis;\n\ttry {\n\t\treturn this || new Function('return this')();\n\t} catch (e) {\n\t\tif (typeof window === 'object') return window;\n\t}\n})();","__webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }","// define __esModule on exports\n__webpack_require__.r = function(exports) {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","__webpack_require__.p = \"/\";","// no baseURI\n\n// object to store loaded and loading chunks\n// undefined = chunk not loaded, null = chunk preloaded/prefetched\n// [resolve, reject, Promise] = chunk loading, 0 = chunk loaded\nvar installedChunks = {\n\t658: 0,\n\t532: 0\n};\n\n__webpack_require__.f.j = function(chunkId, promises) {\n\t\t// JSONP chunk loading for javascript\n\t\tvar installedChunkData = __webpack_require__.o(installedChunks, chunkId) ? installedChunks[chunkId] : undefined;\n\t\tif(installedChunkData !== 0) { // 0 means \"already installed\".\n\n\t\t\t// a Promise means \"currently loading\".\n\t\t\tif(installedChunkData) {\n\t\t\t\tpromises.push(installedChunkData[2]);\n\t\t\t} else {\n\t\t\t\tif(!/^(532|658)$/.test(chunkId)) {\n\t\t\t\t\t// setup Promise in chunk cache\n\t\t\t\t\tvar promise = new Promise(function(resolve, reject) { installedChunkData = installedChunks[chunkId] = [resolve, reject]; });\n\t\t\t\t\tpromises.push(installedChunkData[2] = promise);\n\n\t\t\t\t\t// start chunk loading\n\t\t\t\t\tvar url = __webpack_require__.p + __webpack_require__.u(chunkId);\n\t\t\t\t\t// create error before stack unwound to get useful stacktrace later\n\t\t\t\t\tvar error = new Error();\n\t\t\t\t\tvar loadingEnded = function(event) {\n\t\t\t\t\t\tif(__webpack_require__.o(installedChunks, chunkId)) {\n\t\t\t\t\t\t\tinstalledChunkData = installedChunks[chunkId];\n\t\t\t\t\t\t\tif(installedChunkData !== 0) installedChunks[chunkId] = undefined;\n\t\t\t\t\t\t\tif(installedChunkData) {\n\t\t\t\t\t\t\t\tvar errorType = event && (event.type === 'load' ? 'missing' : event.type);\n\t\t\t\t\t\t\t\tvar realSrc = event && event.target && event.target.src;\n\t\t\t\t\t\t\t\terror.message = 'Loading chunk ' + chunkId + ' failed.\\n(' + errorType + ': ' + realSrc + ')';\n\t\t\t\t\t\t\t\terror.name = 'ChunkLoadError';\n\t\t\t\t\t\t\t\terror.type = errorType;\n\t\t\t\t\t\t\t\terror.request = realSrc;\n\t\t\t\t\t\t\t\tinstalledChunkData[1](error);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t};\n\t\t\t\t\t__webpack_require__.l(url, loadingEnded, \"chunk-\" + chunkId, chunkId);\n\t\t\t\t} else installedChunks[chunkId] = 0;\n\t\t\t}\n\t\t}\n};\n\n// no prefetching\n\n// no preloaded\n\n// no HMR\n\n// no HMR manifest\n\n__webpack_require__.O.j = function(chunkId) { return installedChunks[chunkId] === 0; };\n\n// install a JSONP callback for chunk loading\nvar webpackJsonpCallback = function(parentChunkLoadingFunction, data) {\n\tvar chunkIds = data[0];\n\tvar moreModules = data[1];\n\tvar runtime = data[2];\n\t// add \"moreModules\" to the modules object,\n\t// then flag all \"chunkIds\" as loaded and fire callback\n\tvar moduleId, chunkId, i = 0;\n\tif(chunkIds.some(function(id) { return installedChunks[id] !== 0; })) {\n\t\tfor(moduleId in moreModules) {\n\t\t\tif(__webpack_require__.o(moreModules, moduleId)) {\n\t\t\t\t__webpack_require__.m[moduleId] = moreModules[moduleId];\n\t\t\t}\n\t\t}\n\t\tif(runtime) var result = runtime(__webpack_require__);\n\t}\n\tif(parentChunkLoadingFunction) parentChunkLoadingFunction(data);\n\tfor(;i < chunkIds.length; i++) {\n\t\tchunkId = chunkIds[i];\n\t\tif(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {\n\t\t\tinstalledChunks[chunkId][0]();\n\t\t}\n\t\tinstalledChunks[chunkId] = 0;\n\t}\n\treturn __webpack_require__.O(result);\n}\n\nvar chunkLoadingGlobal = self[\"webpackChunkportfolio\"] = self[\"webpackChunkportfolio\"] || [];\nchunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));\nchunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));"],"names":["deferred","leafPrototypes","getProto","inProgress","dataWebpackPrefix","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","exports","module","__webpack_modules__","call","m","O","result","chunkIds","fn","priority","notFulfilled","Infinity","i","length","fulfilled","j","Object","keys","every","key","splice","r","n","getter","__esModule","d","a","getPrototypeOf","obj","__proto__","t","value","mode","this","then","ns","create","def","current","indexOf","getOwnPropertyNames","forEach","definition","o","defineProperty","enumerable","get","f","e","chunkId","Promise","all","reduce","promises","u","miniCssF","g","globalThis","Function","window","prop","prototype","hasOwnProperty","l","url","done","push","script","needAttach","scripts","document","getElementsByTagName","s","getAttribute","createElement","charset","timeout","nc","setAttribute","src","onScriptComplete","prev","event","onerror","onload","clearTimeout","doneFns","parentNode","removeChild","setTimeout","bind","type","target","head","appendChild","Symbol","toStringTag","p","installedChunks","installedChunkData","test","promise","resolve","reject","error","Error","errorType","realSrc","message","name","request","webpackJsonpCallback","parentChunkLoadingFunction","data","moreModules","runtime","some","id","chunkLoadingGlobal","self"],"sourceRoot":""}
\ No newline at end of file
+{"version":3,"file":"webpack-runtime-8343fc1e0704ae98e641.js","mappings":"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","sources":["webpack://portfolio/webpack/runtime/chunk loaded","webpack://portfolio/webpack/runtime/create fake namespace object","webpack://portfolio/webpack/runtime/load script","webpack://portfolio/webpack/bootstrap","webpack://portfolio/webpack/runtime/compat get default export","webpack://portfolio/webpack/runtime/define property getters","webpack://portfolio/webpack/runtime/ensure chunk","webpack://portfolio/webpack/runtime/get javascript chunk filename","webpack://portfolio/webpack/runtime/get mini-css chunk filename","webpack://portfolio/webpack/runtime/global","webpack://portfolio/webpack/runtime/hasOwnProperty shorthand","webpack://portfolio/webpack/runtime/make namespace object","webpack://portfolio/webpack/runtime/publicPath","webpack://portfolio/webpack/runtime/jsonp chunk loading"],"sourcesContent":["var deferred = [];\n__webpack_require__.O = function(result, chunkIds, fn, priority) {\n\tif(chunkIds) {\n\t\tpriority = priority || 0;\n\t\tfor(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];\n\t\tdeferred[i] = [chunkIds, fn, priority];\n\t\treturn;\n\t}\n\tvar notFulfilled = Infinity;\n\tfor (var i = 0; i < deferred.length; i++) {\n\t\tvar chunkIds = deferred[i][0];\n\t\tvar fn = deferred[i][1];\n\t\tvar priority = deferred[i][2];\n\t\tvar fulfilled = true;\n\t\tfor (var j = 0; j < chunkIds.length; j++) {\n\t\t\tif ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every(function(key) { return __webpack_require__.O[key](chunkIds[j]); })) {\n\t\t\t\tchunkIds.splice(j--, 1);\n\t\t\t} else {\n\t\t\t\tfulfilled = false;\n\t\t\t\tif(priority < notFulfilled) notFulfilled = priority;\n\t\t\t}\n\t\t}\n\t\tif(fulfilled) {\n\t\t\tdeferred.splice(i--, 1)\n\t\t\tvar r = fn();\n\t\t\tif (r !== undefined) result = r;\n\t\t}\n\t}\n\treturn result;\n};","var getProto = Object.getPrototypeOf ? function(obj) { return Object.getPrototypeOf(obj); } : function(obj) { return obj.__proto__; };\nvar leafPrototypes;\n// create a fake namespace object\n// mode & 1: value is a module id, require it\n// mode & 2: merge all properties of value into the ns\n// mode & 4: return value when already ns object\n// mode & 16: return value when it's Promise-like\n// mode & 8|1: behave like require\n__webpack_require__.t = function(value, mode) {\n\tif(mode & 1) value = this(value);\n\tif(mode & 8) return value;\n\tif(typeof value === 'object' && value) {\n\t\tif((mode & 4) && value.__esModule) return value;\n\t\tif((mode & 16) && typeof value.then === 'function') return value;\n\t}\n\tvar ns = Object.create(null);\n\t__webpack_require__.r(ns);\n\tvar def = {};\n\tleafPrototypes = leafPrototypes || [null, getProto({}), getProto([]), getProto(getProto)];\n\tfor(var current = mode & 2 && value; typeof current == 'object' && !~leafPrototypes.indexOf(current); current = getProto(current)) {\n\t\tObject.getOwnPropertyNames(current).forEach(function(key) { def[key] = function() { return value[key]; }; });\n\t}\n\tdef['default'] = function() { return value; };\n\t__webpack_require__.d(ns, def);\n\treturn ns;\n};","var inProgress = {};\nvar dataWebpackPrefix = \"portfolio:\";\n// loadScript function to load a script via script tag\n__webpack_require__.l = function(url, done, key, chunkId) {\n\tif(inProgress[url]) { inProgress[url].push(done); return; }\n\tvar script, needAttach;\n\tif(key !== undefined) {\n\t\tvar scripts = document.getElementsByTagName(\"script\");\n\t\tfor(var i = 0; i < scripts.length; i++) {\n\t\t\tvar s = scripts[i];\n\t\t\tif(s.getAttribute(\"src\") == url || s.getAttribute(\"data-webpack\") == dataWebpackPrefix + key) { script = s; break; }\n\t\t}\n\t}\n\tif(!script) {\n\t\tneedAttach = true;\n\t\tscript = document.createElement('script');\n\n\t\tscript.charset = 'utf-8';\n\t\tscript.timeout = 120;\n\t\tif (__webpack_require__.nc) {\n\t\t\tscript.setAttribute(\"nonce\", __webpack_require__.nc);\n\t\t}\n\t\tscript.setAttribute(\"data-webpack\", dataWebpackPrefix + key);\n\n\t\tscript.src = url;\n\t}\n\tinProgress[url] = [done];\n\tvar onScriptComplete = function(prev, event) {\n\t\t// avoid mem leaks in IE.\n\t\tscript.onerror = script.onload = null;\n\t\tclearTimeout(timeout);\n\t\tvar doneFns = inProgress[url];\n\t\tdelete inProgress[url];\n\t\tscript.parentNode && script.parentNode.removeChild(script);\n\t\tdoneFns && doneFns.forEach(function(fn) { return fn(event); });\n\t\tif(prev) return prev(event);\n\t}\n\tvar timeout = setTimeout(onScriptComplete.bind(null, undefined, { type: 'timeout', target: script }), 120000);\n\tscript.onerror = onScriptComplete.bind(null, script.onerror);\n\tscript.onload = onScriptComplete.bind(null, script.onload);\n\tneedAttach && document.head.appendChild(script);\n};","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n// expose the modules object (__webpack_modules__)\n__webpack_require__.m = __webpack_modules__;\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = function(module) {\n\tvar getter = module && module.__esModule ?\n\t\tfunction() { return module['default']; } :\n\t\tfunction() { return module; };\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = function(exports, definition) {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.f = {};\n// This file contains only the entry chunk.\n// The chunk loading function for additional chunks\n__webpack_require__.e = function(chunkId) {\n\treturn Promise.all(Object.keys(__webpack_require__.f).reduce(function(promises, key) {\n\t\t__webpack_require__.f[key](chunkId, promises);\n\t\treturn promises;\n\t}, []));\n};","// This function allow to reference async chunks\n__webpack_require__.u = function(chunkId) {\n\t// return url for filenames based on template\n\treturn \"\" + ({\"142\":\"component---src-templates-project-tsx\",\"218\":\"component---src-pages-404-tsx\",\"317\":\"component---src-pages-projects-tsx\",\"351\":\"commons\",\"410\":\"component---src-pages-blog-tsx\",\"590\":\"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx\",\"675\":\"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx\",\"691\":\"component---src-pages-index-tsx\",\"823\":\"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx\",\"882\":\"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx\",\"886\":\"1254dea0549e67f9c6b7574de1277b85c557acbf\"}[chunkId] || chunkId) + \"-\" + {\"142\":\"2b0f8b1d26124b556601\",\"218\":\"e52900953c2998f1b976\",\"317\":\"dd50460c8c9595d66a51\",\"351\":\"3e3623170d8bfd1cd9fd\",\"410\":\"5f7059675b15af11c300\",\"590\":\"349bcd1144540fe9ca71\",\"675\":\"2d109719aed234f0e08d\",\"691\":\"3dd77113240175e3e611\",\"731\":\"57ca67b4bc099aebb100\",\"823\":\"5adf3b8163c9b41c8414\",\"843\":\"9e6b01c437ea801c1b7e\",\"882\":\"813d64ba0f45836bb668\",\"886\":\"5f6dfe8312ab1569d41e\"}[chunkId] + \".js\";\n};","// This function allow to reference all chunks\n__webpack_require__.miniCssF = function(chunkId) {\n\t// return url for filenames based on template\n\treturn \"\" + \"styles\" + \".\" + \"6c80396f0a4b75094c7c\" + \".css\";\n};","__webpack_require__.g = (function() {\n\tif (typeof globalThis === 'object') return globalThis;\n\ttry {\n\t\treturn this || new Function('return this')();\n\t} catch (e) {\n\t\tif (typeof window === 'object') return window;\n\t}\n})();","__webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }","// define __esModule on exports\n__webpack_require__.r = function(exports) {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","__webpack_require__.p = \"/\";","// no baseURI\n\n// object to store loaded and loading chunks\n// undefined = chunk not loaded, null = chunk preloaded/prefetched\n// [resolve, reject, Promise] = chunk loading, 0 = chunk loaded\nvar installedChunks = {\n\t658: 0,\n\t532: 0\n};\n\n__webpack_require__.f.j = function(chunkId, promises) {\n\t\t// JSONP chunk loading for javascript\n\t\tvar installedChunkData = __webpack_require__.o(installedChunks, chunkId) ? installedChunks[chunkId] : undefined;\n\t\tif(installedChunkData !== 0) { // 0 means \"already installed\".\n\n\t\t\t// a Promise means \"currently loading\".\n\t\t\tif(installedChunkData) {\n\t\t\t\tpromises.push(installedChunkData[2]);\n\t\t\t} else {\n\t\t\t\tif(!/^(532|658)$/.test(chunkId)) {\n\t\t\t\t\t// setup Promise in chunk cache\n\t\t\t\t\tvar promise = new Promise(function(resolve, reject) { installedChunkData = installedChunks[chunkId] = [resolve, reject]; });\n\t\t\t\t\tpromises.push(installedChunkData[2] = promise);\n\n\t\t\t\t\t// start chunk loading\n\t\t\t\t\tvar url = __webpack_require__.p + __webpack_require__.u(chunkId);\n\t\t\t\t\t// create error before stack unwound to get useful stacktrace later\n\t\t\t\t\tvar error = new Error();\n\t\t\t\t\tvar loadingEnded = function(event) {\n\t\t\t\t\t\tif(__webpack_require__.o(installedChunks, chunkId)) {\n\t\t\t\t\t\t\tinstalledChunkData = installedChunks[chunkId];\n\t\t\t\t\t\t\tif(installedChunkData !== 0) installedChunks[chunkId] = undefined;\n\t\t\t\t\t\t\tif(installedChunkData) {\n\t\t\t\t\t\t\t\tvar errorType = event && (event.type === 'load' ? 'missing' : event.type);\n\t\t\t\t\t\t\t\tvar realSrc = event && event.target && event.target.src;\n\t\t\t\t\t\t\t\terror.message = 'Loading chunk ' + chunkId + ' failed.\\n(' + errorType + ': ' + realSrc + ')';\n\t\t\t\t\t\t\t\terror.name = 'ChunkLoadError';\n\t\t\t\t\t\t\t\terror.type = errorType;\n\t\t\t\t\t\t\t\terror.request = realSrc;\n\t\t\t\t\t\t\t\tinstalledChunkData[1](error);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t};\n\t\t\t\t\t__webpack_require__.l(url, loadingEnded, \"chunk-\" + chunkId, chunkId);\n\t\t\t\t} else installedChunks[chunkId] = 0;\n\t\t\t}\n\t\t}\n};\n\n// no prefetching\n\n// no preloaded\n\n// no HMR\n\n// no HMR manifest\n\n__webpack_require__.O.j = function(chunkId) { return installedChunks[chunkId] === 0; };\n\n// install a JSONP callback for chunk loading\nvar webpackJsonpCallback = function(parentChunkLoadingFunction, data) {\n\tvar chunkIds = data[0];\n\tvar moreModules = data[1];\n\tvar runtime = data[2];\n\t// add \"moreModules\" to the modules object,\n\t// then flag all \"chunkIds\" as loaded and fire callback\n\tvar moduleId, chunkId, i = 0;\n\tif(chunkIds.some(function(id) { return installedChunks[id] !== 0; })) {\n\t\tfor(moduleId in moreModules) {\n\t\t\tif(__webpack_require__.o(moreModules, moduleId)) {\n\t\t\t\t__webpack_require__.m[moduleId] = moreModules[moduleId];\n\t\t\t}\n\t\t}\n\t\tif(runtime) var result = runtime(__webpack_require__);\n\t}\n\tif(parentChunkLoadingFunction) parentChunkLoadingFunction(data);\n\tfor(;i < chunkIds.length; i++) {\n\t\tchunkId = chunkIds[i];\n\t\tif(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {\n\t\t\tinstalledChunks[chunkId][0]();\n\t\t}\n\t\tinstalledChunks[chunkId] = 0;\n\t}\n\treturn __webpack_require__.O(result);\n}\n\nvar chunkLoadingGlobal = self[\"webpackChunkportfolio\"] = self[\"webpackChunkportfolio\"] || [];\nchunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));\nchunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));"],"names":["deferred","leafPrototypes","getProto","inProgress","dataWebpackPrefix","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","exports","module","__webpack_modules__","call","m","O","result","chunkIds","fn","priority","notFulfilled","Infinity","i","length","fulfilled","j","Object","keys","every","key","splice","r","n","getter","__esModule","d","a","getPrototypeOf","obj","__proto__","t","value","mode","this","then","ns","create","def","current","indexOf","getOwnPropertyNames","forEach","definition","o","defineProperty","enumerable","get","f","e","chunkId","Promise","all","reduce","promises","u","miniCssF","g","globalThis","Function","window","prop","prototype","hasOwnProperty","l","url","done","push","script","needAttach","scripts","document","getElementsByTagName","s","getAttribute","createElement","charset","timeout","nc","setAttribute","src","onScriptComplete","prev","event","onerror","onload","clearTimeout","doneFns","parentNode","removeChild","setTimeout","bind","type","target","head","appendChild","Symbol","toStringTag","p","installedChunks","installedChunkData","test","promise","resolve","reject","error","Error","errorType","realSrc","message","name","request","webpackJsonpCallback","parentChunkLoadingFunction","data","moreModules","runtime","some","id","chunkLoadingGlobal","self"],"sourceRoot":""}
\ No newline at end of file
diff --git a/webpack.stats.json b/webpack.stats.json
index cde2dc0..e570b92 100644
--- a/webpack.stats.json
+++ b/webpack.stats.json
@@ -1 +1 @@
-{"name":"build-javascript","namedChunkGroups":{"app":{"name":"app","assets":[{"name":"webpack-runtime-605beca16f3744607e3b.js","size":4631},{"name":"framework-e817803d957448322269.js","size":140759},{"name":"styles.6c80396f0a4b75094c7c.css","size":43362},{"name":"app-48e2fc747e435357e6ca.js","size":91058}],"filteredAssets":0,"assetsSize":279810,"filteredAuxiliaryAssets":3,"auxiliaryAssetsSize":696951},"component---src-pages-404-tsx":{"name":"component---src-pages-404-tsx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"component---src-pages-404-tsx-e52900953c2998f1b976.js","size":652}],"filteredAssets":0,"assetsSize":31455,"filteredAuxiliaryAssets":2,"auxiliaryAssetsSize":116383},"component---src-pages-blog-tsx":{"name":"component---src-pages-blog-tsx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","size":11360},{"name":"component---src-pages-blog-tsx-5f7059675b15af11c300.js","size":5165}],"filteredAssets":0,"assetsSize":47328,"filteredAuxiliaryAssets":3,"auxiliaryAssetsSize":206622},"component---src-pages-index-tsx":{"name":"component---src-pages-index-tsx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","size":11360},{"name":"component---src-pages-index-tsx-3dd77113240175e3e611.js","size":6288}],"filteredAssets":0,"assetsSize":48451,"filteredAuxiliaryAssets":3,"auxiliaryAssetsSize":206921},"component---src-pages-projects-tsx":{"name":"component---src-pages-projects-tsx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","size":11360},{"name":"component---src-pages-projects-tsx-dd50460c8c9595d66a51.js","size":14464}],"filteredAssets":0,"assetsSize":56627,"filteredAuxiliaryAssets":3,"auxiliaryAssetsSize":234968},"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx":{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js","size":8951}],"filteredAssets":0,"assetsSize":39754,"filteredAuxiliaryAssets":2,"auxiliaryAssetsSize":139563},"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx":{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js","size":28679}],"filteredAssets":0,"assetsSize":59482,"filteredAuxiliaryAssets":2,"auxiliaryAssetsSize":167934},"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx":{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js","size":11396}],"filteredAssets":0,"assetsSize":42199,"filteredAuxiliaryAssets":2,"auxiliaryAssetsSize":143164},"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx":{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js","size":30636}],"filteredAssets":0,"assetsSize":61439,"filteredAuxiliaryAssets":2,"auxiliaryAssetsSize":171334},"component---src-templates-project-tsx":{"name":"component---src-templates-project-tsx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","size":11360},{"name":"component---src-templates-project-tsx-2b0f8b1d26124b556601.js","size":14380}],"filteredAssets":0,"assetsSize":56543,"filteredAuxiliaryAssets":3,"auxiliaryAssetsSize":230178}},"assetsByChunkName":{"app":["webpack-runtime-605beca16f3744607e3b.js","framework-e817803d957448322269.js","styles.6c80396f0a4b75094c7c.css","app-48e2fc747e435357e6ca.js"],"component---src-pages-404-tsx":["commons-3e3623170d8bfd1cd9fd.js","component---src-pages-404-tsx-e52900953c2998f1b976.js"],"component---src-pages-blog-tsx":["commons-3e3623170d8bfd1cd9fd.js","1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","component---src-pages-blog-tsx-5f7059675b15af11c300.js"],"component---src-pages-index-tsx":["commons-3e3623170d8bfd1cd9fd.js","1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","component---src-pages-index-tsx-3dd77113240175e3e611.js"],"component---src-pages-projects-tsx":["commons-3e3623170d8bfd1cd9fd.js","1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","component---src-pages-projects-tsx-dd50460c8c9595d66a51.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx":["commons-3e3623170d8bfd1cd9fd.js","component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx":["commons-3e3623170d8bfd1cd9fd.js","component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx":["commons-3e3623170d8bfd1cd9fd.js","component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx":["commons-3e3623170d8bfd1cd9fd.js","component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-637c6389798f4553f4a4.js"],"component---src-templates-project-tsx":["commons-3e3623170d8bfd1cd9fd.js","1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","component---src-templates-project-tsx-2b0f8b1d26124b556601.js"]},"childAssetsByChunkName":{}}
\ No newline at end of file
+{"name":"build-javascript","namedChunkGroups":{"app":{"name":"app","assets":[{"name":"webpack-runtime-8343fc1e0704ae98e641.js","size":4631},{"name":"framework-e817803d957448322269.js","size":140759},{"name":"styles.6c80396f0a4b75094c7c.css","size":43362},{"name":"app-48e2fc747e435357e6ca.js","size":91058}],"filteredAssets":0,"assetsSize":279810,"filteredAuxiliaryAssets":3,"auxiliaryAssetsSize":696951},"component---src-pages-404-tsx":{"name":"component---src-pages-404-tsx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"component---src-pages-404-tsx-e52900953c2998f1b976.js","size":652}],"filteredAssets":0,"assetsSize":31455,"filteredAuxiliaryAssets":2,"auxiliaryAssetsSize":116383},"component---src-pages-blog-tsx":{"name":"component---src-pages-blog-tsx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","size":11360},{"name":"component---src-pages-blog-tsx-5f7059675b15af11c300.js","size":5165}],"filteredAssets":0,"assetsSize":47328,"filteredAuxiliaryAssets":3,"auxiliaryAssetsSize":206622},"component---src-pages-index-tsx":{"name":"component---src-pages-index-tsx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","size":11360},{"name":"component---src-pages-index-tsx-3dd77113240175e3e611.js","size":6288}],"filteredAssets":0,"assetsSize":48451,"filteredAuxiliaryAssets":3,"auxiliaryAssetsSize":206921},"component---src-pages-projects-tsx":{"name":"component---src-pages-projects-tsx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","size":11360},{"name":"component---src-pages-projects-tsx-dd50460c8c9595d66a51.js","size":14464}],"filteredAssets":0,"assetsSize":56627,"filteredAuxiliaryAssets":3,"auxiliaryAssetsSize":234968},"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx":{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js","size":8951}],"filteredAssets":0,"assetsSize":39754,"filteredAuxiliaryAssets":2,"auxiliaryAssetsSize":139563},"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx":{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js","size":28679}],"filteredAssets":0,"assetsSize":59482,"filteredAuxiliaryAssets":2,"auxiliaryAssetsSize":167934},"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx":{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js","size":11396}],"filteredAssets":0,"assetsSize":42199,"filteredAuxiliaryAssets":2,"auxiliaryAssetsSize":143164},"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx":{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js","size":32462}],"filteredAssets":0,"assetsSize":63265,"filteredAuxiliaryAssets":2,"auxiliaryAssetsSize":173958},"component---src-templates-project-tsx":{"name":"component---src-templates-project-tsx","assets":[{"name":"commons-3e3623170d8bfd1cd9fd.js","size":30803},{"name":"1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","size":11360},{"name":"component---src-templates-project-tsx-2b0f8b1d26124b556601.js","size":14380}],"filteredAssets":0,"assetsSize":56543,"filteredAuxiliaryAssets":3,"auxiliaryAssetsSize":230178}},"assetsByChunkName":{"app":["webpack-runtime-8343fc1e0704ae98e641.js","framework-e817803d957448322269.js","styles.6c80396f0a4b75094c7c.css","app-48e2fc747e435357e6ca.js"],"component---src-pages-404-tsx":["commons-3e3623170d8bfd1cd9fd.js","component---src-pages-404-tsx-e52900953c2998f1b976.js"],"component---src-pages-blog-tsx":["commons-3e3623170d8bfd1cd9fd.js","1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","component---src-pages-blog-tsx-5f7059675b15af11c300.js"],"component---src-pages-index-tsx":["commons-3e3623170d8bfd1cd9fd.js","1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","component---src-pages-index-tsx-3dd77113240175e3e611.js"],"component---src-pages-projects-tsx":["commons-3e3623170d8bfd1cd9fd.js","1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","component---src-pages-projects-tsx-dd50460c8c9595d66a51.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx":["commons-3e3623170d8bfd1cd9fd.js","component---src-templates-post-tsx-content-file-path-src-posts-2023-jwt-index-mdx-2d109719aed234f0e08d.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx":["commons-3e3623170d8bfd1cd9fd.js","component---src-templates-post-tsx-content-file-path-src-posts-2024-deploy-index-mdx-5adf3b8163c9b41c8414.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx":["commons-3e3623170d8bfd1cd9fd.js","component---src-templates-post-tsx-content-file-path-src-posts-2024-javascript-origin-index-mdx-349bcd1144540fe9ca71.js"],"component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx":["commons-3e3623170d8bfd1cd9fd.js","component---src-templates-post-tsx-content-file-path-src-posts-2024-streaming-index-mdx-813d64ba0f45836bb668.js"],"component---src-templates-project-tsx":["commons-3e3623170d8bfd1cd9fd.js","1254dea0549e67f9c6b7574de1277b85c557acbf-5f6dfe8312ab1569d41e.js","component---src-templates-project-tsx-2b0f8b1d26124b556601.js"]},"childAssetsByChunkName":{}}
\ No newline at end of file