
In AddItem.js: import React from 'react' import Now let’s write the following codes in our AddItem.js and ListItem.js and import them to our main App.js file. Here we will create a new Folder called “components” and add two new files called AddItem.js and ListItems.js. The folder structure will look like this: Now you can choose to run this on a virtual device/emulator, or your phone. Now to start a development server, run the following command: npm start you can also use: expo start Just choose “Blank” for now since we are going to be starting with just the barebone features. You’ll be asked to choose from a bunch of options called “Blank, Miniminal etc”. Then run the following commands to create a new React Native project called “todolist”. So to get started we first need to download expo, which is an open-source platform for making universal native apps for Android, iOS, and the web with JavaScript and React.Īssuming that you have Node 12 LTS or greater installed, you can use node package manager or npm to install the Expo CLI command line utility by running the following command in your cmd. You need to have a working level understanding of the following things in order to fully comprehend what’s going on in this walkthrough.

But in the future, I will show you ways how you can create good UIs using React Native.


You can experiment with the styling yourself once you’re done implementing the whole thing. The main idea of it is to demonstrate how a todolist can be made with react native as fast as possible. I’m thinking of keeping it pretty short with minimal to almost no styling at all. Assalamu Alaikum! In this particular story, I’m thinking of demonstrating how we can make a Todo-List using React Native!
