Skip to content

htbkoo/personal-portfolio

Repository files navigation

Attempting to write my personal portfolio page again, this time with React + TypeScript

Getting Started

Copied from the README.md from the Next.js project bootstrapped with create-next-app.

First, run the development server:

yarn start

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

Other information

Major updates

  1. v5.0.0 - Another major re-architecture - now the <DrawerItems /> supports subPages and Exercises (formerly Portfolio page) are split into their own page for faster loading performance
  2. v4.0.0 - upgraded material-ui to v5 (#178)
  3. v3.0.0 - upgraded next.js to v14 (#175)
  4. v2.0.0 - upgraded next.js to v13 (#143)
  5. v1.0.0 - revamped architecture (split pages so the First Contentful Paint (FCP) and Largest Contentful Paint (LCP) would be quicker) and improved UX, e.g. by reducing Time-To-Interactive (TTI) and Total-Blocking-Time (TBT) (#112)
  6. v0.10.0 - migrated to Next.js from Create React App
    1. As a bonus, the version of React is also upgraded to v18.0 from v17.0.2

Common known issues

Windows compatibility

The yarn start and yarn build does not work on Windows machine
TL;DR solution

Set the yarn / npm script-shell to bash (recommended) or powershell by running:

  1. For yarn, yarn config set script-shell bash
  2. For npm, configure the script-shell value at .npmrc
Explanation

This is because, according to the issue described here at cross-env, npm uses cmd by default and that doesn't support command substitution, so if you want to leverage that, then you need to update your .npmrc to set the script-shell to powershell. Learn more here.

Reference
  1. https://stackoverflow.com/questions/65953667/yarn-cant-run-any-script
  2. https://classic.yarnpkg.com/lang/en/docs/yarnrc/
  3. kentcdodds/cross-env#192 (comment)
  4. https://github.com/kentcdodds/cross-env#windows-issues