Skip to main content

Welcome to Solito

Solito is the missing piece for using React Native with Next.js to build powerful, cross-platform apps.

About​

This library is two things:

  1. A tiny wrapper around React Navigation and Next.js that lets you share navigation code across plaforms.
  2. A set of patterns and examples for building cross-platform apps with React Native + Next.js.

Motivation​

In 2021, I spoke at Next.js Conf about how I built beatgig.com with Next.js and React Native.

Little by little, a sizable community has grown around this stack. The goal of this project is to bring together the hardest piece of the stack: navigation.

If you haven't seen it yet, I recommend you watch the talk:

Background​

Prior to Solito, I built Moti for cross-platform animations, powered by Reanimated 2.

I also maintain Dripsy, a library for building theme-based, responsive design for React Native and Web.

I have a number of other libraries dedicated to Next.js + React Native.

My first library, expo-next-react-navigation, was the first iteration of Solito, which I used for a few years. Eventually, I realized that the API was too convoluted to work as a replacement for next/router. Then React Navigation released a great API for navigating around with URLs, and I realized that that would be the future.

I opened an issue on expo-next-react-navigation called "The Future API" where I thought through all the necessary steps to truly unify the stack.

Next, I worked on a PR with Axel Delafosse to unify the navigation stack in his monorepo starter. That PR has nearly 100 comments from people in the community chiming in on potential use cases. Ultimately, the approach I worked on in that PR was dropped in favor of a simpler, headless navigation method. And there, Solito was born.

The rabbit hole​

If you are curious about my journey working on Expo + Next.js, and how I arrived here, I recommend doing a few things:

  1. Watch my Next.js Conf talk
  2. Follow me on Twitter and read through my tweets.
  3. Read through issues & PRs created by me on my GitHub repos – mainly on Moti and Dripsy. a. For example, in this issue on the Dripsy repo, I explained my desire for a high-performance, simple animation library. That idea became Moti, which is now one of the most popular libraries for animating in React Native (+ Web). b. I spent a lot of time trying to add SSR support to Dripsy to Next.js, and ultimately dropped it due to limitations from React Native. If you do some Googling about React Native Web's Server Side Rendering support, you'll find me talking about it. c. This PR I mentioned earlier is good to read through too (not the code, just the comments.)
  4. Listen to my podcast on React Native Radio, where we discuss Expo + Next.js.