Add resources setup
This commit is contained in:
9
components/link/badge-link.js
Normal file
9
components/link/badge-link.js
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
export function BadgeLink({ target='_blank', variant ='primary', badgeText, href, children }) {
|
||||||
|
return (
|
||||||
|
<p className='mb-0'>
|
||||||
|
<a href={href} target={ target }>
|
||||||
|
<span style={{ position: 'relative', top: '-2px'}} className={`badge badge-${variant}`}>{badgeText}</span> { children }
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
);
|
||||||
|
}
|
@ -6,6 +6,7 @@ import { Table } from './table';
|
|||||||
import { IFrame } from './iframe';
|
import { IFrame } from './iframe';
|
||||||
import { Img } from './img';
|
import { Img } from './img';
|
||||||
import EnrichedLink from './a';
|
import EnrichedLink from './a';
|
||||||
|
import { BadgeLink } from '../../link/badge-link';
|
||||||
|
|
||||||
const MdxComponents = {
|
const MdxComponents = {
|
||||||
p: P,
|
p: P,
|
||||||
@ -16,6 +17,7 @@ const MdxComponents = {
|
|||||||
table: Table,
|
table: Table,
|
||||||
iframe: IFrame,
|
iframe: IFrame,
|
||||||
img: Img,
|
img: Img,
|
||||||
|
BadgeLink: BadgeLink
|
||||||
};
|
};
|
||||||
|
|
||||||
export default MdxComponents;
|
export default MdxComponents;
|
||||||
|
@ -43,7 +43,6 @@ const RoadmapHeader = ({ roadmap, page = 'landscape' }) => (
|
|||||||
</BadgesList>
|
</BadgesList>
|
||||||
|
|
||||||
<MenuItems className="border-bottom">
|
<MenuItems className="border-bottom">
|
||||||
<div className='d-none'>
|
|
||||||
<Link href={ `${roadmap.url}` } passHref>
|
<Link href={ `${roadmap.url}` } passHref>
|
||||||
<MenuItemLink className={ classNames({ active: page === 'landscape', }) }>Landscape</MenuItemLink>
|
<MenuItemLink className={ classNames({ active: page === 'landscape', }) }>Landscape</MenuItemLink>
|
||||||
</Link>
|
</Link>
|
||||||
@ -53,7 +52,6 @@ const RoadmapHeader = ({ roadmap, page = 'landscape' }) => (
|
|||||||
{/*<Link href={ `${roadmap.url}/resources` } passHref>*/}
|
{/*<Link href={ `${roadmap.url}/resources` } passHref>*/}
|
||||||
{/* <MenuItemLink className={ classNames({ active: false, }) }>Project Ideas</MenuItemLink>*/}
|
{/* <MenuItemLink className={ classNames({ active: false, }) }>Project Ideas</MenuItemLink>*/}
|
||||||
{/*</Link>*/}
|
{/*</Link>*/}
|
||||||
</div>
|
|
||||||
</MenuItems>
|
</MenuItems>
|
||||||
|
|
||||||
</Header>
|
</Header>
|
||||||
|
@ -5,12 +5,13 @@ Before I go ahead and list down the resources, please know that the roadmap and
|
|||||||
|
|
||||||
Get the basic understanding of internet, browsers, networks and other relevant knowledge.
|
Get the basic understanding of internet, browsers, networks and other relevant knowledge.
|
||||||
|
|
||||||
* [How the internet works in 5 minutes](https://www.youtube.com/watch?v=7_LPdttKXPc) 👀
|
* <BadgeLink badgeText='Read' href='/guides/what-is-internet'>What is Internet?</BadgeLink>
|
||||||
* [What is the Internet](https://www.youtube.com/watch?v=Dxcc6ycZ73M)
|
* <BadgeLink variant='success' badgeText='Watch' href='https://www.youtube.com/watch?v=7_LPdttKXPc'>How the internet works in 5 minutes</BadgeLink>
|
||||||
* [The Internet: IP Addresses & DNS](https://www.youtube.com/watch?v=5o8CwafCxnU)
|
|
||||||
* [The Internet: Packets, Routing & Reliability](https://www.youtube.com/watch?v=AYdF7b3nMto)
|
|
||||||
* What is HTTP, how it evolved and where is it now?
|
* What is HTTP, how it evolved and where is it now?
|
||||||
* How do the browsers work? Engines behind different browsers
|
* How do the browsers work? Engines behind different browsers
|
||||||
* What is DNS? How a website is found on the internet?
|
* What is DNS? How a website is found on the internet?
|
||||||
* What's in a domain name? What is an IP Address?
|
* What's in a domain name? What is an IP Address?
|
||||||
* What is Web Hosting?
|
* What is Web Hosting?
|
||||||
|
|
||||||
|
## Learn HTML
|
||||||
|
HTML helps you build the pages
|
||||||
|
Reference in New Issue
Block a user