passionate & creative web developer

The Space Tourism website

Space Tourism

reacttypescripttailwindnextstorybook

This is a mock space travel website that I used to practice my website building skills, following set reponsive designs and specs. I used this opportunity to use Storybook to build up a component library and to build up my coding skills

The quiz app

Capital Cities Quiz

reacttypescripttailwindnext 13storybook

This is a very tough multi-choice quiz game to test your knowledge on capital cities within a limited time! This features breakdown of your results in the end. This was a good opportunity to implement some interesting features such as a timer, an action when the timer ends, answer tracking, points tracking and the final result dashboard

The furniture store website named 'Room'

Room Furniture Store

reacttypescripttailwindnext 13storybook

A furniture website with a unique design to test my coding abilities as well as tackling this challenging layout. I took this ooportunity to familiarise myself with the latest version of Next.js, where there is an improved index routing system and component/server separation

The quick scripts logo

Quick Scripts

vs code plugintypescriptnode

Annoyed with constantly running my package.json scripts, I created this VS Code Extension that runs each script by a custom button added to the toolbar

The tip calculator app

Tip Calculator

reacttypescripttailwindnext

An app to help groups calculate how much to tip for their service. Follows a responsive design and component library

The bowling scorecard app

Bowling Scorecard

reacttypescripttailwindnextcypressjest

An online app used for automatically calculating the scores when playing ten pin bowling. Used Cypress.js to run automated tests to check that the outcomes run as expected

A screenshot of my Space Tourism website

Chess

reacttypescripttailwindnextjestzustand

A collaberative process pairing over recreating the classic game of Chess. Used Jest to run tests and have confidence and visibility in the code. Zustand is added in my version as a state manager

The NASA gallery website

Nasa Gallery

reactSCSSaxios

A website dedicated to NASA astronauts using the NASA API to fetch data and display them.

The Punchbag Game app

Punchbag Game

vuejavascriptcsshttp-server

Click the punchbag to imitate a punch, and beat your opponent when the life bar reaches zero. Includes audio fighting sounds and 60's style Batman onomatopoeic words. Used this project as an opportunity to learn and understand how to use Vue.js, and blog about it

A screenshot of my test runner app

Espresso Testing

javascriptcssjasmine

Created my own custom test runner, to be used on my other project on note taking. Was a good opportunity to understand roughly what a test runner does and how it functions

A screenshot of my Quark Code Editor app

Quark Code Editor

electronjavascriptcsshtmlspectron

My boot camp group final project. We tried to create our own text editor (like Visual Studio Code) and understand what the process of achieving this was like. This involved working as a team, and setting our own targets and agile processes.

download

medium.com/@pyan