A month of React Native
Adventures in building my first-ever mobile app
It’s January 1st, 2019. No resolutions. Straight to actions. The goal: build and publish a mobile app by the end of the month. It doesn’t have to be perfect, but it should (a) do one thing really well (more on what that is below), (b) work on both iOS and Android, and (c) have a somewhat decent design.
As I’m building the app, my goals are simple:
- Become better in setting realistic product requirements
- Make better informed technology choices
What I’m building
The app is brings some of the top “best-of” lists from blogs and websites like Eater, Thrillist, The Infatuation, Grubstreet, and other reputable sources. The inspiration came from my own personal experience. I’m not a big fan of Yelp and other community review platforms, but rather prefer to get tips about good restaurants, bars, and coffee shops from food writers/critics that I know and trust.
Unfortunately, all of this information is only on those blogs, lacking the features of bookmarking/shortlisting, sorting by location, searching, and other basic features found in apps like Yelp. My parallel design inspiration is Flipboard, which takes existing content from news websites like CNN and BBC and gives the user a unique (and much improved IMO) experience.
Although I’ve played a tiny bit with React Native and expo in the past, I’ve never gone past a single-screen toy app that just tests the APIs. I’ve also never built anything on mobile, period (e.g. in Swift or Objective-C).
I have had some exposure with React (I recently rebuilt the entire web app for Agentrisk — my day job). But I’ve mostly done backend and low-level stuff for most of my programming life (think device drivers, distributed file systems, software-defined networking, etc). Total noob.
What to expect
As I’m building my app in the coming weeks, I’ll be documenting things that I’ve learned, things that gave me grief, how-to’s for things that I figured out that may help others in the future, and other such goodies. I’ll try to build something small each day and do a brief write-up about it. Note that I’ve mostly built the backend, so there won’t be many posts covering that part. I will try to cover briefly what came into building the backend in 1–2 posts.
Here are some of the technologies I’ll be using to build the app:
- React Native (obvs)
- Expo (a fantastic toolchain for building RN apps)
- Node.js on AWS Lambda (for implementing backend logic)
- AWS DynamoDB (for storing all data related to the app)
- AWS Cognito (for all things auth)
- Serverless (the best toolkit for building serverless apps)
I’ll also be following closely this amazing guide on building a React app with serverless on AWS, modifying and adapting it to React Native. Why these tech choices? Mostly because I’ve played with these before and I’m quite familiar with them. I really want to focus on learning React Native in this project and I don’t want to introduce other variables. After I’ve launched the MVP and it’s in the app stores, I’ll revisit these tech choices.
Ready? Let’s do this.
Posts in the series
- Setting up the development environment
- Basic navigation between screens
- Displaying a list of (possibly infinite) arbitrary items
- Setting up an authentication flow
- Getting location information
- Storing config (and other data) in local storage
- Sending push notifications
- Setting up a splash screen and loading assets
- Handling links and sharing things
If you enjoyed this article, feel free to hit that clap button 👏 to help others find it.
I’m Alex, a software engineer and startup geek. Currently, I’m a co-founder at a startup called AgentRisk, where I’m the VP of Product & Engineering. In a past life, I was part of the founding engineering team at an enterprise cloud storage startup in Silicon Valley, did a bunch of cool cutting-edge projects at Cisco Research, and worked on some really innovative data center network architectures while doing my Master’s at UCSD. I always enjoy learning new technologies and b̵u̵i̵l̵d̵i̵n̵g̵ shipping side-projects all the time.