My Personal Website

ericwu.me

Built using Next.js 16 with React 19, HeroUI v2, and Tailwind CSS v4. The website features a blog powered by the Notion API, serving as the CMS. The design is inspired by Nev Flynn's Bento design, focusing on simplicity and user-friendly interfaces.

Features

• Next.js 16: Utilizes the latest features of Next.js with Turbopack for fast rendering and efficient SEO optimization.
• React 19: Latest React with improved performance and new features.
• HeroUI v2: Modern React UI library (successor to NextUI).
• Tailwind CSS v4: CSS-first configuration with improved performance.
• Notion API: Integrates Notion as a headless CMS to manage and retrieve blog content dynamically.
• Responsive Bento Design: Adopts the aesthetic and functional principles of Bento design, customized for a unique look and feel.

Getting Started

Prerequisites

• Node.js (v20.x or later recommended)
• npm or yarn

Installation

1. Clone the repository:

   git clone https://github.com/itsEricWu/ericwu.me.git

2. Install dependencies:

   npm install

3. Set up environment variables: Create a .env.local file in the root directory and add the following variables:

   OPENAI_API_KEY=exampleAPIKey
   NEXT_PUBLIC_MAPBOX_TOKEN=exampleAPIKey
   NEXT_PUBLIC_FIREBASE_API_KEY=exampleAPIKey
   SITE_URL=https://www.example.com
   

Running the project

npm run dev

Open http://localhost:3000 with your browser to see the result.

Tech Stack

• Next.js 16
• React 19
• HeroUI v2
• Tailwind CSS v4
• TypeScript
• Framer Motion
• Three.js with React Three Fiber
• Notion API
• Firebase
• Mapbox

Deployment

This website is ready to be deployed on platforms like Vercel, Netlify, or any other platform that supports Next.js.

Star History

Contributing

Contributions are welcome! For major changes, please open an issue first to discuss what you would like to change.