Hero Mini Game

This game is similar to the once popular game "flappy bird". I wanted to try creating a 2D game using the HTML canvas element, and practice animating/clipping spritesheets. I created the flying hero spritesheet using piskel. On desktop, the game allows the hero to move back, forward, up, and down. This is different from Flappy Bird and adds a layer of complexity to the game.

Mini App Projects

You can check out my app projects on my Github. You will find apps written with React, Redux, NextJS, NodeJS/Express, and/or HTML/CSS/JS. Here are a few:



Node, Express, mySQL, EJS (Demo Blog) Async Thunk (React / Redux) Server-side Rendering
User Authentication (FireBase) HTTP Requests
Demo Shopping Cart Book List Weather Checker
Shopping List Expense Tracker Tic Tac Toe Goal Setter Draggable Elements Modals

---

This is a demo application built using NodeJS, Express, mySQL, and the EJS template engine. You can create, delete, and update blog posts.

---

Created action creators, and practiced sending async requests. Used React and Redux.

---

Pre-render pages via NextJS. Handle data with Mongo DB. Add meetups, and browse meetups.

---

A simple authentication app using Firebase APIs. Written in React.

---

I practiced sending GET requests to a Starwars movie API (swapi.dev), and sent POST requests to a firebase real-time database to add new movies to a movie list.

---

A simple shopping cart interface. This was a great practice project. I incorporated many of the hooks learnt in the "React - The Complete Guide (incl Hooks, React Router, Redux)" course by Maximilian Schwarzmüller. i.e: useContext, useEffect, react portal, useState, useReducer

---

Create a book list. Keep track of books you'd like to read, or have read. Add descriptions, review, or comments for each book. Save your book list to your local storage, or print the page (command P).

---

A simple weather checker app coded with React. This project was a part of the Odin Project curriculum. Through this project, I practiced using the weather API (via api.openweathermap.org) to display weather information for a selected city.

---

A dynamic shopping list creator made in React. This was an assignment for the course "Complete React Hooks Course 2021: A - Z ( Scratch to React )" by Hemil Patel on Udemy.

---

An app for keeping track of expenses. You can filter by year and see changes in the graph (by month). This project was completed for the course "React - The Complete Guide (incl Hooks, React Router, Redux)" by Maximilian Schwarzmüller on Udemy.

---

This was the first project I completed after learning about React hooks. I created a simple Tic Tac Toe game.

---

Through this project, I practiced how to implement dynamic styles. I learned how to use styled components, and how to organize styling into CSS modules. I completed this project for the course "React - The Complete Guide (incl Hooks, React Router, Redux)" by Maximilian Schwarzmüller on Udemy.

---

A simple React app that allows the user to drag and reorder items. This was an assignment for the course "Complete React Hooks Course 2021: A - Z ( Scratch to React )" by Hemil Patel on Udemy

---

I practiced using modals to indicate input errors. I completed this assignment for the course "React - The Complete Guide (incl Hooks, React Router, Redux)" by Maximilian Schwarzmüller on Udemy.

---

Above is a video showcasing some of the assets and products I designed. You can also download this file.
Note: Download the video file to view animated gifs

More Tidbits

Meridian Rehabilitation is an occupational therapy firm with several locations in the Lower Mainland. Meridian wanted to upgrade the look of their site to attract new staff members and streamline the process of making referrals for clients. I designed the logo and designed their website using CSS on Wordpress. The goal was to create a website with a well-organized, simple UI. The site is active, but the design is unfinished (a work in-progress)


I am currently designing a website on Wix for a startup floor levelling company (In the Mix) in Vancouver. The client requested a site that looks modern, and requested the provided construction images to be incorporated. The Wix platform was chosen so that the client can easily edit the contents of the website. I set up a business email with two alias email addresses (one for each team member).
This is a work in progress:

Recently I started learning Unity because I'd like to make an Indie game one day. ConcernedApe (Eric Barone) is one of my role models.
You can track my learning progress here:

I frequently use Codepen to test out animations and draft up design components. You can also see the projects I completed for FreeCodeCamp when I first started learning code. Projects like making a calculator, a random quote generator, and a drumkit. I store design components and animations I use frequently on my pen.

I am an experienced educator. I primarily teach secondary level Sciences and Math. I've designed many teaching materials and put them up as products in my TPT marketplace.
Check out my product designs: