Welcome to my personal blog and portfolio website! This repository contains a modern Next.js application where I share my thoughts, projects, and insights.
- Next.js 16 with App Router
- TypeScript with strict configuration
- Tailwind CSS for styling
- MDX for content
- Drizzle ORM
- I18n for internationalization support
- Radix UI for accessible UI components
- Responsive design
- Light/Dark mode
- Image zoom in blog posts
- Shiki for code syntax highlighting
- Motion for animations
- Table of contents for blog posts
- Comment system
- Like functionality
- Post view counter
- Blog post search
- RSS feed
- Sitemap
- Lighthouse score of nearly 100
- SEO optimized with meta tags and JSON-LD
- Dynamic open graph images using
next/og
- Vitest for unit/integration testing
- Playwright for E2E testing
- ESLint configuration
- Oxfmt code formatting
- Lefthook
- Conventional commit lint
- Better Auth
- Redis caching
- Upstash for API rate limiting
- t3-env for environment variables
- Umami Analytics
- Node.js >= 24
- pnpm >= 10
- Docker
- Visual Studio Code with recommended extensions
- Optionally React Developer Tools
nelsonlai.dev/
├── public/ # Static assets (images, fonts, videos)
├── src/
│ ├── app/ # Next.js app router pages
│ ├── components/ # React components
│ ├── config/ # Configuration files
│ ├── content/ # MDX blog posts and content
│ ├── db/ # Database schema and migrations
│ ├── emails/ # Email templates
│ ├── hooks/ # Custom React hooks
│ ├── i18n/ # Internationalization
│ ├── lib/ # Utility libraries
│ ├── orpc/ # oRPC API routes
│ ├── styles/ # Global styles
│ └── utils/ # Utility functions
├── docker-compose.yml
└── package.json
To run this project locally, you need to set up the development environment.
- Clone the repository:
git clone https://github.com/nelsonlaidev/nelsonlai.dev- Navigate to the project directory:
cd nelsonlai.dev- Install dependencies using pnpm:
pnpm install- Copy
.env.exampleto.env.localand update the environment variables as needed.
cp .env.example .env.local- Run required services using Docker:
docker compose up -d- Run the database migrations:
pnpm db:migrate- Seed the database:
pnpm db:seed- Run the app:
pnpm dev # Run the development server
# or
pnpm email:dev # Run the email preview server separatelyThe services will be available at the following URLs:
| Service | URL |
|---|---|
| App | localhost:3000 |
| React Email | localhost:3001 |
| Database | localhost:5432 |
| Redis | localhost:6379 |
| Redis serverless | localhost:8079 |
pnpm dev # Start development server
pnpm build # Build for production
pnpm start # Start production server
pnpm lint # Run ESLint
pnpm typecheck # Run TypeScript type checking
pnpm fmt # Format code with Oxfmt
pnpm test:unit # Run unit tests
pnpm test:e2e # Run E2E tests
pnpm db:migrate # Run database migrations
pnpm db:seed # Seed the database
pnpm db:studio # Open Drizzle StudioThis project has been made possible thanks to the wonderful open-source community. Special thanks to:
- Timothy for the Tailwind nextjs starter blog template.
- Eihab for the UI design inspiration (Figma)
This project also uses/adapts the following open-source projects:
- Comment System - from fuma-comment
- Rehype Plugins - from fumadocs
- UI components - from shadcn/ui
- Admin UI - from shadcn-admin
The following projects were referenced for inspiration:
- fumadocs
- leerob.io
- nerdfish.be
- nextra.site
- theodorusclarence.com
- ped.ro
- delba.dev
- joshwcomeau.com
- blog.maximeheckel.com
- zenorocha.com
- jahir.dev
- anishde.dev
- nikolovlazar.com
- samuelkraft.com
- bentogrids.com
- ui.aceternity.com
- hover.dev
- vocs.dev
If you find this project helpful, consider supporting me by sponsoring the project.
This project is open source and available under the MIT License.
Made with ❤️ in Hong Kong