Getting Started with Cross-Platform Mobile Development with Flutter and Dart
1 like86 views
This is the presentation to go along with the talk for the 2019 South Dakota Code Camp by Harshith Keni https://2019.southdakotacodecamp.com/schedule/sessions/mobile-development-with-flutter-and-dart/
![[Alexandria Devfest] the magic of flutter](https://cdn.slidesharecdn.com/ss_thumbnails/egyptdevfestthemagicofflutter-181114115455-thumbnail.jpg?width=560&fit=bounds)
Ad
More Related Content
What's hot (20)
Similar to Getting Started with Cross-Platform Mobile Development with Flutter and Dart (20)
Ad
Recently uploaded (20)
Ad
Getting Started with Cross-Platform Mobile Development with Flutter and Dart
- 1. Getting Started with Cross-Platform Mobile Development with Flutter and Dart Harshith Keni
- 2. About Me
- 3. SEARCH MILLIONS. FIND ONE. Sponsors
- 4. SEARCH MILLIONS. FIND ONE. • Object Oriented • Statically Typed • C-Style Syntax • Multiple Runtime Environments • Transpiled into JS to run in the browser • Runs in the ‘Dart VM’ when executed from a command line • Compiled to machine code to run on mobile devices • Strong Standard Library What is Dart void main() { print('Hello World!'); }
- 5. SEARCH MILLIONS. FIND ONE. • Cross-platform UI SDK • Native apps for mobile, web and desktop • Native Performance • Compiled to native machine code • 120 FPS animations • Powerful UI widgets • Material Design (Android Style) • Cupertino Widgets (iOS Style) What is Flutter import 'package:flutter/material.dart’; void main() => runApp(HelloWorldApp()); class HelloWorldApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Hello World App’, home: Scaffold( appBar: AppBar( title: Text('Hello World App’), ), body: Center( child: Text('Hello World’), ), ), ); } }
- 6. SEARCH MILLIONS. FIND ONE. MacOS • Download and setup SDK • Install XCode and setup the iOS Simulator • Install Android Studio and SDKs • Setup an editor: • VSCode with Flutter and Dart Plugins • Android Studio/IntelliJ with Flutter and Dart Plugins Setup Setup Instructions at: flutter.dev Windows/Linux • Download and setup SDK • Install Android Studio and SDKs • Setup an editor: • VSCode with Flutter and Dart Plugins • Android Studio/IntelliJ with Flutter and Dart Plugins
- 7. SEARCH MILLIONS. FIND ONE. • Build and compose widgets that control UI elements on the screen • Flutter has a lot of default widgets – Text, Column, Container, Appbar, and many more • https://flutter.dev/docs/development/ui/widgets • Widgets are similar to Components in React • Stateless Widgets ~ Function Components • Stateful Widgets ~ Class Components Flutter Fundamentals
- 8. SEARCH MILLIONS. FIND ONE. Flutter • Created by Google • Smaller enthusiastic community support • Great Documentation • Easiest to get started • Open source Background and Community React Native • Created by Facebook • Huge community support • Documentation average at best • Fairly easy to get started • Open source Native • Platform specific • Huge but scattered community support • Proprietary
- 9. SEARCH MILLIONS. FIND ONE. • Flutter web and desktop support in active development • Flutter apps open you up to Fuschia OS • Fuschia could be Android’s replacement in the future • Flutter apps are Fuschia-ready • Major support from Google behind it • Dart 2.6 just released with support for compiled self-contained native executables Future
- 10. SEARCH MILLIONS. FIND ONE. • Dart: https://dart.dev/ • Flutter: https://flutter.dev/ • DartPad: https://dartpad.dartlang.org/ Resources
- 11. Thank you PS: Carsforsale.com is hiring