This is a new portfolio website I am creating using Next.js to improve on the initial design, create a faster and more maintainable React.js app, and became more familiar with this tool (React.js framework which uses SSR & SSG for better performance and SEO). My older portfolio website (hosted here) was originally made using HTML, CSS, and JavaScript.

This website is deployed on Vercel here: https://giavinhlam.com

Getting Started

First, run the development server (Node.js version >= 17):

npm run dev
# or
yarn dev

Open http://localhost:3000 in the browser to see the page.

Linting

Add the ESLint extension and run this command to check for problems:

npm run lint

Resources

Technology Icons: https://devicons.github.io/devicon/

Todos

1. Remove devicon by converting all icons into SVGs
2. Add old chat, socsreynolds, mrflatbeds, and form builder projects
3. Light/Dark Mode toggle + defaults via prefers-color-scheme setting
4. Small date badges beside projects (top right of title)
5. Simple animation https://github.com/formkit/auto-animate
6. Filter (fixed icon for filtering projects by technology)
7. Update with new CSS features (container queries, CSS nesting, CSS variables)