This is based on starter template for Learn Next.js but using some customizations ๐.
Demo: https://simple-blog-nextjs-three.vercel.app
- ๐ฅ Next.js v11!
- ๐ฅ Cloud Firestore (Firebase) via Next.js API route to implement real time count views mechanism. Note: Once you choose a region for your database, select the same location for your Serverless Function Region. This will minimize latency between your Serverless Function and your database, improving performance
- ๐จ Tailwind CSS integration for styling
- โ๏ธ Linter with ESLint
- ๐ฅ Custom API route / serverless function to use Playwright to create thumbnails for blog posts preview when sharing the link in the social media (Twitter, Facebook, etc.)!
- ๐ Prettier for code formatter
- ๐ฆ SEO with Next SEO
- ๐ reading-time package to get a Medium's like reading time estimation
- โ NProgress progress bar to convince the users that something is happening
- ๐ SSG (Static Site Generation) pre-rendering from Next.js to parse blog markdown files during build time
- ๐ฅ SWR React hook lib for remote data fetching, it first returns the data from cache (stale) and then sends the fetch request (revalidate)
$ git clone https://github.com/alexmarqs/simple-blog-with-nextjs.git
$ cd simple-blog-with-nextjs
$ yarn
$ yarn dev
Note: Do not forget to rename the file .env.example
to .env.local
and set your own variables.