diff --git a/src/components/InteractiveRoadmap/roadmap.js b/src/components/InteractiveRoadmap/roadmap.js index fe47af4c8..60c4e4ee1 100644 --- a/src/components/InteractiveRoadmap/roadmap.js +++ b/src/components/InteractiveRoadmap/roadmap.js @@ -1,6 +1,6 @@ -import { wireframeJSONToSVG } from "roadmap-renderer"; -import { Topic } from "./topic"; -import { Sharer } from "./sharer"; +import { wireframeJSONToSVG } from 'roadmap-renderer'; +import { Topic } from './topic'; +import { Sharer } from './sharer'; /** * @typedef {{ roadmapId: string, jsonUrl: string }} RoadmapConfig @@ -11,10 +11,10 @@ export class Roadmap { * @param {RoadmapConfig} config */ constructor() { - this.roadmapId = ""; - this.jsonUrl = ""; + this.roadmapId = ''; + this.jsonUrl = ''; - this.containerId = "roadmap-svg"; + this.containerId = 'roadmap-svg'; this.init = this.init.bind(this); this.onDOMLoaded = this.onDOMLoaded.bind(this); @@ -28,10 +28,16 @@ export class Roadmap { } prepareConfig() { + if (!this.containerEl) { + return false; + } + const dataset = this.containerEl.dataset; this.roadmapId = dataset.roadmapId; this.jsonUrl = dataset.jsonUrl; + + return true; } /** @@ -40,7 +46,7 @@ export class Roadmap { */ fetchRoadmapSvg(jsonUrl) { if (!jsonUrl) { - console.error("jsonUrl not defined in frontmatter"); + console.error('jsonUrl not defined in frontmatter'); return null; } @@ -50,13 +56,15 @@ export class Roadmap { }) .then(function (json) { return wireframeJSONToSVG(json, { - fontURL: "/fonts/balsamiq.woff2", + fontURL: '/fonts/balsamiq.woff2', }); }); } onDOMLoaded() { - this.prepareConfig(); + if (!this.prepareConfig()) { + return; + } this.fetchRoadmapSvg(this.jsonUrl) .then((svg) => { @@ -66,8 +74,8 @@ export class Roadmap { } handleRoadmapClick(e) { - const targetGroup = e.target.closest("g") || {}; - const groupId = targetGroup.dataset ? targetGroup.dataset.groupId : ""; + const targetGroup = e.target.closest('g') || {}; + const groupId = targetGroup.dataset ? targetGroup.dataset.groupId : ''; if (!groupId) { return; } @@ -75,7 +83,7 @@ export class Roadmap { e.stopImmediatePropagation(); window.dispatchEvent( - new CustomEvent("topic.click", { + new CustomEvent('topic.click', { detail: { topicId: groupId, roadmapId: this.roadmapId, @@ -85,8 +93,8 @@ export class Roadmap { } init() { - window.addEventListener("DOMContentLoaded", this.onDOMLoaded); - window.addEventListener("click", this.handleRoadmapClick); + window.addEventListener('DOMContentLoaded', this.onDOMLoaded); + window.addEventListener('click', this.handleRoadmapClick); } } diff --git a/src/components/InteractiveRoadmap/sharer.js b/src/components/InteractiveRoadmap/sharer.js index de728b079..9bd6c08a2 100644 --- a/src/components/InteractiveRoadmap/sharer.js +++ b/src/components/InteractiveRoadmap/sharer.js @@ -3,7 +3,7 @@ export class Sharer { this.init = this.init.bind(this); this.onScroll = this.onScroll.bind(this); - this.shareIconsId = "page-share-icons"; + this.shareIconsId = 'page-share-icons'; } get shareIconsEl() { @@ -12,14 +12,18 @@ export class Sharer { onScroll() { if (window.scrollY < 100 || window.innerWidth < 1050) { - this.shareIconsEl.classList.add("hidden"); + this.shareIconsEl.classList.add('hidden'); return null; } - this.shareIconsEl.classList.remove("hidden"); + this.shareIconsEl.classList.remove('hidden'); } init() { - window.addEventListener("scroll", this.onScroll, { passive: true }); + if (!this.shareIconsEl) { + return; + } + + window.addEventListener('scroll', this.onScroll, { passive: true }); } -} \ No newline at end of file +} diff --git a/src/components/MarkdownRoadmap.astro b/src/components/MarkdownRoadmap.astro index 11f586503..95b0ac6c6 100644 --- a/src/components/MarkdownRoadmap.astro +++ b/src/components/MarkdownRoadmap.astro @@ -1,9 +1,24 @@ --- -import "../styles/prism.css"; +import '../styles/prism.css'; +import DownloadPopup from './DownloadPopup.astro'; +import ShareIcons from './ShareIcons.astro'; +import SubscribePopup from './SubscribePopup.astro'; + +export interface Props { + roadmapId: string; + description: string; +} + +const { roadmapId, description } = Astro.props; --- -
-
+
+
+ + +
diff --git a/src/pages/[roadmapId]/index.astro b/src/pages/[roadmapId]/index.astro index bc46cfc62..4ee6c30c7 100644 --- a/src/pages/[roadmapId]/index.astro +++ b/src/pages/[roadmapId]/index.astro @@ -53,7 +53,10 @@ const roadmapData = roadmapFile.frontmatter as RoadmapFrontmatter; { !roadmapData.isUpcoming && !roadmapData.jsonUrl && ( - + ) diff --git a/src/roadmaps/backend/content/104-version-control-systems/101-git.md b/src/roadmaps/backend/content/104-version-control-systems/101-git.md new file mode 100644 index 000000000..420db4651 --- /dev/null +++ b/src/roadmaps/backend/content/104-version-control-systems/101-git.md @@ -0,0 +1,10 @@ +# Git + +[Git](https://git-scm.com/) is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency. + +Visit the following resources to learn more: + +- [Learn Git on the command line](https://github.com/jlord/git-it-electron) +- [Version Control System Introduction](https://www.youtube.com/watch?v=zbKdDsNNOhg) +- [Git & GitHub Crash Course For Beginners](https://www.youtube.com/watch?v=SWYqp7iY_Tc) +- [Learn Git in 20 Minutes](https://youtu.be/Y9XZQO1n_7c?t=21) \ No newline at end of file