Personal portfolio website created to showcase my projects and technical skills. Initially created as a static HTML website, the website has experienced multiple upgrades over the years including migration to PHP, Create React App, and most recently Next.js.
- Language: TypeScript
- Frameworks: Next.js, React
- CSS Framework: TailwindCSS
- Formatting: Prettier, EditorConfig
- Linting: ESLint
- Testing: Testing Library, Jest, Cypress
- Deployment: Vercel
- CI/CD: GitHub Actions
- Analytics: SplitBee, Cloudflare
- Other: Cloudflare
The project is built upon the Next.js framework. The development server can be run with the following command allowing hot-code reloading, error reporting, and more. By default the website will run at http://localhost:3000.
npm run devLinting of the project is achieved using ESLint.
npm run lintTo create the production-ready build of the website run the following command. The build files will be optimised, compressed. Furthermore the file size of each route and how each route will be rendered is logged.
npm run buildThe portfolio uses Jest as the test runner for unit tests. Each component has a corresponding unit tests including snapshots saved in the format *.test.tsx or *.test.ts. To run all unit tests, run the following command:
npm run test:ciTo run all unit tests whilst updating unit test snapshots:
npm run test:ci -- -uCypress is used to run end-to-end tests of the website in a browser. Such tests include the navigation, footer, and contact form. For Cypress to work, the dev server must be running on port 3000 with npm run dev. To run Cypress in a browser run the following command:
npm run e2eTo run Cypress on the command line run:
npm run e2e:headless
