Rapid Prototyping In React

Camron Godbout
3 min readJul 9, 2018

Using React.js to build a website MVP and iterating based on user feedback.

Overview

At Apteo we’ve been working towards a product that helps people find investment ideas using AI. We’re calling this product Milton and you can learn more about it here. To accomplish this task we are using a lean methodology that starts with building an MVP, getting user feedback and iterating on the product to continually improve it. Doing this always has its challenges on the technical side such as, having to run in multiple directions and have the code be flexible enough to allow for fast changes to keep the product moving forward.

What is React

React is Facebook’s open source JavaScript client side library. It allows for creating a website in a manner where every “element” of the page is broken into it’s own component. Each component can be worked on independently and can be reused in multiple places. It allows for a single-page web application that provides a seamless experience for the user across across the entire site. From a developer’s standpoint, it allows for clean front-end coding using an object-oriented approach

Why React?

Using React allows developers to work on different parts of the website’s code without stepping on each others toes. Using components makes the lives of our developers much easier. If we want to make a change to the navbar we don’t have to go across multiple files, we just make a change to the navbar component. This allows for easy, modular coding, which increases the pace of our development since developers can easily take mockups and turn them into bespoke components. This component will then be plugged into the site wherever it where developers need to utilize it using only one line of code.

Using User Feedback

Once the initial design and MVP are in place, we conduct user interviews. In order to do so we get someone who matches our target audience and we bring them in to our office and have them go through the website. We ask them lots of questions about the webpage, what functionality makes sense to them, what types of things they are thinking as they’re looking at the page … etc. This process allows us to ‘get our heads out of the weeds’ and understand what our users are actually thinking. We take the user feedback and implement changes into our codebase based on how the users reacted.

Conclusion

React allows for rapid prototyping and iterating because it’s all designed in components. When we need to make a change across the site, we can do so in one single file and have that change reflect across every page in which the component is located. This type of rapid prototyping is critical to the speed of getting a product out the door on a deadline.

Using React is allow us to move our product forward very quickly. For more information on how to get started using React for your websites and possibly your MVP check out: https://github.com/facebook/create-react-app

We’ve chosen React because it allows for us to “move fast and break things (Zuckerberg)”. This helps us create the best possible product for our users — which, at the end of the day, is the most important thing.

If anything you found was interesting or you’d like to see how our MVP is going and want to find more information on investments checkout milton.ai

--

--