Welcome to Day 1 of the "Hundred Days of Flutter" course! Today, we'll set up your development environment and introduce you to the basics of Dart, the programming language used for Flutter development.
"Hundred Days of Flutter" is designed to take you from a beginner to a competent Flutter developer in 100 days, spending just 2 hours per day. By the end of this course, you'll be able to:
The course is structured into five phases:
Each day builds upon the previous, so it's important to follow the course in order.
Let's start by setting up everything you need to build Flutter apps.
You can use either Visual Studio Code or Android Studio. Both are excellent choices for Flutter development.
Testing your apps requires either a physical device or an emulator/simulator.
Let's make sure everything is set up correctly:
flutter doctor
The output should look something like this:
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.10.6, on macOS 13.5.1)
[✓] Android toolchain - develop for Android devices
[✓] Xcode - develop for iOS and macOS
[✓] Chrome - develop for the web
[✓] Android Studio (version 2022.2)
[✓] VS Code (version 1.81.1)
[✓] Connected device (2 available)
[✓] Network resources
Flutter uses Dart as its programming language. Let's explore the basics of Dart.
Dart is a client-optimized language developed by Google for building apps on multiple platforms. It's the language behind Flutter and is designed to be fast, object-oriented, and easy to learn.
Let's write our first Dart code:
void main() {
// This is a comment
print('Hello, Dart!');
// Variables
String name = 'Flutter Developer';
int daysInCourse = 100;
double hoursPerDay = 2.0;
bool isExcited = true;
// String interpolation
print('Welcome, $name!');
print('You will spend ${daysInCourse * hoursPerDay} hours in this course.');
// var - type inferred by the compiler
var age = 25; // int
var price = 19.99; // double
// final - value cannot be changed after initialization
final String courseName = 'Hundred Days of Flutter';
// const - compile-time constant
const int weeksInCourse = 14;
}
Dart is a statically typed language, which means variable types are known at compile time. Here are the basic types:
int
: Integer valuesdouble
: Floating-point numbersbool
: Boolean values (true/false)String
: Text valuesList
: Ordered group of itemsMap
: Key-value pairsSet
: Unordered collection of unique itemsNow, let's create our first Flutter application:
flutter create my_first_app
cd my_first_app
Open the project in your IDE
Run the app:
flutter run
You should see the default counter app that Flutter creates. Congratulations! You've just run your first Flutter app.
Let's take a quick look at the structure of the default Flutter app:
lib/main.dart
: The main entry point for your apppubspec.yaml
: Manages dependencies and assetsandroid/
and ios/
: Platform-specific codetest/
: Contains test filesOpen lib/main.dart
to see the code for the default counter app. Don't worry if you don't understand everything yet—we'll explore this in detail over the coming days.
Let's test your understanding of today's concepts:
Which language is used to develop Flutter applications?
Which keyword is used to declare a variable that can't be changed after initialization?
What is the primary command to check if your Flutter installation is correct?
Modify the default counter app to display your name instead of "Flutter Demo Home Page".
Here's how:
lib/main.dart
title: 'Flutter Demo'
title: 'Your Name's App'
MyHomePage
class and modify its title parameterlib/main.dart
Tomorrow, we'll dive deeper into Dart's control flow structures, functions, and more advanced language features.
Learn essential Dart programming concepts including control flow, functions, and type safety to build a solid foundation for Flutter development.
Start Next Day