/mekel.dev

My personal blog built using Next.js and Strapi CMS.

Primary LanguageTypeScript

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying pages/index.js. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.js.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Bugs 🐞

  • Error when bad user open route that not listed by getStaticPath() method on /post/[slug].tsx
  • Navbar logo and darkmode toogle unresponsive on small devices. Can be solved by specifying the correct padding and margin or make flexbox container (I think)
  • Lighthouse performance bug caused by next/Image (Ref: Lighthouse & Next.js)
  • Translating the page using Microsoft Edge causing card to overflow (pages/index.tsx)
  • terminal-in-react@4.3.1 can't provide TypeScript props to component

To Do List 👀

  • Change data fetching method using GraphQL
  • Add dark mode and animation
  • Add Disqus API for comment section
  • Add readmore at the end of the post
  • Add portfolio page
  • Add custom loading spinner
  • Improve SEO
  • Improve best practice
  • Reach perfect score on lighthouse
  • Add custom 404 error and 500 error
  • Test some possible security vulnerabilities using ZAP & BurpSuite
  • Add typescript interfaces to prevent future bug
  • Add code tag renderer for react-markdown