Weicheng's Portfolio V2

A playful version of portfolio app. Almost care every detail of the site.

🎨 Color Reference

Color	Hex	Color	Hex
primary01	#F4F9FB	gray01	#FCFCFC
primary02	#E2F4F8	gray02	#F4F4F4
primary03	#3FB1E8	gray03	#D9D9D9
primary04	#1682B6	gray04	#888888
primary05	#50585C	gray05	#4D4D4D
		gray06	#3D3D3D

Stacks

• 🌘 shadcn, with lovely customized ui and fluent developing experience.
• 🌊 Tailwindcss
• 👾 Framer Motion
• ⚛️ Embla Carousel
• 🌏 i18n Next
• 🪖 React Helmet
• ✨ Eslint & prettier
• ✏️ cz (with commitizen installed globally)

Getting Started

First, run the development server:

# install
pnpm install

# dev
pnpm dev

# build
pnpm build

# serve
pnpm preview

Some reminders

• You can start editing entry point by modifying src/main.tsx. The page auto-updates as you edit the file.
• Theme is based on shadcn and modify it to my theme.
• Typography component is well handled.
• We have cn function in lib/utils.ts to help us to merge className and clsx to do more flexible conditioning.
• React forwardRef, createPortal, ElementRef<'div'>
• Tailwind class of h-dvh, h-svh