Here you can find some of the personal projects I've done (or currently doing) on my spare time. For websites I've worked on while on the job, check them out on my personal portfolio.

Landing pages

These are not real clients and only serve to continually improve my front-end coding techniques and not get rusty. These single pages were coded with responsiveness in mind. For the design mockups, you can find them here.

EasyBank

I used flexbox for the layout and the styling was precompiled using SCSS. For the mobile menu, I used native Javascript.

#html #css #javascript

Insure

This landing page was fun to build as I got to implement both CSS Flexbox and Grid for the layout. It was also cool to figure out how to add the squiggly lines which looked somewhat challenging at first.

#html #css #javascript

Huddle

An easy and straightforward page to build. Used flexbox and SCSS for the HTML and CSS. No need for Javascript.

#html #css

Miscellaneous

Stuff I code for fun and to learn something new.

Rock, Paper, Scissors

My first Javascript game. Built this in 4 hours without having to look at any tutorials or guides online as a personal challenge. The first to score 5 points wins. Computer's hand is random.

Libraries used:

  • FontAwesome 5
#html #css #javascript

Responsive Preview

Works similarly to what you can find on your browser's DevTools but is a lot more simplified. Preview the responsiveness of a site on desktop, tablet, or mobile.

Libraries used:

  • FontAwesome 5
#html #css #javascript

Artboard

An offline IDE similar to CodePen or JS Fiddle. Coded to used for creating CSS Images.

Libraries used:

  • Bootstrap
  • jQuery
  • CryptoJS
  • TogetherJS
#html #css #javascript

Cloud Vision API

Inactive

Implementation and use of Google's Cloud Vision API to analyze an uploaded image.

Sample usage: Upload an image of a landmark and choose "Label Detection". Wait for the Raw JSON window to finish loading and return data.

Technologies used:

  • Google Cloud Vision
  • Firebase
#javascript

Course projects

Projects developed while taking up online courses.

React Assignment 2

Counts inputted text and breaks them into single characters. Characters can then be deleted individually which will also update the different states on the app.

#javascript

React Assignment 1

Simple React App that makes use of props, states, and the two methods of styling - inline and external stylesheets.

#javascript

React Complete Guide

Ongoing

Reactjs, Hooks, Redux, React Routing, Animations, Next.js

#html #css #javascript

Shareboard

An OOP MVC-based website with CRUD functionality. Includes user registration and login.

Libraries used:

  • Bootstrap 4
#html #css #php

Storify

Ongoing

A Laravel framework-based CRUD system where users can post and manage their stories.

Frameworks used:

  • Laravel 7
#html #css #php