Experimenting with React Native & Expo’s Audio API

Here at Stream, we’re all about exploring the latest trends around popular technologies. Doing so allows our team to better understand what is happening in the open-source community, a community that our company DNA is largely comprised of.

Last year, Stream released the open-source project Winds, an aggregated and personalized RSS reader powered by Stream. This year, we’re working on a complete refresh (Winds 2.0) that will introduce podcast support, enhanced social functionality, native iOS and Android applications, and much more. With that, we have decided to use React Native to support our iOS and Android builds — a framework that will allow our development team to write applications that target multiple operating systems, with pure JavaScript. To aid us in our React Native development, we’ve turned to Expo, a tool that wraps the React Native API, allowing for a faster, more streamlined development process.

In order to get our feet wet, we challenged ourselves by building a simple proof of concept. We decided to build an audio player for iOS and Android with Expo’s powerful audio API and, of course, React Native. There were a few requirements for the proof of concept (most of which are found in many popular / common audio players):

• External URL Support (for audio files)
• Play / Pause
• Skip / Seek
• Current Position
• Speed Control (Slow & Fast)
• Portrait Support
• Audio Backgrounding

All of this turned out to be feasible from a technical standpoint; however, backgrounding audio is not yet supported by the latest Expo SDK (currently at v20.0.0). We reached out to the Expo team on Twitter and they responded to let us know that they are actively working on our much-needed audio backgrounding support — which is proving to be a rather difficult endeavor — and that they will keep us in the loop as they continue to make forward progress.

Even without this feature, we are very pleased with the turnout of our proof of concept. Without React Native and the help of Expo, we would not have been able to target multiple operating systems in the timeframe that we have allotted and we would have to work with two separate codebases. By experimenting and building a fully functional proof of concept, we’re now one step closer to Winds 2.0, and couldn’t be happier to announce that the code is 100% open-source on GitHub.

Should you have any suggestions, comments, or additions, please post below or submit a PR on GitHub (we embrace open-source and absolutely love seeing contributions from the community). If you’re new to Stream and are interested in our hosted, scalable feed technology, please have a look at our 5 minute tutorial on the Stream website to see how things work!