Flutter vs React Native Which One You Should Learn Edureka

Show video

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 Eddie Records 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. Flattr 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 flat a 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 any rekha channel to learn more happy. Learning.

2019-06-23

Show video