Develop a Complete Mobile App in 30 Minutes with TypeScript - React Native

4 years ago
241

Learn how to use a public API to create a native mobile application with the JavaScript React Native framework.

In this tutorial we create a native mobile application to view a list of top Hacker News articles using TypeScript. When you select an article we display the contents of the article in a WebView.

Steps:
1) Create new React Native app
2) Add navigation packages
3) Create service to get data from Hacker News API (Medium article on this https://jakecyr.medium.com/react-native-http-request-to-populate-a-list-243f58df657f)
4) Setup App component for navigation
5) Add Home and Article pages
6) Add list to Home screen using service
7) On article click, redirect to Article screen with WebView
8) Build if you want to publish to the app store (checkout my Medium article on this https://jakecyr.medium.com/react-native-publishing-to-ios-with-expo-ce0603544b0b)

If you like this video don't forget to like and subscribe to not miss out on future videos!

References:

Install Expo CLI:
https://docs.expo.io/get-started/installation/

Setup React Native (and navigation):
https://jakecyr.medium.com/create-your-first-react-native-app-a3aa989a7e4e

React Native Webview (NPM):
https://www.npmjs.com/package/react-native-webview

Hacker News API Endpoint:
https://hn.algolia.com/api/v1/search?tags=front_page

Loading 1 comment...