Add resources setup

pull/1331/head
Kamran Ahmed 5 years ago
parent cf648924cf
commit d73e08f8f6
  1. 9
      components/link/badge-link.js
  2. 2
      components/md-renderer/mdx-components/index.js
  3. 2
      components/roadmap-header/index.js
  4. 9
      content/roadmaps/1-frontend/resources.md

@ -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 { Img } from './img';
import EnrichedLink from './a';
import { BadgeLink } from '../../link/badge-link';
const MdxComponents = {
p: P,
@ -16,6 +17,7 @@ const MdxComponents = {
table: Table,
iframe: IFrame,
img: Img,
BadgeLink: BadgeLink
};
export default MdxComponents;

@ -43,7 +43,6 @@ const RoadmapHeader = ({ roadmap, page = 'landscape' }) => (
</BadgesList>
<MenuItems className="border-bottom">
<div className='d-none'>
<Link href={ `${roadmap.url}` } passHref>
<MenuItemLink className={ classNames({ active: page === 'landscape', }) }>Landscape</MenuItemLink>
</Link>
@ -53,7 +52,6 @@ const RoadmapHeader = ({ roadmap, page = 'landscape' }) => (
{/*<Link href={ `${roadmap.url}/resources` } passHref>*/}
{/* <MenuItemLink className={ classNames({ active: false, }) }>Project Ideas</MenuItemLink>*/}
{/*</Link>*/}
</div>
</MenuItems>
</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.
* [How the internet works in 5 minutes](https://www.youtube.com/watch?v=7_LPdttKXPc) 👀
* [What is the Internet](https://www.youtube.com/watch?v=Dxcc6ycZ73M)
* [The Internet: IP Addresses & DNS](https://www.youtube.com/watch?v=5o8CwafCxnU)
* [The Internet: Packets, Routing & Reliability](https://www.youtube.com/watch?v=AYdF7b3nMto)
* <BadgeLink badgeText='Read' href='/guides/what-is-internet'>What is Internet?</BadgeLink>
* <BadgeLink variant='success' badgeText='Watch' href='https://www.youtube.com/watch?v=7_LPdttKXPc'>How the internet works in 5 minutes</BadgeLink>
* What is HTTP, how it evolved and where is it now?
* How do the browsers work? Engines behind different browsers
* What is DNS? How a website is found on the internet?
* What's in a domain name? What is an IP Address?
* What is Web Hosting?
## Learn HTML
HTML helps you build the pages

Loading…
Cancel
Save