From 022196436218301df03eb2eecff347b4b6e4229a Mon Sep 17 00:00:00 2001 From: Kamran Ahmed Date: Wed, 8 Dec 2021 13:47:51 +0100 Subject: [PATCH] Add interactive button --- components/roadmap/roadmap-page-header.tsx | 98 ++++++++++++------- .../102-browsers-and-how-they-work.md | 7 ++ .../100-internet/103-dns-and-how-it-works.md | 6 ++ .../100-internet/104-what-is-domain-name.md | 7 ++ .../100-internet/105-what-is-hosting.md | 7 ++ public/sitemap.xml | 2 +- 6 files changed, 88 insertions(+), 39 deletions(-) diff --git a/components/roadmap/roadmap-page-header.tsx b/components/roadmap/roadmap-page-header.tsx index 3337fee73..39b74be3b 100644 --- a/components/roadmap/roadmap-page-header.tsx +++ b/components/roadmap/roadmap-page-header.tsx @@ -4,6 +4,7 @@ import { Box, Button, Container, + Flex, Heading, Link, Stack, @@ -11,6 +12,7 @@ import { } from '@chakra-ui/react'; import { AtSignIcon, DownloadIcon } from '@chakra-ui/icons'; import React from 'react'; +import { useRouter } from 'next/router'; type RoadmapPageHeaderType = { roadmap: RoadmapType; @@ -18,6 +20,9 @@ type RoadmapPageHeaderType = { export function RoadmapPageHeader(props: RoadmapPageHeaderType) { const { roadmap } = props; + const router = useRouter() + + const isInteractive = router.pathname.includes('/interactive'); return ( {roadmap.description} - - - - {roadmap.pdfUrl && ( + + + + {roadmap.pdfUrl && ( + + )} + + + {roadmap.id === 'frontend' && !isInteractive && ( + )} - - + ); diff --git a/content/roadmaps/100-frontend/content/100-internet/102-browsers-and-how-they-work.md b/content/roadmaps/100-frontend/content/100-internet/102-browsers-and-how-they-work.md index 141439a53..4d21914ab 100644 --- a/content/roadmaps/100-frontend/content/100-internet/102-browsers-and-how-they-work.md +++ b/content/roadmaps/100-frontend/content/100-internet/102-browsers-and-how-they-work.md @@ -1 +1,8 @@ # Browsers + +A web browser is a software application that enables a user to access and display web pages or other online content through its graphical user interface. + +Free Content +How Browsers Work +Role of Rendering Engine in Browsers +Populating the Page: How Browsers Work diff --git a/content/roadmaps/100-frontend/content/100-internet/103-dns-and-how-it-works.md b/content/roadmaps/100-frontend/content/100-internet/103-dns-and-how-it-works.md index 5947d3e95..331e76de0 100644 --- a/content/roadmaps/100-frontend/content/100-internet/103-dns-and-how-it-works.md +++ b/content/roadmaps/100-frontend/content/100-internet/103-dns-and-how-it-works.md @@ -1 +1,7 @@ # DNS +The Domain Name System (DNS) is the phonebook of the Internet. Humans access information online through domain names, like nytimes.com or espn.com. Web browsers interact through Internet Protocol (IP) addresses. DNS translates domain names to IP addresses so browsers can load Internet resources. + +Free Content +What is DNS? +DNS and How does it Work? +DNS Records diff --git a/content/roadmaps/100-frontend/content/100-internet/104-what-is-domain-name.md b/content/roadmaps/100-frontend/content/100-internet/104-what-is-domain-name.md index 7755ea061..fcd593a98 100644 --- a/content/roadmaps/100-frontend/content/100-internet/104-what-is-domain-name.md +++ b/content/roadmaps/100-frontend/content/100-internet/104-what-is-domain-name.md @@ -1 +1,8 @@ # Domain Name + +A domain name is a unique, easy-to-remember address used to access websites, such as ‘google.com’, and ‘facebook.com’. Users can connect to websites using domain names thanks to the DNS system. + +Free Content +What is a Domain Name? +What is a Domain Name? | Domain name vs. URL +A Beginners Guide to How Domain Names Work diff --git a/content/roadmaps/100-frontend/content/100-internet/105-what-is-hosting.md b/content/roadmaps/100-frontend/content/100-internet/105-what-is-hosting.md index 6d3489888..cb4638131 100644 --- a/content/roadmaps/100-frontend/content/100-internet/105-what-is-hosting.md +++ b/content/roadmaps/100-frontend/content/100-internet/105-what-is-hosting.md @@ -1 +1,8 @@ # Hosting + +Web hosting is an online service that allows you to publish your website files onto the internet. So, anyone who has access to the internet has access to your website. + +Free Content +What Is Web Hosting? Explained +Different Types of Web Hosting Explained +Where to Host a Fullstack Project on a Budget diff --git a/public/sitemap.xml b/public/sitemap.xml index 098977e56..91bc8e987 100644 --- a/public/sitemap.xml +++ b/public/sitemap.xml @@ -3,7 +3,7 @@ https://roadmap.sh/frontend monthly - 2021-12-07T13:12:30.171Z + 2021-12-07T20:45:44.001Z 1.0