My Portfolio on Github Page

Welcome to my github page repo where I will be showcasing my projects. Most are from the Full Stack Web Developer program I did in 2021. You can see it live at https://laurielim.github.io/

Requirement

• Node v22

Commands

Start development server

npm start

Get a development build

npm run build

Get a production build

npm run build:prod

Serve the public dir

npm run serve

Run tests

npm run tests

Technologies used

• Eleventy
• Nunjucks
• Sass
• Figma

I originally built my portfolio with plain HTML, CSS and JavaScript. I chose simplicity as I had 2 focus in mind: performance and accessibility. The updated version is built using Eleventy as its known for performance and simplicity.

The page has a perfect score on Google Lighthouse. It is responsive and works without JavaScript. And last but not least, it looks decent on Internet Explorer!

You can see the web design here on figma.

Sources

• Tutorials by Andy Bell
• Recommendations from CSS Tricks
• Inspiration from Joost van der Schee's personal website
• Learn Eleventy from scratch
• Optimizing Images with the 11ty Image Plugin by Aleksandr Hovhannisyan
• How to deploy your Eleventy website to GitHub Pages with GitHub Actions by Maarten Tibau
• Testing a static SvelteKit site with Cypress on GitHub Actions
• Adding Dark Theme to Cypress.Tips Site

Tools

• Fluid type scale calculator by Utopia
• Fluid space calculator by Utopia
• Smooth shadow generator by Philipp Brumm