large_Test 1.jpg

medium_Test 1.jpg

small_Test 1.jpg

thumbnail_Test 1.jpg

Test 1.jpg

Site made with React, Next.js, Strapi, Tailwind and ♥



Hi, I'm Ed

Junior Full Stack Developer

medium_joint_thumb_new.png

small_joint_thumb_new.png

thumbnail_joint_thumb_new.png

joint_thumb_new.png

Joint Playlist

Jointplaylist lets two users compare their music tastes and find songs that they
have in common, creating a playlist they can enjoy together. It uses the Spotify
API to find the music and as authentication. Users create their music profile,
send a personalised link to friends. Once a friend has created their profile and
compared, their dashboard will update showing who compared and what
matches they had. The user can save the matches into a joint playlist directly to
their Spotify. This is a work in progress with several things on my to-do list such
as: more methods of collecting songs, nicer styling, mobile responsiveness
plus a lot more.

large_landing.png

medium_landing.png

small_landing.png

thumbnail_landing.png

landing.png

The landing page for the website. A short precise explanation of how the site works along with a short explainer video.

large_builder.png

medium_builder.png

small_builder.png

thumbnail_builder.png

builder.png

This is the first thing the user see's after connecting their spotify. It lets the user choose where to get their songs from. Some users store their music in playlists, others in liked songs. 

large_loading.png

medium_loading.png

small_loading.png

thumbnail_loading.png

loading.png

I created a loading page that uses Reddit's api to pull the top posts for that day from r/showerthoughts to keep the user engaged while the songs are importing.

large_dashboard.png

medium_dashboard.png

small_dashboard.png

thumbnail_dashboard.png

dashboard.png

This is the users dashboard. After creating their profile this is what will show whenever they login. It shows their personalised share link and their joints list. The list lets them see and access any joint that they've made or others have made with them. The user can delete joints that they have made. 

large_profile.png

medium_profile.png

small_profile.png

thumbnail_profile.png

profile.png

This is the users profile page. It lets them delete their profile to rebuild their song list or just view their track list. The track list is lazy loaded with scroll to allow for songs lists with thousands of songs.

large_konami.png

medium_konami.png

small_konami.png

thumbnail_konami.png

konami.png

On the profile page if you enter the konami code into your keyboard (↑↑↓↓←→←→BA) it will let you choose a custom name, this is used all over the website including the users share link.

large_joint.png

medium_joint.png

small_joint.png

thumbnail_joint.png

joint.png

This is a joint page, a lazy loaded list of all the songs that you have in common, a button that lets you save the list directly to your spotify as a playlist and a custom link so you can share the list with others.

large_share.png

medium_share.png

small_share.png

thumbnail_share.png

share.png

This is the page a user will see when a friend has sent them their share link. A Slightly modified version of the landing page. 

My first full-stack project. A web app that lets users compare music with their friends, finding songs they have in common.

large_number4thumb.png

medium_number4thumb.png

small_number4thumb.png

thumbnail_number4thumb.png

number4thumb.png

Number 4 Consulting

This is the first website I built fully at Cubiq during my internship. Built to a design spec as well as everything being easily editable using ACF fields in Wordpress for the client to maintain and update.

large_homepaghe.png

medium_homepaghe.png

small_homepaghe.png

thumbnail_homepaghe.png

homepaghe.png

large_about backend.png

medium_about backend.png

small_about backend.png

thumbnail_about backend.png

about backend.png

Example of how in the CMS the client can change aspects of the website easily.

large_about.png

medium_about.png

small_about.png

thumbnail_about.png

about.png

The section of the website where the CMS screenshot controls.

large_service page-min.png

medium_service page-min.png

small_service page-min.png

thumbnail_service page-min.png

service page-min.png

large_seed_thumb.png

medium_seed_thumb.png

small_seed_thumb.png

thumbnail_seed_thumb.png

seed_thumb.png

Seed Renewables

A more recent client website I built fully while working at Cubiq Design. Built to a design spec created by Cubiq's design team. Website content is easily editable and maintained using ACF fields in the WordPress backend.

large_service-page-min.png

medium_service-page-min.png

small_service-page-min.png

thumbnail_service-page-min.png

service-page-min.png

large_about-page-min.png

medium_about-page-min.png

small_about-page-min.png

thumbnail_about-page-min.png

about-page-min.png

large_contact-page-min.png

medium_contact-page-min.png

small_contact-page-min.png

thumbnail_contact-page-min.png

contact-page-min.png

A more recent client website I built fully while working at Cubiq Design. Built to a design spec created by Cubiq's design team. 

large_thumb_boring_hell.png

medium_thumb_boring_hell.png

small_thumb_boring_hell.png

thumbnail_thumb_boring_hell.png

thumb_boring_hell.png

Horse Race Alarm

Built a few weeks into learning to code. My father had a problem where he was so busy he would forget to watch the horse races he had placed a bet on. I built an alarm system that updates daily with that day's horse races. 

This was my first experience deploying a project I created. I had no understanding of how websites were supposed to be built so I used the knowledge I had which was basic js, basic html/css and some python. 

The website uses a python script to get the information of the day's horse races, creates an index.html file containing that information which is then remotely pushed to a AWS s3 bucket each day. 

My father had a problem where he was so busy he would forget to watch the horse races he had placed a bet on. I built an alarm system that updates daily with that day's horse races. 


HTML

Javascript

SASS

Wordpress

React

Python

Tailwind

Git/Github

Node.js 

Express.js

Mongodb/atlas

Easy-Peasy (Redux wrapper)

jQuery

Next.js

Development

Photography (BA Hons 1st Degree)

Photo Retouching

Adobe Photoshop

Basic Portuguese

Other

See also my github commit graph, working on personal products afterwork and on weekends to constantly improve my skills.

Don’t take my word for it, below is a timeline of my development journey, from not knowing how to write any code to where I am now. All progress was self-taught using online courses/resources. 


Two of my strongest skills are the speed at which I learn coupled with my self drive. 

My first time writing code and my first project on my teamtreehouse course. 

My first github commit

After a month of doing my team treehouse course, I started interning 2 days a week at Cubiq Design getting a chance to use my new skills on real-world projects. Using my other 3 days to continue learning and improving.

Started my Internship at Cubiq.

My first time using my basic JS, HTML and CSS to solve a problem for my Father. Also my first time deploying a website, I did so using AWS.

Built Horse Race Alarm

Built my first full website for Cubiq.

I started learning react and full-stack development in December, by Christmas I had deployed the first fully working version of Jointplaylist.com for friends. 

First working release of Joint Playlist

After interning at Cubiq for two months they decided to hire me full-time as a junior web developer. 

Hired full time at Cubiq. 

Hi, I'm EdJunior Full Stack Developer

About Me

Bio

Contact

Projects