Fix linting issues

.eslintrc

@@ -7,6 +7,7 @@
   "rules": {
     "@next/next/no-img-element": [
       "off"
-    ]
+    ],
+    "react/display-name": ["off"]
   }
 }

components/content-page-header.tsx

@@ -35,7 +35,7 @@ export function ContentPageHeader(props: ContentPageHeaderProps) {
                 fontWeight={600}
                 color='gray.500'
               >
-                <Image rounded={'full'} mr='7px' w='22px' src={author.picture} />
+                <Image alt={author.name} rounded={'full'} mr='7px' w='22px' src={author.picture} />
                 {author.name}
               </Link>
               <Text d={['none', 'inline', 'inline']} mx='7px' color='gray.500' as='span'>&middot;</Text>

components/footer.tsx

@@ -40,7 +40,7 @@ export function Footer() {
           <Flex spacing={0} alignItems='center' color='gray.400'>
             <Link d='flex' alignItems='center' fontWeight={600} _hover={{ textDecoration: 'none', color: 'white' }}
                   href='/'>
-              <Image h='25px' w='25px' src='/logo.svg' mr='6px' />
+              <Image alt='' h='25px' w='25px' src='/logo.svg' mr='6px' />
               roadmap.sh
             </Link>
             <Text as='span' mx='7px'>by</Text>

components/global-header.tsx

@@ -98,7 +98,7 @@ export function GlobalHeader() {
                   fontWeight={600}
                   _hover={{ textDecoration: 'none' }}
                   fontSize='18px'>
-              <Image h='30px' w='30px' src='/logo.svg' mr='10px' />
+              <Image alt='' h='30px' w='30px' src='/logo.svg' mr='10px' />
               <Text d={['block', 'none', 'block']} as='span'>roadmap.sh</Text>
             </Link>
           </Box>

package.json

@@ -2,9 +2,12 @@
   "name": "roadmap-next",
   "version": "0.1.0",
   "private": true,
+  "license": "BSD-4-Clause",
   "scripts": {
-    "dev": "next dev",
-    "build": "next build",
+    "dev": "NODE_ENV=dev next",
+    "serve:out": "serve out",
+    "build": "./scripts/build.sh",
+    "deploy": "NODE_DEBUG=gh-pages gh-pages -d out -t",
     "start": "next start",
     "lint": "next lint",
     "meta:sitemap": "node scripts/sitemap.js",
@@ -36,9 +39,11 @@
     "eslint": "7.32.0",
     "eslint-config-next": "11.0.1",
     "eslint-config-prettier": "^8.3.0",
+    "gh-pages": "^3.2.3",
     "glob": "^7.1.7",
     "husky": "^7.0.1",
     "pretty-quick": "^3.1.1",
+    "serve": "^12.0.0",
     "typescript": "4.3.5"
   },
   "husky": {

pages/about.tsx

@@ -17,7 +17,7 @@ function AboutHeader() {
       />
       <Container maxW='container.md' position='relative' textAlign='left'>
         <Flex alignItems='center'>
-          <Image d={['none', 'none', 'block']} src='/kamran.jpeg' h='170px' rounded='10px' mr='25px' />
+          <Image alt={'Kamran'} d={['none', 'none', 'block']} src='/kamran.jpeg' h='170px' rounded='10px' mr='25px' />
           <Box>
             <Heading as='h1' color='black' fontSize={['35px', '35px', '40px']} fontWeight={700} mb='10px'>Hello, I am
               Kamran Ahmed

pages/thanks.tsx

@@ -35,6 +35,7 @@ export default function Thanks() {
                   grateful for that.</Text>
               </Box>
               <Image width='190px'
+                     alt={''}
                      rounded='100%'
                      src='https://media.giphy.com/media/l0HUgXEoxsNZjZNq8/giphy.gif?cid=790b76114c74e11ed7ce8d65995b6893524407ed7b7748bc&rid=giphy.gif&ct=g'
                      ml='50px'
@@ -48,18 +49,21 @@ export default function Thanks() {
               <Stack spacing='10px'>
                 <Box borderWidth={1} borderRadius='5px' p='20px' bg='teal.50'>
                   <Image
+                    alt='OSS Capital'
                     w='400px'
                     src='/sponsors/oss-capital-logo.svg'
                   />
                 </Box>
                 <Box borderWidth={1} borderRadius='5px' p='20px' bg='teal.50'>
                   <Image
+                    alt='Forbes'
                     w='250px'
                     src='/sponsors/forbes-logo.png'
                   />
                 </Box>
                 <Box borderWidth={1} borderRadius='5px' p='20px' bg='teal.50'>
                   <Image
+                    alt='Zalando'
                     w='300px'
                     src='/sponsors/zalando-logo.svg'
                   />

scripts/build.sh

@@ -0,0 +1,6 @@
+#!/usr/bin/env bash
+
+NODE_ENV=prod next build
+NODE_ENV=prod next export
+echo 'roadmap.sh' > out/CNAME
+touch out/.nojekyll