17undividable / flymetothemoon Goto Github PK

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

• ⚡️ Next.js 14 with App Router (Turbo)
• 📝 MDX + Contentlayer
• 🎨 Tailwind CSS - for styling
• 🌈 Radix UI - accessible UI components
• 🛡 Strict TypeScript and ESLint configuration
• 📱 Responsive design
• 🌗 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 - for code blocks in blog posts
• 🎨 Animation - using Framer Motion
• 🤖 GitHub Actions for CI/CD
• 🏠 LightHouse score of nearly 100
• 🧪 Vitest - unit and integration tests
• 🎭 Playwright - end-to-end tests
• ☂️ Codecov - code coverage
• 🔨 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
• ◮ Prisma - ORM
• 👷🏻‍♂️ t3-env - validate environment variables before building

• Node with Corepack, recommended 18.x, minimum 16.9.0
• pnpm, recommended 8.14.0, minimum 8.x
• MySQL, recommended 8.0, minimum 5.6
• Visual Studio Code with recommended extensions
• Optionally React Developer Tools

Follow these steps to run the project locally on your machine:

git clone https://github.com/tszhong0411/honghong.me.git
cd honghong.me
pnpm install

Create a .env.local file based on the provided .env.example file and fill in the necessary variables.

pnpm dev

The app will become available at http://localhost:3000.

• Add comment function to blog posts using database instead of giscus
• Use strict content security policy - still not working in 14.0.4
  • next/image - vercel/next.js#45184
  • nonces - vercel/next.js#54907
  • main-app.js - vercel/next.js#55129
• Fix react-medium-image-zoom on Edge Runtime bug
  • rpearce/react-medium-image-zoom#429

Hello there! While I'm glad to see you're interested in my open-source project, I kindly request that you refrain from using this source code as a template for your website. Instead, I encourage you to use it as a learning resource and as an inspiration to create something unique.

• Originality: Building something from scratch allows you to showcase your originality and creativity.
• Learning: Creating your own project helps you learn and improve your skills.

If you have questions or feedback, please reach out to me. Thank you for understanding!

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

Made with ❤️ in Hong Kong