Building MVPs in 36 Hours, No Exceptions

Way too often I see someone building an “MVP” (Minimum Viable Product) that is definitely NOT an MVP. In fact, I’ve done it before, and boy did I learn my lesson.

Building a product to test shouldn’t take you months, in fact it shouldn’t even be measurable in weeks. You should be able to build your product in mere hours.

I’ve gotten plenty of emails asking me how I built Kobra.io, what technologies I used, etc. And I’ll tell you what I used to build it, but first I want to tell you how.

Even though I “worked on” the Kobra relaunch for 6 weeks, the truth is, I programmed the new version in a record 36 hours.

Yes, 36 Hours.

36hours

Most of my time is spent on marketing, getting the word out, brainstorming, etc. But building the actual web app only took me a day and a half. Now, I didn’t program for a day and a half straight, I spaced the 36 hours over a week. This gives your mind time to relax and will make you better at solving problems.

So in “a day and a half of programming work” (granted there was a lot more marketing than programming work) here’s what I accomplished:

  • $2242 worth of sales
  • 393 registered users
  • 2418 collaborative files created
  • 6428 unique visitors to Kobra.io since launch
  • 150 up votes on Reddit post in r/programming

The truth of the matter is that ANYONE CAN DO THIS. I’m not special, I don’t have some rainbow crapping unicorn in my closet, I just focus on what matters.

rainbowpoopingunicorn

What matters?

I’ll tell you what matters, getting your product to market as quickly as possible so you can test it. And to all the programmers like me out there, I want you to take one thing away from this post:

Making everything from scratch is not even close to what matters. Not even close.

Seriously, I want to say that again:

Making everything from scratch is not even close to what matters.

I like to follow a 3-Step Development Process that allows me to develop my side-projects as quickly as possible while still making great products. If you haven’t read that post, here’s a quick recap of the three steps:

Step 1: Find It

For every single feature or major portion of your idea, I want you to try to find source code that already exists that can reduce the amount of actual code you have to write.

I wanted to add WebRTC Video & Voice chat to Kobra. Did I go out and program WebRTC from scratch? Hell no. I went out and found the EasyRTC library and programmed the video chat in about 200 lines of code.

Step 2: Buy It

Your time is worth money, so if a feature is going to take you 40 hours to build, but you can buy closed source code or a service that is going to cost you $50, by all means buy the code.

Yet again, back to Kobra. It’s a collaborative code editor, did I want to program the collaborative code editor from scratch? Absolutely not. So I found Firepad by Firebase, a service that costs me a grand total of $50/month. Oh, and they host all of my static content, so I barely even have to have a server.

Step 3: Build It

If you’ve done steps 1 and 2 correctly for each feature you want to add, the only thing you should be programming is the shell that ties everything together and makes it look like your app.

But there is a secret…

Pot-of-Gold

Even if you follow my 3-step process, you might still not be fast or effective at building MVPs and testing them out. There is another problem that developers have when it comes to programming side-projects, startups or other projects:

It’s not about finding out which tools to use, it’s about finding THE tool YOU can use effectively.

Are you effective and fast with your current development setup? Are you using Frameworks that play to your strengths and help you with your weaknesses?

There are A LOT of backend frameworks, frontend frameworks and even design frameworks that you can use. But there is going to be one golden combination for you specifically. And once you find that one combination, you have to stop bouncing around. Yeah, that new framework is shiny, but if you’re already hitting that 36 hour mark, keep powering on!

For me, that just happens to be AngularFire, the combination of AngularJS and Firebase. Here’s why I use it:

  • I don’t have to program an API at all.
  • I don’t even have to host my own static content.
  • I don’t have to program code to link database values to JS code.
  • I don’t have to program code to link JS code to DOM objects.
  • I don’t have to program code that links JS code or DOM object values back into the database.
  • I pretty much don’t have to do anything.

I’m currently putting together a video course on AngularFire, and I want to drive this point home so hard that I’m just going to give you the 1st lesson right now for free (sorry if it’s a little dark):

Once you have learned to harness the power of ONE tool effectively, I guarantee you that you are going to be able to launch MVPs in record time.

