pencil phone envelop download spinner2 wrench cogs magic-wand mail4 github4 linkedin cross

Mini Projects


Personal mini projects for learning and fun

Information

  • Role: Doing everything and anything on these

Tags

  • html
  • css
  • javascript
  • jquery
  • angular js
  • express js
  • mongo db
  • php

What Coffee

This mini project was built with the aim of learning AngularJs. It shows how people in a group / office / team like their teas and coffees. The layout is fully CSS with no images being used and inspiration taken from this codepen. In addition to Angular, shake css was used for some subtle animations on the drinks. A full backend was also built for this using Express, Node and Mongo but is yet to be completed.

Link Code
  • Angular Js
  • Express Js
  • Node Js
  • Mongo Db
  • CSS

Now Playing

This mini app was created for the Brand42 studio so we could easily see what was currently being played on the studio jukebox. It's a Vanilla Js App which uses the LastFm API with some simple CSS3 transitions, transforms and a minimal flexbox layout (And a sprinkling of Monty Python thrown in for fun).

Link Code
  • Javascript
  • CSS3
  • Flexbox
  • API Integration
  • Ajax

Bwoon!!

I wanted to recreate this website without using Flash. It was accomplished using some CSS (Including Shake CSS), HTML5 audio and jQuery to handle the click events.

Link Code
  • CSS
  • jQuery

Tick Clock

A pure CSS, no text clock with a sprinkling of Javascript.

Link Code
  • CSS
  • jQuery

Guess the Number

A simple higher or lower game of guess the number which uses Ajax calls to a PHP.

Link Code
  • PHP
  • CSS
  • AJAX
  • jQuery

Menu Pop

This a small responsive radial menu and has a neat little pop up menu.

Link Code
  • CSS
  • jQuery