upgrAde blog to next.js 14.1

i have not update my blog for almost 8 mouths from may 2023. next.js has already been upgraded to the verion of 14.1.0 so it is a time to start upgrading my blog to the latest version of next.js.

upgrAde from 13.4 to 14.1

1. switch pages router to App router
1. use metadata Api to define metadata, such as meta and link tags inside your Html head element for improved seo and web shareability.
1. create an opengraph-image or twitter-image route to generate a route segment's shared image
1. switch prisma orm to serverless kv with redis Api powered by upstash
1. replace heroicons with react-icons

conclusion

i am very satisfied with the Next.js v14.1 design philosophy, especially in metadata Api and open graph image generation. However, contentlayer was not maintained for a long time. i was trying to find another way to substitute it.