Stop wasting time making the “perfect” product, or adding feature after feature, instead just make something that you can launch right now. Then you can spend all of the time you’ve saved getting it out into the world to see if it has legs.

Back to How I Built Kobra.io

So how, specifically, did I build Kobra.io? The first thing I did was go out and Google, A LOT. I was searching for open source or closed source projects that I could use to make my vision into a reality.

The two primary parts I knew I wanted were: collaborative code editor and video/voice chat. From there I discovered the following projects and tools that I could use to build Kobra:

  • AngularFireThe JavaScript framework AngularJS backed by the Database-as-a-Service Firebase.
  • Firepad.js: An open source project by Firebase that has collaborative editing built into AngularFire.
  • Firebase SimpleLoginA login service provided by Firebase that automatically integrates with: Email/Pass, Facebook, Twitter, Google and GitHub. I hate programming auth, so this was an awesome find.
  • ACE EditorA beautiful open source code editor that comes built in with syntax highlighting support for 100+ languages, themes, code folding, keybindings, and anything else that I could ever want.
  • EasyRTCA (somewhat) easy library to use so you don’t have to code WebRTC Video/Voice chat from scratch.
  • Stripe: A really easy payment system that was specifically built for programmers.
  • Bootstrap: Twitters design framework that has great looking buttons, modal dialogs, etc.
  • UI Bootstrap: AngularJS directives to replace the jQuery from bootstrap.

Boom. Every single feature I needed was already taken care of from other peoples code. Then I tied all of the pieces together, made it look how I wanted, adding a small amount of other features that I required, and launched!

Granted, now I am adding a ton of custom features, but the point is that when you launch an MVP, start with the basics.

Code as little as possible.

Focus your efforts on what matters in the beginning, actually getting people to use your project. You want to find out as soon as possible if no one will use it, otherwise you may just be wasting time!

Wrapping It Up

So, what should you take away from this article? Just remember these few things:

  • The 3-Step Development Process: Find It, Buy It, Build It.
  • Find ONE framework you like, learn it well so that you can build quickly.
  • RESEARCH your features so that you can find open/close sourced code to use instead of programming it yourself.
  • Build an MVP, not a full blown product.
  • There is no rainbow crapping unicorn, it’s not magic.

I’ll be writing A LOT more articles on launching, MVPs and tips to get more users, be sure you sign up for my email newsletter below, you won’t regret it.

Free "Building Software Products in a Weekend" eBook

You'll learn the development strategies I used to program my SaaS product in just 36 hours.

Any programmer can take information in this practical 53-page eBook and use it to build a software product. You'll be able to take your idea and boil it down to a Minimum Viable Product, learn how to waste less time writing unnecessary code, and use my 3-step development process for building quickly.

Download link will be emailed to you. No spam, unsubscribe anytime.

  • http://www.usabilityhour.com Craig Morrison

    Great post Matt!

    • http://mattkremer.com Matt Kremer

      Thanks Craig! Glad you enjoyed it :)

  • coinpusha

    nice, this helped alot. I hope to get an MVP launched by the end of next week, although I’m shooting for 36 hours!

    • http://mattkremer.com Matt Kremer

      You don’t necessarily have to get your idea done in 36 hours straight. I actually did mine over the course of 5 days. Sometimes it is good to take a break just so your mind can clear. And obviously if you do 36 hours straight you’re going to be pretty tired, which will kill your productivity ;)

  • Majid

    Nice find :)

  • Dean Moyes

    Very nice post Matt! I’m just wondering how you could use Stripe with AngularJS only. Did you use server side to process Stripe at all? If it was completely client-side code only then how we could handle response from Stripe?

    • http://mattkremer.com Matt Kremer

      Hey Dean, I actually have a $5 Digital Ocean server running that only does two things: Stripe Payments and the relay for Video/Voice chat. :)

      • Dean Moyes

        Thanks Matt. Is that possible for you to share how you could process Stripe payment on server side? Did you use Rails or PHP or other server-side code to do that? I’m kind of find a way to just using AngularJS only as I’m not good with server-side language

        • http://mattkremer.com Matt Kremer

          I’ve had multiple people ask me this, so I’ll probably be recording a video / tutorial on it soon and put it up on my blog! :)

          • Dean Moyes

            Can’t wait to see that :)