Flutter vs React Native | Which One You Should Learn? | Edureka

React native by Facebook and Flutter by Google are too hot cross-platform app development technologies creating a buzz in today's technical industry. Today in this video we will be comparing flutter with react native and I'll be helping you choose when you should choose one over the other. Okay, so let's get started. Now before I get started let me just give you guys a brief overview of the topics that will be touched upon by me today so first of all I will be going through what is flutter and then I will be giving a similar brief introduction to react native to so that we have a general idea of what we are talking about if you guys have no idea as to what flutter and react native is and would like to know more you could go ahead and check out my flutter tutorial which you can easily find out on Edureka channel. ok we don't have such tutorial for react native at the moment but we are working on that and that will be out soon too so for now I'll be giving you guys a short introduction to both technologies and then moving on we will be comparing the two technologies on various parameters now these parameters include stuff like performance speed which already comes into performance and the visualizations the types of confidence that you get the developer creativity that it might imbue and a lot more so there are 10 points that we will be comparing flutter and react native today and in the real-world scenario you can find more than these 10 points but in my opinion these 10 points are the pillars when it comes to choosing a certain framework so these include stuff like the quality of documentation now if some framework is not properly documented it becomes really hard to adapt to that framework ok so let's move on and start off with this session today before I keep blabbering on and on ok so our first topic of the day is what is flutter Flutter is a cross-platform mobile application development framework that is provided to us by google so before we go ahead let me just explain what that means so due to the growing popularity of mobile applications almost every company needs mobile apps or apps to remain competitive in the market and what is more companies are looking for an option to build mobile applications especially for ios and android with faster speed and less resources obviously Apple and Google have provided native tools and technologies to build applications iOS app developers can build apps using Xcode and Swift while an Android developers use Android studio Kotlin Java and more of such things however this requires engineer to learn two completely different sets of technologies as a result companies have started to adopt cross-platform solutions over the needs of solution to build apps for both iOS and Android which basically implements faster using a single language so flutter is a project started by Google and it was started in 2017 it is a programming framework built on the language of dart and it allows you to make cross-platform apps that behave natively for a mobile application if you want to know more about flutter please go check out my flutter tutorial where you will also learn how to make your first app using flutter itself moving on to react native well react native is something very similar to flutter it is a mobile application development framework that is developed by Facebook the people who built react Jas and redux so this is their mobile application front so react native is what Facebook uses for its Facebook applications is messengers and everything else now this works on both iOS and Android and main language that this whole framework is built around is JavaScript now before we go ahead and start digging out each and every nitty-gritty of these both frameworks first of all let's go ahead and compare them so today we will be comparing on stuff like programming language technical architecture installation setup and project configuration UI confidence and development API developer productivity community support testing support build and release automation support and the DevOps CI CD support hearing all this you must have realized that this is a very developer specific video this is a developer's perspective on both these frameworks and this is not a layman's perspective where he tries to understand which installation is tougher or which framework is bigger like that this is a completely developers perspective as to what would help you if you are a developer whether you're using flutter or EF native now the first part that we are going to be comparing is programming language so the key benefit of using a cross-platform mobile application development technology is the ability to use a single programming language to develop apps for both iOS and Android so flutter uses the dart programming language which was introduced by Google in 2011 and is rarely used by developers Dart syntax is easy to understand for JavaScript on Java developers as it supports most of the object-oriented concepts it's easy to get started with dart as there is a great and easy to follow documentation available on the official dart site react native on the other hand uses Java Script to build cross-platform applications javascript is very popular language in the web community at the moment it is commonly used with react and other popular JavaScript frameworks thanks to react native web developers can build mobile applications with a little bit of training with this in mind companies adopted react native as a no-brainer javascript is a dynamically typed language and anything can be done with JavaScript which is good and a bad thing at the same time so what do we analyze from this comparison javascript is widely used by most web developers and hence it is easy to adopt the react native framework dart also has a great feature set but it's rarely used and less known in the developer community considering this it's clear that react neither wins point in the programming language category our next point of comparison is installation so the installation method be straightforward without having too many complicated steps so that it could be easily learned by developers that are just starting out with it flutter can be installed by downloading the binary for a specific platform from the github page which is very easy in my opinon case of Mac OS you can download the flutter dot zip file that is also there in the github page and you also have to set up a separate path variable now you can do this easily by the command line instructions that you can find on the official documentation so flutter should improve the installation method by supporting package managers like homebrew Mac board C um apt etcetera so that users won't need to perform these extra steps during installation react native framework can be installed using the node package manager or NPM for short for developers that have a Java Script background installation of react native is easy whereas other developers would need to learn the new package manager the node package manager can install the packages locally or globally the developer will need to understand where exactly the binary is located whilst installing react native on Mac OS you will need to have the homebrew package manager as well in short you can do it from the command line okay so what do we analyze from this comparison well both flutter and react need a black one-liner installation with native package managers for specific OS but flutter installation seems to require extra steps for adding the binary to the path and downloading it from the source code which might be useful for non JavaScript developers react native can be installed by just using package manager without hassle of downloading the binary from the source so in my opinion react native winds out here again when compared to the installation point now the next parameter that we are going to be actually comparing react and flutter on is documentation so the process of setting up the developer machine to use the new framework takes time it requires a lot of configuration of software installation and the technology should have proper documentation to get users up and running getting started guide for flutter has detailed information on IDE setup and platform setup for both iOS and Android you can read up all the required steps on the installation link on top of this flutter also has a command line interface tool called flutter doctor which can guide developers through the setup it inspects which tools are installed on the local machine and which tools need to be configured once the flutter doctor command is happy we can carry on with creating a new flutter app there is a separate page on how to configure the editor to get going with flutter and you can also find this in the documentation once all is set up and done we can create and run a new flutter app from the command line by just running a few simple instructions on the other hand the getting started guide of react native assumes that the developer already has all the required setup for developing for iOS and Android there is little information on the Xcode command-line tools but it won't be enough to get going the documentation directly jumps to the step of creating a new project a new reactive project can also be created and run on an iOS simulator using some few simple commands now at the step you must be thinking what might be the result well from the comparison above it's clear that flutter offers a better documentation and command-line support for setup and configuration so flutter takes the point out here now the next point for configuration is architecture now when choosing a cross-platform mobile app development framework it's essential to consider its technical architecture by knowing the internals of the framework we can make an informed decision and choose the one that is better for our project flutter uses the dart framework which has most of the components inbuilt so it's bigger in size and often does not require to bridge to communicate with the needs of modules dart has so many frameworks like material design and Cupertino packed inside which provide all the required technologies needed to develop mobile applications dart framework uses key R C++ engine which has all the protocols compositions and channels the architecture of flutter engine is explained in detail on github in short flutter has everything needed for app development in the flutter engine itself on the other hand react native architecture heavily relies on the JavaScript runtime environment architecture also known as the JavaScript now the JavaScript code is compiled into native code at runtime react native uses the flux architecture from Facebook and there is a detailed article on the core architecture of react native here now in short react native uses JavaScript bridges to communicate with react native modules well the flutter engine has the most of the native confidence in the framework itself and it always doesn't need a bridge to communicate with the need of confidence react native however uses the JavaScript bridge to communicate with native modules which results in poorer performance so from a developer's perspective out here flutter wins again our next point of comparison is features and API so when developing cross-platform mobile application support for the native component is key without the support of native components our application moon feed like a native app and it's very important that the framework has an API to access the needs of modules without any pin so flutter framework is bundled with UI rendering components device API access navigation testing stateful management and loads of libraries the rich set of components remove the need to use third-party libraries if you get the flutter framework it means you will be having everything needed for developing a mobile application flutter also has widgets for material design and Cupertino that allows developers to easily render the UI on both iOS and Android platforms on the other hand the core react native framework provides just the UI rendering and device access API is in order to access most of the native modules the ask native has to rely on third-party libraries react native is too much dependent on third-party libraries and the full list of development components and official ApS can be found on the documentation so from the analysis we reach to the conclusion that flutter is rich in development API and UI components while react native is too much dependent on third-party libraries so as a developer I would give my point to flutter onion now the next point that we are going to be discussing is developer productivity so developer productivity is key to building faster apps and in this regard it's very important to be able to focus on application development without any kind of weight or distraction so on the side of flutter there is a hot reload feature and it's very easy to get started with the demo application however as the complexity of the application grows developers would need to learn a lot and adopt the new flutter concepts in addition dart is not a common language and there is a lack of support for it in many IDE s and text editors on the other hand for react native if the developer is skilled at JavaScript therein it's fairly easy to use those skills for a cross-platform application development react native has a hot reload feature which saves a lot of developer time while testing the changes in the UI in terms of IDE support developers are free to use any text editor or IDE of their choice from the comparison we analyze and see that being a mature framework react native has a great developer support in terms of IDE and language features flutter is fairly new at this point but we'll catch up very soon and the community around flutter is constantly growing now talking about community our next point of comparison is community support so as soon as developers start to show interest in the technology and adopt it in their development process they form a community to share knowledge a strong community helps developers to learn from each other and solve the problems they are facing so flutter has been around for a while but it gained a lot of attention when Google promoted it in Google i/o conference in 2017 the flutter community is growing rapidly these days meetups and confidence are taking place online and the biggest event coming will be the flutter live in December in short the flutter community is growing rapidly and yet there are still not enough resources for developers to solve common issues while on the react native side it was launched in 2015 and hence has gained a lot of popularity ever since there is a community of react native developers on github and it's a lots of meetups and conferences around the world one of the most recent conferences on react native was react native EU held in Poland but there are meetups taking place in all most every major city in the world so the react native community and resources have grown in size since the framework was launched flutter is still fairly new all the community support is rapidly growing so my point again in this round goes to react native now our point of comparison is going to be something more technical and that is testing so writing tests is a great way to get quick feedback on the code that you have written there is always a testing framework associated with every mature technology to allow developers to create unit integration and UI tests for the applications flutter provides a rich set of testing features to test applications at unit budgets and integration levels flutter has great documentation on testing flutter apps and you can read about that in the official documentation also flutter has a cool widget testing feature where we can create widget tests to test the UI and run them at the speed of unit tests on the other hand react native is a JavaScript framework and there are a few unit level testing frameworks available in JavaScript the tools like jest can be used for snapshot testing however when it comes to integration or UI level testing there is no official support from react native there are third-party tools like appium and detox that can be used for testing and you can learn about them in my appium tutorial video so from this we analyzed that the react Native community has no official support for integration and UI level testing while flutter has great documentation and a rich set of features for testing and other such applications so my point as a developer goes to flutter in this round now our second last point of comparison is automation support so releasing mobile applications to the App Store or Play Store as a painful process it involves the complex task of code signing and all other application setup when it comes to cross-platform mobile app development it gets even trickier so it's always nice to have some automation support there now let's talk about react first this time so the react native documentation doesn't have any automated steps to deploy iOS apps to App Store however it provides a manual process for deploying the application from Xcode there is an article on how to deploy react and you can find that in the official documentation however you can do that using third-party tools like fastly in to deploy iOS and Android applications written in react native the process of using fastly into ship react native apps is kind of tricky but it is a thing that you can do for yourself this means that react native has to rely on third-party libraries for build and release automation flutter on the other hand has a strong command-line interface we can create a binary of the app by using the command-line tools and following the instructions in the flutter documentation for building and releasing Android apps and iOS apps on top of this flutter has officially documented the deployment of process with flash lean in their official documentation too so let's analyze now flutter has a great build automation tooling and can be used to deploy apps from the command line we have native apps like support for a command line interface tools that are officially supported for build automation so flutter has got five points at this moment which means a react native has just scored the last point in order to tie the competition the last point of comparison is the CI CD support or as you might know it the continuous integration and continuous development support so DevOps has become quite the big thing today so continuous integration in containers delivery practices are essential for any application in order to get continuous feedback and avoid releasing buggy code so react native doesn't have any official documentation on setting up CI CD however there are some articles which describe the CI CD for react native applications you can find such articles on the web pretty commonly on the other hand flutter has a section on continuous integration and testing which includes a link to external sources however flutters rich command-line interface allows us to set up CI CD very easily and you can read about them on blog post found on the web so flutter apps are easy and painless to set up on continuous integration and continuous development services by using its strong CLI tools react native doesn't provide any official instructions for CI CD practices so my point goes to flutter again in this part so flutter wins six points and react native has four points so in conclusion we can say react native and flutter both have their pros and cons but flutter came out as a winner in this match some of the industry experts have predicted that flutter is the future of the mobile application development considering the comparison we just did it's clear that flutter has entered the cross-platform mobile development race in a very strong manner let's not predict the future but wait and watch I'll meet you guys in the next video until then goodbye. I hope you have enjoyed listening to this video please be kind enough to like it and you can comment any of your doubts and queries and we will reply them at the earliest do look out for more videos in our playlist and subscribe to Edureka channel to learn more, Happy learning

Channel: edureka!

Views: 17,843

Rating: 4.7241378 out of 5

Keywords: yt:cc=on, Flutter vs React Native, Flutter vs React Native 2019, Flutter vs React Native 2018, google flutter vs react native, flutter vs react native performance, Flutter tutorial, React Native tutorial, Flutter or React Native 2019, Flutter react native comparison, flutter vs react native benchmark, which is better flutter vs react native, dart flutter vs react native, flutter framework vs react native, flutter react native performance, flutter sdk vs react native, edureka

Id: 8m9jzfjXxtM

Length: 20min 37sec (1237 seconds)

Published: Mon Jun 17 2019