Fix iframe in the videos

bin/content-migrator.js

@@ -25,13 +25,13 @@ roadmapDirs.forEach((roadmapDirName) => {
   const roadmapDirPath = path.join(roadmapsDir, roadmapDirName);
   const contentDirPath = path.join(roadmapDirPath, 'content');
 
+  console.log(`[Start] == Migrating ${roadmapDirName}`);
+
   if (!fs.existsSync(contentDirPath)) {
     console.log(`Content dir not found ${roadmapDirName}/content`);
     return;
   }
 
-  console.log(`[Start] == Migrating ${roadmapDirName}`);
-
   function handleContentDir(parentDirPath) {
     const dirChildrenNames = fs.readdirSync(parentDirPath);
 
@@ -190,5 +190,5 @@ roadmapDirs.forEach((roadmapDirName) => {
   const topicRefFileContent = '';
   fs.writeFileSync(topicRefFilePath, `---\n${topicRefFrontMatter}---\n\n${topicRefFileContent}`);
 
-  console.log(`    [End] == Migrated ${roadmapDirName}`);
+  console.log(`        == Migrated ${roadmapDirName}`);
 });

bin/legacy.sh

@@ -7,14 +7,22 @@ if [ ! -d "./developer-roadmap" ]; then
   git clone --depth 1 -b master git@github.com:kamranahmedse/developer-roadmap.git
 fi
 
-echo "Removing old directories"
+echo -e "\nRemoving old directories"
 rm -rf ../src/videos
 rm -rf ../src/guides
 rm -rf ../src/roadmaps
 
 rm -rf ../src/assets/jsons
 rm -rf ../src/assets/pdfs
 
+echo -e "\n=== Migrating Roadmaps ==="
 node roadmap-migrator.js
+
+echo -e "\n=== Migrating Content ==="
 node content-migrator.js
+
+echo -e "\n=== Migrating Guides ==="
 node guide-migrator.js
+
+echo -e "\n=== Migrating Videos ==="
+node video-migrator.js

bin/video-migrator.js

@@ -1,29 +1,47 @@
 const fs = require('fs');
 const path = require('path');
 const yaml = require('json-to-pretty-yaml');
-const videos = require('./data/videos.json');
+
+const contentDirPath = path.join(__dirname, './developer-roadmap/content');
+const videos = require('./developer-roadmap/content/videos.json');
+
+// Remove the old videos directory
+const newVideosDirPath = path.join(__dirname, '../src/videos');
+if (fs.existsSync(newVideosDirPath)) {
+  fs.rmSync(newVideosDirPath, { recursive: true });
+}
+
+fs.mkdirSync(newVideosDirPath);
 
 videos.forEach((video) => {
   const { id: videoId } = video;
 
-  const videoPath = path.join(__dirname, `../src/videos/${videoId}.md`);
-  const videoWithoutFrontmatter = fs.readFileSync(videoPath, 'utf8');
-  const videoFrontMatter = yaml.stringify({
-    layout: 'layouts/video.njk',
-    title: video.title,
-    description: video.description,
-    duration: video.duration,
-    isNew: video.isNew,
-    date: video.createdAt.replace(/T.*/, ''),
-    sitemap: {
-      priority: 0.7,
-      changefreq: 'weekly',
-    },
-    tags: ['video', `${video.type}-video`, `video-sitemap`],
-  });
-
-  const videoWithFrontmatter = `---\n${videoFrontMatter}---\n\n${videoWithoutFrontmatter}`;
+  const originalVideoPath = path.join(contentDirPath, 'videos', `${videoId}.md`);
+  const newVideoPath = path.join(__dirname, `../src/videos/${videoId}.md`);
+
+  const videoWithoutFrontmatter = fs.readFileSync(originalVideoPath, 'utf8');
+  fs.copyFileSync(originalVideoPath, newVideoPath);
+
+  const videoFrontMatter = yaml
+    .stringify({
+      layout: 'layouts/video.njk',
+      title: video.title,
+      description: video.description,
+      duration: video.duration,
+      isNew: video.isNew,
+      date: video.createdAt.replace(/T.*/, ''),
+      sitemap: {
+        priority: 0.7,
+        changefreq: 'weekly',
+      },
+      tags: ['video', `video-sitemap`],
+    })
+    .replace(/date: "(.+?)"/, 'date: $1');
+
+  const videoWithIframeClass = videoWithoutFrontmatter.replace(/<iframe/g, '<iframe class="w-full aspect-video mb-5"');
+
+  const videoWithFrontmatter = `---\n${videoFrontMatter}---\n\n${videoWithIframeClass}`;
 
   console.log(`Writing video ${videoId} to disk`);
-  fs.writeFileSync(videoPath, videoWithFrontmatter);
+  fs.writeFileSync(newVideoPath, videoWithFrontmatter);
 });

src/videos/acid-explained.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "ACID Explained"
+description: "Learn what it means for a database to be ACID compliant with examples."
+duration: "5 minutes"
+isNew: false
+date: 2021-09-26
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/yaQ5YMWkxq4" title="Acid Explained with Examples" />

src/videos/all-about-http-caching.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "All about HTTP Caching"
+description: "Learn what is HTTP caching, places for caching and different caching headers."
+duration: "13 minutes"
+isNew: false
+date: 2020-10-04
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/HiBDZgTNpXY" title="All about HTTP Caching" />

src/videos/array-structure.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "All about Array Data Structure"
+description: "Learn everything you need to know about array data structure"
+duration: "10 minutes"
+isNew: false
+date: 2022-01-09
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/QJNwK2uJyGs" title="Array Data Structure" />

src/videos/arrays-and-objects-in-javascript.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "Arrays and Objects in JavaScript"
+description: "Learn how to manipulate arrays and objects in JavaScript."
+duration: "12 minutes"
+isNew: false
+date: 2020-05-09
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/n3NKGsM3iEw" title="Arrays and Objects in JavaScript" />

src/videos/async-javascript.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "Asynchronous JavaScript"
+description: "Learn how to write asynchronous JavaScript using Async/Await"
+duration: "15 minutes"
+isNew: false
+date: 2021-11-14
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/VyIK6SV5f7o" title="Asynchronous JavaScript" />

src/videos/basic-authentication.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "Basic Authentication"
+description: "Learn everything you need to know about basic authentication"
+duration: "5 minutes"
+isNew: true
+date: 2022-10-01
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/mwccHwUn7Gc" title="Basic Authentication | Authentication Series" />

src/videos/basics-of-authentication.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "Basics of Authentication"
+description: "Learn everything you need to know about authentication with this Authentication Series"
+duration: "5 minutes"
+isNew: true
+date: 2022-09-21
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/Mcyt9SrZT6g" title="Basics of Authentication" />

src/videos/big-o-notation.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "Big O Notation"
+description: "Learn what the Big-O notation is and how to calculate the time complexity of an algorithm."
+duration: "8 minutes"
+isNew: false
+date: 2021-10-25
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/Z0bH0cMY0E8" title="Big O Notation — Calculating Time Complexity" />

src/videos/content-delivery-networks.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "Content Delivery Networks"
+description: "Learn what the CDNs are and the difference between push CDN vs pull CDN."
+duration: "4 minutes"
+isNew: false
+date: 2020-09-26
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/6DXEPcXKQNY" title="Content Delivery Networks" />

src/videos/dns-explained.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "DNS and how does it work?"
+description: "Learn what the DNS is and how a website is found on the internet."
+duration: "5 minutes"
+isNew: false
+date: 2020-08-17
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/Wj0od2ag5sk" title="DNS and how does it work?" />

src/videos/dns-records.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "DNS Records"
+description: "Learn what the DNS is and how a website is found on the internet."
+duration: "6 minutes"
+isNew: false
+date: 2020-08-31
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/7lxgpKh_fRY" title="DNS Records" />

src/videos/floating-point-arithmetic.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "Floating Point Arithmetic"
+description: "Learn how ow the arithmetic operations work on floating-point numbers and why the results might be different from what you may expect."
+duration: "4 minutes"
+isNew: false
+date: 2021-10-10
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/RIiq4tTt6rI" title="Floating Point Arithmetic" />

src/videos/freeze-and-seal-objects-in-javascript.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "Freeze and Seal in JavaScript"
+description: "Learn what is object freeze and seal in JavaScript and how to use them"
+duration: "6 minutes"
+isNew: false
+date: 2020-10-16
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/O3uT2l6vgZ8" title="Freeze and Seal in JavaScript" />

src/videos/graph-data-structure.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "Graph Data Structure"
+description: "Learn everything you need to know about the graph data structure"
+duration: "13 minutes"
+isNew: false
+date: 2022-09-08
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/0sQE8zKhad0" title="Graph Data Structure" />

src/videos/hash-table-data-structure.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "Hash Table Data Structure"
+description: "Learn everything you need to know about the hash table data structure"
+duration: "8 minutes"
+isNew: false
+date: 2022-02-21
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/jalSiaIi8j4" title="Hash Table Data Structure" />

src/videos/heap-data-structure.md

@@ -0,0 +1,16 @@
+---
+layout: "layouts/video.njk"
+title: "Heap Data Structure"
+description: "Learn everything you need to know about the heap data structure"
+duration: "11 minutes"
+isNew: false
+date: 2022-08-24
+sitemap:
+  priority: 0.7
+  changefreq: "weekly"
+tags:
+  - "video"
+  - "video-sitemap"
+---
+
+<iframe class="w-full aspect-video mb-5" src="https://www.youtube.com/embed/F_r0sJ1RqWk" title="Heap Data Structure" />