Add guide type in front of the guide

pull/1657/head
Kamran Ahmed 2 years ago
parent 0d18c02b76
commit dac7e9605e
  1. 28
      content/guides.json
  2. 1
      lib/guide.ts
  3. 6
      pages/index.tsx

@ -4,6 +4,7 @@
"title": "Async and Defer Script Loading", "title": "Async and Defer Script Loading",
"description": "Learn how to avoid render blocking JavaScript using async and defer scripts.", "description": "Learn how to avoid render blocking JavaScript using async and defer scripts.",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-09-10T19:59:14.191Z", "updatedAt": "2021-09-10T19:59:14.191Z",
"createdAt": "2021-09-10T19:59:14.191Z" "createdAt": "2021-09-10T19:59:14.191Z"
@ -13,6 +14,7 @@
"title": "What are Web Vitals?", "title": "What are Web Vitals?",
"description": "Learn what are the core web vitals and how to measure them.", "description": "Learn what are the core web vitals and how to measure them.",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-09-05T19:59:14.191Z", "updatedAt": "2021-09-05T19:59:14.191Z",
"createdAt": "2021-09-05T19:59:14.191Z" "createdAt": "2021-09-05T19:59:14.191Z"
@ -22,6 +24,7 @@
"title": "SLIs, SLOs and SLAs", "title": "SLIs, SLOs and SLAs",
"description": "Learn what are different indicators for performance identification of any service.", "description": "Learn what are different indicators for performance identification of any service.",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-08-31T19:59:14.191Z", "updatedAt": "2021-08-31T19:59:14.191Z",
"createdAt": "2021-08-31T19:59:14.191Z" "createdAt": "2021-08-31T19:59:14.191Z"
@ -31,6 +34,7 @@
"title": "What is CI and CD?", "title": "What is CI and CD?",
"description": "Learn the basics of CI/CD and how to implement that with GitHub Actions.", "description": "Learn the basics of CI/CD and how to implement that with GitHub Actions.",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-07-09T19:59:14.191Z", "updatedAt": "2021-07-09T19:59:14.191Z",
"createdAt": "2021-07-09T19:59:14.191Z" "createdAt": "2021-07-09T19:59:14.191Z"
@ -40,6 +44,7 @@
"title": "SSO — Single Sign On", "title": "SSO — Single Sign On",
"description": "Learn the basics of SAML and understand how does Single Sign On work.", "description": "Learn the basics of SAML and understand how does Single Sign On work.",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-07-01T19:59:14.191Z", "updatedAt": "2021-07-01T19:59:14.191Z",
"createdAt": "2021-07-01T19:59:14.191Z" "createdAt": "2021-07-01T19:59:14.191Z"
@ -49,6 +54,7 @@
"title": "OAuth — Open Authorization", "title": "OAuth — Open Authorization",
"description": "Learn and understand what is OAuth and how it works", "description": "Learn and understand what is OAuth and how it works",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-06-28T19:59:14.191Z", "updatedAt": "2021-06-28T19:59:14.191Z",
"createdAt": "2021-06-28T19:59:14.191Z" "createdAt": "2021-06-28T19:59:14.191Z"
@ -58,6 +64,7 @@
"title": "JWT Authentication", "title": "JWT Authentication",
"description": "Understand what is JWT authentication and how is it implemented", "description": "Understand what is JWT authentication and how is it implemented",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-06-20T19:59:14.191Z", "updatedAt": "2021-06-20T19:59:14.191Z",
"createdAt": "2021-06-20T19:59:14.191Z" "createdAt": "2021-06-20T19:59:14.191Z"
@ -67,6 +74,7 @@
"title": "Token Based Authentication", "title": "Token Based Authentication",
"description": "Understand what is token based authentication and how it is implemented", "description": "Understand what is token based authentication and how it is implemented",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-06-02T20:59:14.191Z", "updatedAt": "2021-06-02T20:59:14.191Z",
"createdAt": "2021-06-02T20:59:14.191Z" "createdAt": "2021-06-02T20:59:14.191Z"
@ -76,6 +84,7 @@
"title": "Session Based Authentication", "title": "Session Based Authentication",
"description": "Understand what is session based authentication and how it is implemented", "description": "Understand what is session based authentication and how it is implemented",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-05-26T20:59:14.191Z", "updatedAt": "2021-05-26T20:59:14.191Z",
"createdAt": "2021-05-26T20:59:14.191Z" "createdAt": "2021-05-26T20:59:14.191Z"
@ -85,6 +94,7 @@
"title": "Basic Authentication", "title": "Basic Authentication",
"description": "Understand what is basic authentication and how it is implemented", "description": "Understand what is basic authentication and how it is implemented",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-05-19T20:59:14.191Z", "updatedAt": "2021-05-19T20:59:14.191Z",
"createdAt": "2021-05-19T20:59:14.191Z" "createdAt": "2021-05-19T20:59:14.191Z"
@ -94,6 +104,7 @@
"title": "Character Encodings", "title": "Character Encodings",
"description": "Covers the basics of character encodings and explains ASCII vs Unicode", "description": "Covers the basics of character encodings and explains ASCII vs Unicode",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-05-14T20:59:14.191Z", "updatedAt": "2021-05-14T20:59:14.191Z",
"createdAt": "2021-05-14T20:59:14.191Z" "createdAt": "2021-05-14T20:59:14.191Z"
@ -103,6 +114,7 @@
"title": "Unfamiliar Codebase", "title": "Unfamiliar Codebase",
"description": "Tips on getting getting familiar with an unfamiliar codebase", "description": "Tips on getting getting familiar with an unfamiliar codebase",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-05-04T20:59:14.191Z", "updatedAt": "2021-05-04T20:59:14.191Z",
"createdAt": "2021-05-04T20:59:14.191Z" "createdAt": "2021-05-04T20:59:14.191Z"
@ -112,6 +124,7 @@
"title": "Build it and they will come?", "title": "Build it and they will come?",
"description": "Why “build it and they will come” alone won’t work anymore", "description": "Why “build it and they will come” alone won’t work anymore",
"isNew": false, "isNew": false,
"type": "textual",
"authorUsername": "spekulatius", "authorUsername": "spekulatius",
"updatedAt": "2021-05-04T12:59:14.191Z", "updatedAt": "2021-05-04T12:59:14.191Z",
"createdAt": "2021-05-04T12:59:14.191Z" "createdAt": "2021-05-04T12:59:14.191Z"
@ -121,6 +134,7 @@
"title": "DHCP in One Picture", "title": "DHCP in One Picture",
"description": "Here is what happens when a new device joins the network.", "description": "Here is what happens when a new device joins the network.",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-04-28T15:48:21.191Z", "updatedAt": "2021-04-28T15:48:21.191Z",
"createdAt": "2021-04-28T15:48:21.191Z" "createdAt": "2021-04-28T15:48:21.191Z"
@ -130,6 +144,7 @@
"title": "SSL vs TLS vs SSH", "title": "SSL vs TLS vs SSH",
"description": "Quick tidbit on the differences between SSL, TLS, HTTPS and SSH", "description": "Quick tidbit on the differences between SSL, TLS, HTTPS and SSH",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-04-22T15:48:21.191Z", "updatedAt": "2021-04-22T15:48:21.191Z",
"createdAt": "2021-04-22T15:48:21.191Z" "createdAt": "2021-04-22T15:48:21.191Z"
@ -139,6 +154,7 @@
"title": "Asymptotic Notation", "title": "Asymptotic Notation",
"description": "Learn the basics of measuring the time and space complexity of algorithms", "description": "Learn the basics of measuring the time and space complexity of algorithms",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-04-03T15:48:21.191Z", "updatedAt": "2021-04-03T15:48:21.191Z",
"createdAt": "2021-04-03T15:48:21.191Z" "createdAt": "2021-04-03T15:48:21.191Z"
@ -148,6 +164,7 @@
"title": "Big-O Notation", "title": "Big-O Notation",
"description": "Easy to understand explanation of Big-O notation without any fancy terms", "description": "Easy to understand explanation of Big-O notation without any fancy terms",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-03-15T15:48:21.191Z", "updatedAt": "2021-03-15T15:48:21.191Z",
"createdAt": "2021-03-15T15:48:21.191Z" "createdAt": "2021-03-15T15:48:21.191Z"
@ -157,6 +174,7 @@
"title": "Random Numbers: Are they?", "title": "Random Numbers: Are they?",
"description": "Learn how they are generated and why they may not be truly random.", "description": "Learn how they are generated and why they may not be truly random.",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-03-14T15:48:21.191Z", "updatedAt": "2021-03-14T15:48:21.191Z",
"createdAt": "2021-03-14T15:48:21.191Z" "createdAt": "2021-03-14T15:48:21.191Z"
@ -166,6 +184,7 @@
"title": "Scaling Databases", "title": "Scaling Databases",
"description": "Learn the ups and downs of different database scaling strategies", "description": "Learn the ups and downs of different database scaling strategies",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2021-02-18T15:48:21.191Z", "updatedAt": "2021-02-18T15:48:21.191Z",
"createdAt": "2021-02-18T15:48:21.191Z" "createdAt": "2021-02-18T15:48:21.191Z"
@ -175,6 +194,7 @@
"title": "How does the internet work?", "title": "How does the internet work?",
"description": "Learn the basics of internet and everything involved with this short video series", "description": "Learn the basics of internet and everything involved with this short video series",
"isNew": false, "isNew": false,
"type": "textual",
"authorUsername": "dmytrobol", "authorUsername": "dmytrobol",
"updatedAt": "2021-02-29T15:48:21.191Z", "updatedAt": "2021-02-29T15:48:21.191Z",
"createdAt": "2021-02-29T15:48:21.191Z" "createdAt": "2021-02-29T15:48:21.191Z"
@ -184,6 +204,7 @@
"title": "Building a BitTorrent Client", "title": "Building a BitTorrent Client",
"description": "Learn everything you need to know about BitTorrent by writing a client in Go", "description": "Learn everything you need to know about BitTorrent by writing a client in Go",
"isNew": false, "isNew": false,
"type": "textual",
"authorUsername": "jesse", "authorUsername": "jesse",
"updatedAt": "2021-01-17T15:48:21.191Z", "updatedAt": "2021-01-17T15:48:21.191Z",
"createdAt": "2021-01-17T15:48:21.191Z", "createdAt": "2021-01-17T15:48:21.191Z",
@ -194,6 +215,7 @@
"title": "Levels of Seniority", "title": "Levels of Seniority",
"description": "How to Step Up as a Junior, Mid Level or a Senior Developer?", "description": "How to Step Up as a Junior, Mid Level or a Senior Developer?",
"isNew": false, "isNew": false,
"type": "textual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2020-12-03T12:13:00.860Z", "updatedAt": "2020-12-03T12:13:00.860Z",
"createdAt": "2020-12-03T12:13:00.860Z" "createdAt": "2020-12-03T12:13:00.860Z"
@ -203,6 +225,7 @@
"title": "Design Patterns for Humans", "title": "Design Patterns for Humans",
"description": "A language agnostic, ultra-simplified explanation to design patterns", "description": "A language agnostic, ultra-simplified explanation to design patterns",
"isNew": false, "isNew": false,
"type": "textual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2019-10-09T12:00:00.860Z", "updatedAt": "2019-10-09T12:00:00.860Z",
"createdAt": "2019-01-23T17:00:00.860Z" "createdAt": "2019-01-23T17:00:00.860Z"
@ -212,6 +235,7 @@
"title": "Journey to HTTP/2", "title": "Journey to HTTP/2",
"description": "The evolution of HTTP. How it all started and where we stand today", "description": "The evolution of HTTP. How it all started and where we stand today",
"isNew": false, "isNew": false,
"type": "textual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"createdAt": "2018-12-04T12:00:00.860Z", "createdAt": "2018-12-04T12:00:00.860Z",
"updatedAt": "2018-12-04T12:00:00.860Z", "updatedAt": "2018-12-04T12:00:00.860Z",
@ -222,6 +246,7 @@
"title": "DNS in One Picture", "title": "DNS in One Picture",
"description": "Quick illustrative guide on how a website is found on the internet.", "description": "Quick illustrative guide on how a website is found on the internet.",
"isNew": false, "isNew": false,
"type": "visual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"updatedAt": "2018-12-04T12:00:00.860Z", "updatedAt": "2018-12-04T12:00:00.860Z",
"createdAt": "2018-12-04T17:00:00.860Z" "createdAt": "2018-12-04T17:00:00.860Z"
@ -231,6 +256,7 @@
"title": "HTTP Caching", "title": "HTTP Caching",
"description": "Everything you need to know about web caching", "description": "Everything you need to know about web caching",
"isNew": false, "isNew": false,
"type": "textual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"createdAt": "2018-11-29T17:00:00.860Z", "createdAt": "2018-11-29T17:00:00.860Z",
"updatedAt": "2018-11-29T17:00:00.860Z" "updatedAt": "2018-11-29T17:00:00.860Z"
@ -240,6 +266,7 @@
"title": "Brief History of JavaScript", "title": "Brief History of JavaScript",
"description": "How JavaScript was introduced and evolved over the years", "description": "How JavaScript was introduced and evolved over the years",
"isNew": false, "isNew": false,
"type": "textual",
"authorUsername": "kamranahmedse", "authorUsername": "kamranahmedse",
"createdAt": "2017-10-28T17:00:00.860Z", "createdAt": "2017-10-28T17:00:00.860Z",
"updatedAt": "2017-10-28T17:00:00.860Z" "updatedAt": "2017-10-28T17:00:00.860Z"
@ -249,6 +276,7 @@
"title": "Proxy Servers", "title": "Proxy Servers",
"description": "How do proxy servers work and what are forward and reverse proxies?", "description": "How do proxy servers work and what are forward and reverse proxies?",
"isNew": false, "isNew": false,
"type": "textual",
"authorUsername": "ebrahimbharmal007", "authorUsername": "ebrahimbharmal007",
"createdAt": "2017-10-24T17:00:00.860Z", "createdAt": "2017-10-24T17:00:00.860Z",
"updatedAt": "2017-10-24T17:00:00.860Z" "updatedAt": "2017-10-24T17:00:00.860Z"

