Coding Journey

A showreel of the apps I have created. From humble starts to complex builds.

Joseph Lander

First Projects

Before I started to code, I was Deputy Head of Maths for a large secondary school. Here is my first public site to host my instructional videos for all of our A-Level students.

miniMaths

HTML
CSS
JQuery

I have a passion for cooking. To practice my design skills and videography, I created an Instagram account and built this site with text message animation to compliment it.

WCICWT

CSS Animations

Use of API

Here are examples of sites built using an API. The first is from an assignment from the Treehouse techdegree to create a searchable, employee directory with lightbox feature.

Directory

JS
Gulp
SASS

This project uses the UK Gov API to track Covid-19 data and return the headline data and statistics. It practices data manipulation alongside the use of JS date methods.

UK Covid-19

JS
CSS Grid

Advanced Styling

In addition to learning the power of CSS Grid and Flexbox, implementation of build tools such as npm and Gulp have enabled efficient use of SVGs and SASS to optomise workflow.

Animal Project

npm
SVG Sprite

This web app also includes use of an external library, Chart.js, to create changeable graphs. Custom sliders and buttons were also created for uniform elements across browsers.

Web App

Gulp
SASS

Use of Javascript

While a lot of the projects involve some JS, the following examples showcase its use to solve more challenging problems. Here is Tic-Tac-Toe with scoring functionality.

Tic Tac Toe

JS
npm

See my complete collection of Challenges for the FreeCodeCamp JS Algorithms and Structures certificate. Here I gained experience with JS methods new and old.

JS Challenges

JS

React

My first project having read the official docs was to create this CV Creator App. Behind my CV, I got to practice the benefits of state and passing props to reusable components.

React

React

Now I have also completed this assignment for Treehouse implementing routing alongside the Flickr API. I gain more experience with component lifecycle methods.

API Img Gallery

React
API
Router