Even though React Native and ReactJS are very similar, there are some differences you need to know before starting your first native mobile application.
In a simple term, React Native is a mobile app development hybrid framework used for both iOS and Android while ReactJS is a JavaScript library created by Facebook for high dynamic and performance to tackle User Interface needs.
You need to have some understanding and basic knowledge of how JavaScript ES6 (Which is the most recent version of the language) works to be a credible React Native developer and also because ReactJS is the core of React Native.
Difference between ReactJs and React Native
1. Set-up | Start-up, and Bundling
As a developer, if you are starting up or setting up a new project using ReactJS, you have a bundler to choose like a Web pack and you also try to know the bundling modules which are needed for the project.
In React Native it is not the case – as it comes with everything you need. Thus it makes starting a new project easy and fast. As you only need a command line to write the code for your native app.
2. The use of HTML and Styling
React Native does not use HTML for app rendering but makes use of alternative components that work in the same pattern and are translated into their equivalent HTML like <view> to <div> and <text> to something like a mix-up of <span> and <p>.
And thus the libraries used with ReactJS cannot be used in the React Native framework. Also, to style React Native components, one has to create style sheets in JavaScript which looks like CSS but not the same.
This might confuse you at first especially when you get to a point where you need to create mix-ins like what you would do with SASS, or when you want to override the component style you want to reuse.
3. Creating Animations and Gestures
With React Native, We have nothing to do with CSS animation you will have to learn a new method of animating different components of your app with JavaScript. The most popular one is the Animated API which could be compared to the famous JavaScript library Velocity.js. Using this, you can create various animations, based on a velocity associated with a gesture.
Overall, with React Native, you can do any kind of animation on the web with a nice layout that is very cool and simple to use for transitions. But for now, it is only working with iOS at the moment as Android does not support it.
To interact with user gestures, React-Native provides something similar to the JavaScript touch events web API called the Pan Responder. In the beginning, you will find it complicated to set up but as time goes you won’t be disappointed.
4. Navigate between different scenes
You might be wondering how to navigate between scenes when you are developing your first mobile application. For this, you don’t need to look for an alternative to react-router usually used to transit between pages which could be complicated in some situations and might not give you exactly what you are looking for. But with React Native, you will not encounter all these challenges.
Apart from this, you will notice other differences in the specific codes used on both platforms and the fact that there is no need to install any developer tool while doing a new project with React Native.
Along with this, you should also learn how React Native is emerging as the future for hybrid mobile apps.
