My MVP Workflow, How I Create Web Applications: From Conception To Creation
Everyone knows coming up with an idea is often the easiest part of an application. I come up with a lot of ideas on a regular basis, too many some would say. What is the best way to take an idea and actually build something usable, a working MVP (minimum viable product).
I recently released a couple of quick ideas that took very little time to create, Pokego.run and Built With Aurelia. In the case of Pokego.run, I knew I needed to add in Google Maps, support authentication and ability to add markers to a map. For Built With Aurelia I knew I just needed to display submissions and allow registered users to submit projects.
In most scenarios, this is how I approach building an MVP application as quickly as possible as of September, 2016.
This won’t be a step-by-step detailed process, how I approach fleshing out an idea is actually quite basic.
I realise it’s 2016 and you can just open up a notepad on your computer, but I find pen and paper is the best way to sketch out the basics of an idea. It doesn’t need to be a drawing, just bulleted dot points will do.
I find if I am on the computer, it is far too easy to open up Hacker News or do something else instead of jotting down the basics of my million dollar idea. With a notepad the only thing you can do is write or draw, so you’re more inclined to actually do it.
Before you start developing your idea, you need to have a rough idea of what you need. Is the app going to allow login via Facebook? What platforms/devices/operating systems will you support? What will all of the sections that make up the app be?
Writing things down on paper is less distracting and I personally find it easier. And no, you don’t need an expensive and wanky Moleskin notebook, a cheap 79c notebook from an office supply store is enough or even a blank A4 sheet of paper.
Depending on what I am wanting to build, I might do some poorly drawn sketches as well just to get a rough idea how it might look. Most of my design work is done as I go along. I also take “inspiration” from existing sites and applications I like the look of.
In many cases I will use Bootstrap, especially if I have an application that contains forms or items in a grid. Foundation by Zurb is also a good option, I just find Bootstrap is easier and faster to get running in my apps.
The thing I love about Aurelia is you get the basics you need; routing, eventing, templating, binding support, modules for working with network requests and a clean way of writing applications without needing to learn Aurelia specific concepts or conventions.
If I am working on something that is going to have a HUGE codebase, I’ll leverage the Aurelia Webpack skeleton instead which gives me a little more power and works better for large applications.
I hate setting up databases, configuring servers, finding/configuring/installing a server-side framework to create an API. This isn’t accounting for other things like basic CRUD and the dreaded complexity of configuring oAuth authentication.
Firebase is a Google owned, cloud hosted key/value store with a few other features modern applications need like; hosting, analytics, data storage, authentication and databases. It literally negates the need to worry about setting up a server or configuring a database.
The limits for Firebase are quite generous as well, so there are no upfront costs to use it. As your idea scales, stick with Firebase or setup a server. The point here is Firebase gives you everything you need to create an MVP quickly. Because it’s a key/value store, you don’t need to create database tables and fields upfront.
You probably think that you need to pay for a server to create an idea: wrong. Surprisingly, not a lot of people know that Github offers free project hosting from within Github itself and it even supports custom domain names. It’s called Github Pages and literally all you need to do, to enable it is create a new branch in your repo called
gh-pages and a site is created at: http://username.github.io/reponame/ where
username is your Github username and
reponame is the name of the repo in Github.
You can’t run things like PHP scripts or anything that is not static, but for a client-side single page application, you don’t need such scripts anyway in most cases.
Fun fact: both apps Pokego.run and Built With Aurelia that I mentioned earlier are running on Firebase and they’re hosted on Github Pages.
Get people using it
You’ve got something that works. It might not look pretty, but let’s be honest, not every single web application out there is well designed anyway. You need to get some people testing it, ask friends and family to try it out, even if they’re not your target market. Then ask people to share it on Facebook, LinkedIn, Twitter and anywhere else.
This can be the hardest part of the process. I created a site a few years back for converting Gifs to image sprites called Gif2Sprite. It actually gets a bit of traffic from Google searches, but when it launched, it laid dormant for a while and I was its only user.