Part II - Building UI with React-Native

Part ɪɪ: React-Native UI│Story 01: Install System Dependencies

In the Part-I of this series, we created Serverless API with lambdas for CRUD operations to the DynamoDB table and deployed it to AWS.

In this Part-II of the series, we will start with the front-end side. We will be building our frontend as a mobile app for both iOS and Android platforms using React-Native. The app would allow the users to sign-in using their Google accounts.

Here is overview of the tasks we would be doing as part of UI development of the app:

  1. Registering the app with Google for oAuth/Sign-in services for iOS, Android platforms
  2. Setting up ESLint and Prettier
  3. Initializing react-native project
  4. Adding components for User Sign-in, few screens to view, add and update words to user’s vocabulary with some static/hard-coded data.
  5. Adding redux to the app

Once we have the app ready with static data, in the Part-III of the series, we would connect our UI with the AWS Serverless API that we developed in Part I to work with live data.

[ ⚠️ Disclaimer: Reiterating the disclaimer mentioned earlier in the introduction of the series, it’s been assumed that the reader is familiar with concepts of react, react-native, react-navigation, redux, redux-thunk and other related technologies. Explaining those in details would make the stories/series lengthy and would drift us away from our primary focus. However, if you are not very familiar with these topics, I feel you can still follow along if you have been working with javascript for a while and should be able figure out the code and things by googling around and learning in parallel. ]

System dependencies for building react-native app

If this is for the first time you are building a react-native app, you need to prepare your local development system with the dependencies for react-native.

Follow this guide to install the dependencies for mac / windows or linux platforms. We would be building the app for both iOS and Android platforms, so install the dependencies for both the platforms.

In the next post, we would create an iOS app in Google Developer center to sign up for Google Sign-in services for our app on iOS platform.

So ready? let’s go…

Prev:(Part I) Delete word 🏠Next: Registering with Google

--

--