What is Cross-platform app development?

Cross-Platform:-Refers to the capability of software or hardware to run identically on different platforms. Many applications for Windows and the Macintosh, for example, now produce binary-compatible files, which means that users can switch from one platform to the other without converting their data to a new format.mobile App development:-Mobile app development is the creation of software intended to run on mobile devices and optimized to take advantage of those products' unique features and hardware.

Cross-platform mobile development:-

Cross-platform mobile development is the creation of software applications that are compatible with multiple mobile operating systems. … Hybrid mobile app development — developers write the core of the application as an HTML5 or JavaScript mobile app and then place a native device wrapper around it.

* cross-platform apps work on multiple operating systems with a single code base.

There are 2 types of cross-platform apps:

1. Native Cross-Platform Apps

2. Hybrid ‘HTML5’ Cross-Platform Apps

Flutter vs react native:-

Flutter engine has most of the native components in the framework itself and it doesn’t always need a bridge to communicate with the native components. React Native, however, uses the JavaScript bridge to communicate with native modules, which results in poor performance.

What is Flutter?

Flutter is an open-source UI software development kit created by Google. It is used to develop applications for Android, iOS, Linux, Mac, Windows, Google Fuchsia and the web from a single codebase. The first version of Flutter was known as codename “Sky” and ran on the Android operating system.

Why flutter is important?

In flutter, the developer needs to write a single code base for all platforms, and this is one of the biggest advantages flutter developers have, Here you have the same business logic and the same UI on all platforms, whether it is Android, iOS, or Web, which enables you to work in the concept of write once, run everywhere.

Why flutter is fast?

Flutter apps are written in a language called Dart, which eliminates JavaScript bridges and is compiled into native machine code. This allows compiling and releasing an application much faster than you would do it with React Native.

What is the advantage of flutter?

Flutter is Google’s mobile app SDK, complete with a framework, widgets, and tools, that gives developers an easy way to build and deploy visually attractive, fast mobile apps on both Android and iOS platforms (official Flutter website). Flutter enables smooth and easy cross-platform mobile app development.

* Fast Development

* Expressive and Flexible UI

* Native Performance

* Fast development

* Expressive, beautiful UIs

* Native Performance

Who’s using Flutter?

Flutter Architecture:-

Flutter platform channels:-

Required tools (for setup):-

1. Android Studio

2. flutter tool

3. dartsdk-windows-x64-release

4. VSCodeUserSetup-x64

5. Git-2.27.0–64-bit

the set path of all of the above for access.

#Android Studio installation process:-

Android Studio is the official Integrated Development Environment (IDE) for Android app development, based on IntelliJ IDEA. … A unified environment where you can develop for all Android devices. Apply code and resource changes to your running app without restarting it. some features of the android studio are following

• Instant App Run

• Visual Layout Editor

• Intelligence Code Editor

• Fast Emulator

• Addition of New Activity as a Code Template

• Help to Connect with Firebase

• Maven Repository

step 1:- install Android Studio :- https://developer.android.com/studio (click here)

integrated IDE experience for Flutter, version 3.0 or later

step 2:- after clicking on give a link on the first step android studio download page appear to click on download android studio and then click on t&c apply and download

Step 3: After downloading Android Studio, open the android studio file and run it

step 4:-click next then it shows

• choose component panel for installing AVD or decline click on next

• then configuration panel appeared(i.e. where to install android studio) then click on next

• then appeared to choose start menu folder click on install

• after installation finished installation complete panel appeared.

• click on next and then click on finish

• the first time we are running so it presents a complete installation box importing setting (previously installed or not ). chose do not import setting(default setting) then click on ok button

• after clicking on ok android studio splash screen started

• after started finding available SDK components panels come

• after its completion, Welcome dialog box appeared

• click on the next button install type panel appeared chose setup type on standard(by default)

• click on next then select UI theme panel appear(chose one IntelliJ(light) and Dracula(dark) )

• click on next than download SDK components

after clicking on the finish button. SDK components downloading started after completing the finish button show click on it then launch it

after finishing launching it.

now we require to set SDK and AVD manager

• click on configure ->select SDK manager ->Android SDK->SDK tools

SDK platform setting

SDK tools require clicking on the Showing mark and download

to create an AVD manager

click on configure -> AVD manager -> create virtual device-> select device

click on create a virtual device.

select device then next next

then showing the virtual device

alternative for AVD

USB debugging is a mode that lets Android devices communicate with computers to make Android app development easier for developers. It allows certain access to specialized areas of the phone that most people don’t need to interact with regularly.

• Open the Settings app.

• Select System.

• Scroll to the bottom and select About phone.

• Scroll to the bottom and tap the Build number 7 times.

• Return to the previous screen to find Developer options near the bottom.

• Scroll down and enable USB debugging.

Flutter installation process:-

step 1:- install flutter https://flutter.dev/docs/get-started/install

step 2:- after installing in a zip file double click on it and extract it to which u want that folder. After, it opens the extract place folder open flutter click on the bin copy path and set this path in the environment variable

I extracted it from the flutter_class folder. After extracting the open folder in which you extracted it, open it, show the flutter folder, click on flutter, and click on bin until the bin is copied, then set the path.

open bin file

C:\Users\hp\Desktop\flutter_class\flutter\bin

my path above, Copy your path and set it into the environment variable.

• check whether you set it correctly or not

open your command prompt and run the flutter version command output show like as

if the above output showing then u set right. if showing some error like that

if the above output is showing then you try

C:\Windows\System32;C:\Users\hp\Desktop\flutter_class\flutter\bin

Set your path like the above. it will work.

dart-SDK installation process:-

download dart-SDK, after download open file then double click extract then select which place you want to extract and lastly copy the path to the bin and save it in the environment variable

now open the folder when you extract and copy the path till the bin

VS code user setup installation process:-

steps:- click on VS code file

set I accept and

click on next

create desktop icon also select and then click next

click install

click on finish

click on the extension to download the extension for flutter and dart

setup check in cmd:-

open cmd(command prompt) -> then run flutter doctor

flutter doctor

no issue find i.e. our setup is ready.

What is Dart?

Dart is a client-optimized programming language for apps on multiple platforms. It is developed by Google and is used to build mobile, desktop, server, and web applications. Dart is an object-oriented, class-based, garbage-collected language with C-style syntax. Dart can compile to either native code or JavaScript.

for more :- https://dart.dev/guides (click here )

the first program on VS code:-

how to run the program on vs code, our dart file

dart flie_name.dart

use the above command on the terminal (ex. dart basic. dart)

first flutter app example:-

how to create an app:-

above image, in which first we use the command cd Desktop, then we create a folder (mkdir folder_name) on the desktop by using the command cd flutter_class; in flutter_class, we create a folder called "projects" (mkdir projects), and all the apps we create save in the projects folder.

for creating a flutter app use the following command:-

flutter create app_name

ex:- flutter create firstapp

for run :- change dir. into the app file by using cd app_name and then using flutter to run

cd app_nameflutter run

thank you !!!!!!!!!!!!!!!!