Create a News App for iOS and Android with Bold CMS and React Native
We know that the domestication of the internet has encouraged the growth of multiple media outlets. The Reuters Digital News Report shows a significant increase in the use of news apps, especially since 2016. News apps are simply an extension of the services a portal or website provides, however, the user experience is vastly different.
You need a news app, here's why
Improve user experience with better access to content. You can provide a custom experience, tailored to every reader, with features like Bookmarks.
Alert your readers instantly about new content pieces, using Push Notifications. Drive your users back to the app with latest alerts.
Monetize your content with Subscriptions and Metered paywalls. This allows access to better content and supports quality journalism.
Apps work quicker. Readers have access to content even on low internet speed.
Increase overall user retention through features like search, tags, related stories.
Personalise user experience to the extend of dark or light mode for improved readability.
Text-to-speech, a feature we are excited to promote soon, helps users listen to stories without having to stare at their mobile screens, similar to an audiobook/podcast.
How we create a news app with Bold and React Native
*Prerequisites to build an app
Bold CMS instance
Logo and Brand colours
Primary and Secondary Fonts
Company account on app store and play store
AccessType instance for monetization (optional)
We’ve built a mobile framework that turns any news website on our CMS into a react native app.
There are pre-coded building blocks of layouts that make it a plug and play process. Here's how React Native apps pull the data from the Bold CMS -
Any content published on the Bold CMS is stored and managed in the database, coupled with the CDN layer. This data is then made accessible by Sketches, which provides us with REST APIs to fetch and query that data. This stack is what gives the CMS it’s headless API-first nature.
Those APIs are then translated by Ahead into routes, which power the front-end for the publishers. It is these Ahead endpoints (Malibu-based or Custom) that the React-Native apps consume, via a mobile-data.json route that packages the content in a mobile-friendly JSON object. Consuming the Ahead endpoints ensures that the web and mobile apps look identical.
It is this JSON data that the React Native apps use to render everything from headers on home, section lists, story pages, author pages, tags, to search functionality. All this data is maintained internally in the application’s state using Redux.
We have integrated authentication(Form or social login) in the React Native apps with Bridgekeeper.
Additionally, React Native apps uses our content monetisation tool Accesstype, to support subscriptions and metered paywalls.