Lewis Turner
Front End Web Developer
A passionate front end web developer with a talent and desire for utilising a wide range of technologies to build elegant and functional websites and applications.
A passionate front end web developer with a talent and desire for utilising a wide range of technologies to build elegant and functional websites and applications.
I came up with this idea through personal necessity. I love watching tv, but so often it's tough to find something good to watch. There are lots of similar sites out there, but they all seem overly complicated; asking specifics about genre or certification (amongst a myriad of other things). My idea is simple; what have you enjoyed before? Here are some similar shows to choose from!
I had a good idea in my mind of how I wanted the site to look. I design and build all sites that I work on using the 'mobile first' methodology. I knew that this site more than most, would get a lot of traffic via mobile and tablet. Most people sat on their sofa wondering what to watch tend to have their phone or tablet to hand! I fleshed out some wireframes and user flow (small, medium and large) in Balsamiq and selected the font and colour with inspiration from a recent copy of Web Designer magazine.
The biggest challenge was finding the right API to get the data. I wasn't able to find a single data source that gave me everything I wanted. themoviedb came close; it provided a comprehensive query endpoint to find suggestions using any number of different metrics. The one downside was that it uses its own rating system, rather than the more familiar, and much more widely used, IMDB and Rotten Tomatoes. I settled on using omdbapi for the basic search and most of the UI data, including the all-important "sort by rating"), but utilised themoviedb for the impressive search api.
The second challenge came with extracting the data out of the APIs. Because of the need to switch between the two api's to retrieve and display the results, there are 5 asynchronous api calls, that all depend on the previous to work. Initially I tried doing this in the redux container, checking that the previous API had returned its result using componentWillReceiveProps and firing off the next call when it had; that got very messy very fast. Instead I decided on chaining promises in the action creator. I felt this was the best all round solution as it keeps the container concise whilst not having an overly complicated action.
If I can find an API that provides the data, I would love to be able to show which platforms each result is available on; whether it be Netflix, Amazon Prime, iPlayer, etc...
I came up with the idea for this site when chatting to a friend; "I wonder, if someone had invested some money in Apple for me on the day I was born, what would it be worth now?". It turns out, it would be worth about 150 times more today than it was then.
I think I spent more time thinking about how to make this idea fun for the end user, the actual design of it; and honestly? I think that shows. However, I am very pleased with the story telling aspect of it.
The hardest part was the time spent on getting the inputs to work how I wanted them to. They grow and shrink to fit the text that the user adds. They are responsive across different viewports, utilising mobile and tablet devices native datetime pickers, and a jQuery plugin to achieve the same thing on desktop.
I also took care when it came to loading the background image; there are 5 potential images that can be used. The site randomises which one is displayed each time the page is loaded. The image is then loaded asynchronously and fades in when it has finished downloading. It turns out to be a fairly simple bit of javascript, but it took a decent amount of thought!
I've already done some further development; I added the bottom section calculation to show the optimum date to cash out! I also added the UK FTSE100 stock exchange to go with the existing US S&P500. I have some further ideas for development; I would like to redesign the UI to use more material design aspects as I have never been totally happy with it, especially the loading spinner!. I would also like to add Crypto Currencies to the list of available investments.
Studentbeans is a website and app that provides students with discounts to thousands of different brands all over the world. I mostly worked on the Single Sign On and user management areas of the site. I worked closely with a Ruby on Rails back end developer and UX and Design specialist to impliment changes required as a result of recent GDPR legislation and general improvements to the signup and verification process, where success was measured by a decrease in the percentage drop off of user signups to user verifications.
Coding standards were taking very seriously at StudentBeans, merge requests and code reviews were large part of the job. Having your own code checked and critiqued as well as reviewing and critiquing other developers code made me a better developer. On top of this, each squad was provided with a problem to solve, rather than simply being given a brief to fulfil. This bred teamwork and collaboration between all members of the squad.
The configurator was an amazingly complex project to work on. It involved vast amounts of data, much of which would change after a couple of site interactions by the user. The raw data was manipulated by a series of custom nodeJS middlewares and stored in a Redux state. Another challenge of the project was getting the sheer amount of data to fit in the available screen real-estate, especially on mobile. Many hours were spent with the designer making small tweaks to maximise the space utilised.
The main aspect I worked on was the new 'Recommended Choice' initiative, which was largely driven direcly by the client. This entailed each market being able to set a 'recommended choice' for each category within the configuration. Each one would be identified to the user. An option was also added to view a fully configured 'recommended choice' vehicle, without having to do any configuration at all.
This is the main 'Digital Experience' platform for Jaguar and Land Rover, across all markets worldwide. I was involved in many areas of the site, but the main aspect I worked on was a complete refresh of the Retailer Locator component. This required a large degree of attention to detail being considered one of the most important areas of the site, as it is the main way to direct customers to individual retailers to begin the sales process.
I love having colorful and interesting wallpapers on my mac! So, I decided to make a little app that would allow me to download the current trending images in the EarthPorn sub-reddit on Reddit. I then setup my mac to cycle through the images changing my wallpaper every 30 minutes!
There were no massively challenging aspects to this. Probably the biggest headache was working with the notoriously fiddley file system implementation in nodeJS.
I have already implemented a settings file so that the user can easily configure things such as which subReddit to get the images from, where the downloaded images should be saved and the minimum image dimensions that should be allowed. If I were to develop it further, I would investigate a way of automatically setting the downloaded images as the wallpaper, rather than using the built in mac display settings tool and have the app run periodically, automatically; rather than having to manually set it as a scheduled task.