Rapid prototyping with the expo-starter kit

Everything included, just npm i water…

Release Screenshot for v1.0 of AllBitsEqual/expo-starter on GitHub

As this is the first post of the new year and additionally the first day of the year that I started working part-time (see “As a father, I decided to earn less and here’s why”), let’s try and have some fun.

And to start this new season off, I’ll open with something I found very useful and which I’m using a lot myself for rapid prototyping and smaller solo projects…

*drum roll please*
=> The EXPO-starter kit <=

… Yeah, I named that myself.

There are only two hard things in Computer Science: cache invalidation and naming things.

— Phil Karlton

I’ve been using this setup for a while now and I’ve adjusted the linting rules to my regular coding style. Furthermore, I’ve added a basic redux and navigation setup that allows me to simply clone my expo-starter repository, run npm i, adjust the app.json and start coding.

What’s included?

  • expo
  • react-native
  • redux
    -> working store implementation in /redux/
    -> usefulness general-purpose middleware
  • react navigation
    -> preset App.jsx with Navigation
    -> initial navigation stack in /routing/
    -> optional AppLoading screen as the initial route
  • eslint
  • prop-types
  • useful but opinionated folder structure
  • splash screen & icon template

Why redux?

I don’t need redux in every project but kicking it out is much easier than rewriting the needed store and reducer boilerplate code every time. The way it’s currently set up, I can easily add new actions and reducers and have a handy preset of middlewares that are just as extendable as the rest of the project.

Why Navigation?

It’s stable, under active development by Facebook and the way I’m working with it, I could switch it out any time without much hassle. That’s part of the reason why I’m importing the navigation from the separate /routing/ folder and why I made reusable “link” button components.

Future Development

The expo-starter project is under active development as its a tool I use a lot and as my experience and needs evolve, so does this package. I’m gonna be referencing it a lot in the coming tutorials but I’ll always specify which version I’m using and include a direct link to the respective tag/release so you shouldn’t have a hard time following any of my other articles.

You could also start barebone and use expo init or your own setup just as you like. Your mileage might vary but it won’t be a problem. Most of the other tutorials will mainly use it as a playground and only some of them will rely more heavily on included features like redux and navigation.

SceneHome.jsx— the place where you start coding

Sign me up, I want this!

If you want to try the expo-starter, you can head over to my GitHub page and copy/download/clone/fork my project, open a terminal, run “npm i” in the root of the project and you are good to go… if you have the expo-cli installed.

For more info about the EXPO project, head over to their website and read their wonderful documentation.

I will update this post with every major update of the expo-starter project and highlight the latest changes.

Some words about me:

If you want to see more of my work and progress, feel free to check out my series on building a React Native Web App with Hooks, Bells, and Whistles with Expo SDK33. I’m also currently working on a new series about building more complex and scalable apps using React/Redux, where I’ll go into details about how and why I do stuff the way I do as well as some articles on my experience in building games for web and mobile with React.

And if you feel really supportive right now, you can always support me on patreon, thus allowing me to continue to write tutorials and offer support in the comments section.

I’m a Web / App Developer & father 👨‍👩‍👧 doing freelance and part-time agency work since 2003, 💻 building stuff on the side 🕹 and attending conferences 🎟