Building An E-commerce Search App with React Native

Building An E-commerce Search App with React Native

hackernoon.com hackernoon.com4 years ago in#Dev Love27

Originally published by Deepak Grover on February 27th 2018 We will go over the process of building a starter e-commerce mobile app for searching through a books datastore using React native. If you have never worked with React Native before, this can act as a kickstart to your mobile app development journey with Javascript! 🎉 Some context first! It’s 2018 and JavaScript is growing faster than ever before. The entire community has been working hard to make the web more and more accessible. Everything starting from the libraries and frameworks, to the dev tools required to build the apps, have matured gracefully. Sure, there has been some chaos amidst these improvements. But it is just fascinating that if you know JS today, you can build a web app, a backend server and even mobile apps. React Native enables building native mobile apps using JavaScript and React. Unlike Cordova/Ionic/Phonegap that also lets you build mobile apps using JavaScript with WebViews, React Native compiles entirely to a native app and also allows writing native (Swift, Objective-C, Android) code when required. Things you need to know before getting started 👶 You should have some (if not much) experience writing React. It is fairly easy to get started with and has good resources available online that can help. If you are new to the subject, you can start with the official tutorial. And, if you prefer videos over text, I highly recommend Kent C. Dodds’s free course on Egghead — The Beginner’s Guide to ReactJS. It’d be best if you have a fair understanding of ES6 as well. I’ve got you covered with that. I wrote a kickstarter guide to writing ES6 which should put you on track in no time. 💪 You don’t necessarily have to spend a lot of time learning react and building web apps. (Although I’d recommend you to do that). But if you quickly want to get started with React Native, get yourself familiarised with React’s basic fundamentals because React Native and React share the same core principles for building apps. They just target two different clients — web and native. Here, I want to highlight the fact that if you use React and React Native in production, you can end up with a lot of shared code across all the platforms (web, iOS and Android). This will enable you to maintain bigger projects with less development time and costs 😉. This is one of the reasons why React Native is starting to see industry wide adoption: Airbnb, Facebook, Instagram, Walmart, Tesla have their mobile apps built using RN. Basic Concepts 👩‍🎓 Let’s start by briefly discussing how React Native works and how the JavaScript code actually translates into a kickass native mobile app. Any React Native application runs in two threads: 1. Main thread This thread manages the user interface of your app and processes all the native interactions including gestures and touch. Since React Native also allows you to add in native code written in Android Java, Objective C or Swift, these chunks of code get executed on this thread. 2. JavaScript thread This executes the JavaScript code that you write in a separate JavaScript engine (which is present in iOS by default and gets shipped to Android devices with the build). For the application to work,  » Read More

Like to keep reading?

This article first appeared on hackernoon.com. If you'd like to keep reading, follow the white rabbit.

View Full Article

Leave a Reply