honghong.me

Welcome to the monorepo of my personal blog! This repository houses the code for my blog, where I share my thoughts, projects, and insights. Feel free to explore and get inspired.

✨ Features

• ⚡️ Next.js 14 with App Router
• 📝 MDX
• 🎨 Tailwind CSS - for styling
• 🌈 Radix UI - accessible UI components
• 🛡 Strict TypeScript and ESLint configuration
• 📱 Responsive design
• 🌗 Light / Dark mode
• 📈 SEO optimized with meta tags and JSON-LD
• 📰 RSS feed
• 🗺 Sitemap
• 📊 Umami Analytics
• 📝 Blog with comments, likes, and post views
• 🔎 Blog post search
• 📖 Table of contents for blog posts
• 📷 Image zoom - zoom in on images in blog posts
• 📝 Code syntax highlighting - using Shiki
• 🎨 Animation - using Framer Motion
• 🏠 LightHouse score of nearly 100
• 🧪 Vitest - unit and integration tests
• 🎭 Playwright - end-to-end tests
• 🔨 Husky & Lint Staged - lint and format code before committing
• ✅ Conventional commit lint - make sure commit messages follow the conventional commit format
• 🔒 NextAuth.js - authentication
• 💄 Prettier - code formatting
• 〰️ Drizzle - ORM
• 👷🏻‍♂️ t3-env - validate environment variables before building
• 🤖 Auto refresh - fast refresh when updating MDX
• 🌄 Open graph image - using next/og
• 📁 Redis - for caching
• 🧯 Upstash - for API rate limiting
• 🪄 CSpell - for spelling checking

🔨 Requirements

• Node, recommended >=20.11.0 with corepack enabled
• pnpm, recommended >=9.x
• Visual Studio Code with recommended extensions
• Optionally React Developer Tools

👋 Getting Started

Please refer to the contributing guidelines for detailed information on how to start the app locally and contribute to this project.

❤️ Credits

This project has been possible thanks to the wonderful open-source community. Special thanks to Timothy for the Tailwind nextjs starter blog template.

This project also uses / adapts the following open-source projects

Without them, this project would not have been possible:

• Comment System - from fuma-comment
• Rehype Plugins - from fuma-docs
• MDX Rendering - from next-mdx-remote
• MDX Handling - from contentlayer
• UI - from shadcn/ui
• ESLint config - from @antfu/eslint-config

Referenced the following projects for inspiration:

• fumadocs
• leerob.io
• nextra
• theodorusclarence.com
• ped.ro
• delba.dev
• joshwcomeau.com
• blog.maximeheckel.com
• zenorocha.com
• jahir.dev
• anishde.dev
• nikolovlazar.com
• samuelkraft.com
• bentogrids
• ui.aceternity.com
• hover.dev
• vocs.dev

and more but I can't remember them all 🥹

✍🏻 Author

• @tszhong0411

🪪 License

Please do not deploy this directly to production. It is not a template and is not intended to be used as one.

This project is open source and available under the GPL3 License.

⭐️ Star History