Hike Helper

Hike Helper is a community driven walking app for walkers in Snowdonia and the surrounding area. Users can add their own walks to share with the community or can comment on other peoples walks.

Technoliges Used

My Role

A personal projects to create a community driven web app for hikers in Snowdonia and the surrounding area. The scope of this project was to allow users to upload their favourite walks in addition to a photo and brief description. In addition to this, users would ideally be able to comment on each others walks.

Project Difficulties

The biggest hurdle with this project was getting to grips with RESTful routing when dealing with nested routes ie. having comments inside of each show page. An additional challenge was keeping everything as neat and as modular as possible to keep the size of the project manageable.

Solution

Breaking the app.js file into modular parts and keeping the code clean and concise made the project manageable. Learning about typical API layout aided in this.

Notable Features

• Front-end built using bootstrap 3
• User created walks with CRUD capabilities
• Autherisation of comment ownership with CRUD capabilities
• Authentication for account creation and login
• Admin profiles with moderation permissions
• MongoDB back end with seed database.

Contact Me Form

My contact me form can be found by clicking the contact link in the navbar.

Summary

Ever since adding my email address to my portfolio site, I notice I got an increase in spam arriving to my inbox. To counter this I decided to create a contact form which allows me to receive messages from people reading my site, whilst keeping my email safe from web scrapers and nosy people alike. To acheive this I used an API called mailgun.

Technoliges Used

Prime Finder

A fun game to test your mental maths. Click on the circles to remove the composite numbers. However be careful, clicking on a prime number will cause you to lose.

Technoliges Used

My Role

A personal project bringing together my passion for mathematics and my love for games. This gave me an opportunity to test my logic in Javascript in addition to interacting with the DOM. The method adopted for checking if a number was prime was the Sieve of Eratosthenes which I had covered briefly during my A-levels.

Project Difficulties

One of the biggest challenges was getting to grips with interacting with the DOM. In addition to this, initially creating the counter for how many composite numbers the user had successfully removed from the grid proved to be difficult.

Solution

Once getting to grips with the DOM API interfacing with the document became much easier. The composite number counter was overcame by learning about the behaviour and importance of scope within JavaScript.

Notable Features

• Sieve of Eratosthenes prime checking
• Game Over message
• Composite number counter to track the players progress

Colour Game

Tired of using color pickers? This web game randomly generates 6 / 3 colours (depending on difficulty setting). These colours are then pushed to squares which the user can click on. The user then is given an RGB colour which corresponds to one of them. Once the correct colour is clicked on, a winning message is displayed.

Technoliges Used

My Role

Another personal project involving interacting with the DOM using JavaScript. This had a slightly larger scope than Prime Finder as I wanted to include a difficulty setting, which could reduce/increase the number of colours randomly generated.

Project Difficulties

One of the biggest challenges was again getting to grips with interacting with the DOM. Another small challenge was building the difficulty modifier with the capacity to expand later on (ie. a super hard mode could be added later).

Solution

Again interfacing with the document became easier the longer I spent doing it. The difficulty modifier was built into the setup function by feeding it an argument, this means adding extra difficulty modes at a later date will be much easier.

Notable Features

• Visual feedback when clicking on colours
• Game Over message
• Two difficulty settings

To-do List App

A simple online organisation app. Create, check-off and delete tasks.

Technoliges Used

My Role

Another personal project attempting to create a simple online organiser. This main goal for this project was to get to grips with jQuery and seeing the difference to using DOM manipulation.

Notable Features

• Visual feedback when checking off tasks
• Delete button hover effects
• Responsive layout using bootstrap