@ -11,6 +11,7 @@ export type GuideType = {
createdAt: string; createdAt: string;
updatedAt: string; updatedAt: string;
formattedCreatedAt?: string; formattedCreatedAt?: string;
type?: 'visual' | 'textual';
formattedUpdatedAt?: string; formattedUpdatedAt?: string;
authorUsername: string; authorUsername: string;
author?: AuthorType; author?: AuthorType;

@ -102,7 +102,7 @@ export default function Home(props: HomeProps) {
<Container maxW="container.md" position="relative"> <Container maxW="container.md" position="relative">
<Box pt="40px" mb="20px"> <Box pt="40px" mb="20px">
<Heading color="green.500" fontSize="25px" mb="5px"> <Heading color="green.500" fontSize="25px" mb="5px">
Visual Guides Guides
</Heading> </Heading>
</Box> </Box>
@ -112,8 +112,8 @@ export default function Home(props: HomeProps) {
key={guide.id} key={guide.id}
href={`/guides/${guide.id}`} href={`/guides/${guide.id}`}
title={guide.title} title={guide.title}
badgeText={guide.isNew ? 'NEW' : ''} badgeText={guide.isNew ? `NEW · ${(new Date(guide.createdAt)).toLocaleDateString('en-us', { month: 'long'})}` : ''}
subtitle={guide.formattedUpdatedAt!} subtitle={`${guide?.type?.charAt(0).toUpperCase()}${guide?.type?.slice(1)}`}
/> />
))} ))}
<DimmedMore href={'/guides'} text="View all Guides" /> <DimmedMore href={'/guides'} text="View all Guides" />

Loading…
Cancel
Save