I recently built a website for LimeMicro that gave a read-only view of their Ubuntu (white-labelled) App Store. The brief was quite simple, with the following requirements:
For this small project I decided to use Vue.js 2.0, it was my first time using it for a production project. I wanted to make use of its server side rendering (SSR) and component architecture. I had considered React but I knew the learning curve is steeper, and this project didnt require something so powerful. Vue is lightweight and—quite frankly—was a joy to work with.
My workflow consisted of a number of small prototypes, each based on the previous but often modified quite heavily. I began with the HTML structure and some basic styling. As with most other app stores, the layout was a grid home/search page with a details page inside. At the time of writing, CSS Grid Layout is at 62.34% compatibility globally. Given that mobile browsers would only see a thin layout (1 or 2 columns) anyway, I decided to use Grid and fallback to a linear layout. I also used a manifest file and tried to optimise it as a Progressive Web App where possible.
Originally I had intended to use client-only JavaScript and create the website without a server. This would have worked if it were not for an issue with CORS on the Ubuntu API, so I decided to use a server as a proxy. Once I had the server in place, I figured that the website would be more robust using Vue.js and I had been wanting to use it in a client project for a while. I am definitely glad with my choice, not least because the Vue plugin for Chrome Developer Tools makes debugging far easier and has a time machine mode for easy replay.
I figured that if a server was required, there is no reason the whole thing shouldnt be server-side rendered. After some tackling with Webpack (I ended up ripping out the code from the Hacker News demo to get that working), I got it to a stage where it worked perfectly without JavaScript. Despite being a huge advocate for SSR and accessibility, I still find it mind-blowing that an app created completely with JavaScript can work without JS even enabled. Its brilliant, and definitely worth the effort.
This approach gave us the ability to rapidly develop the prototypes and I was able to meet the requirements in a very short amount of time.