Google’s UI toolkit Flutter is getting increasingly popular for creating cross-platform applications for the mobile, web and desktop.
Flutter is not a programming language but a software development kit. Dart is the programming language used underneath the Flutter SDK.
Flutter is the main framework behind Google’s open source Fuchsia OS, Google STADIA and many other software and mobile apps.
If you want to start developing with Flutter, this tutorial will help you to get your set-up ready on Ubuntu and hopefully other Linux distributions.
Installing Flutter on Ubuntu and other Linux with Snap
The easiest way to install Flutter on Linux is by using Snap. If you are using Ubuntu, you already have got Snap. For other distributions, please make sure to enable Snap support.
Open a terminal and use the following command in a terminal to install Flutter:
sudo snap install flutter --classic
You’ll see something like this on your terminal:
![installing Flutter on ubuntu](https://itsfoss.com/content/images/wordpress/2021/09/installing-flutter-ubuntu.png)
Once the installation completes, it is time to verify it. Not just Flutter installation but also verify every dependency that needs to be satisfied for Flutter to function properly.
Verify Flutter dependencies
To verify that every dependency, for the correct work of Flutter, is installed, Flutter has a built-in option:
flutter doctor
The process will start, looking like this:
![Verify Flutter Install](https://itsfoss.com/content/images/wordpress/2021/09/verify-flutter-install.png)
And it will be finishing like this:
![Flutter verification completes](https://itsfoss.com/content/images/wordpress/2021/09/Flutter-verification-completes.png)
As you can see, we need Android Studio for working. So let’s install it. How do we do that? Installing Android Studio on Linux is also effortless with Snap.
Install and set up Android Studio
In a terminal, use the following command to get Android Studio installed:
sudo snap install android-studio --classic
![Install Android Studio in Linux with Snap](https://itsfoss.com/content/images/wordpress/2021/09/install-android-studio-linux-snap.png)
Once installed, open Android Studio from our operating system menu.
![open android studio](https://itsfoss.com/content/images/wordpress/2021/09/Open_Android_Studio.webp)
You are almost done. It’s time for configuring Android Studio.
![Setting up Android Studio](https://itsfoss.com/content/images/wordpress/2021/09/Setting-Up-Android-Studio-1-800x603.png)
Click next and select standard if you don’t want to complicate things.
![Setting up Android Studio](https://itsfoss.com/content/images/wordpress/2021/09/Setting-Up-Android-Studio-2-800x603.png)
Select your preferred theme (I like the Dark one).
![Setting up Android Studio](https://itsfoss.com/content/images/wordpress/2021/09/Setting-Up-Android-Studio-3-800x603.png)
Verify that everything is OK and click on Next.
![Setting up Android Studio](https://itsfoss.com/content/images/wordpress/2021/09/Setting-Up-Android-Studio-4-800x603.png)
Finally, hit the Finish button.
![Setting up Android Studio](https://itsfoss.com/content/images/wordpress/2021/09/Setting-Up-Android-Studio-5-800x603.png)
And wait until the download is finished.
![Setting up Android Studio](https://itsfoss.com/content/images/wordpress/2021/09/Setting-Up-Android-Studio-6-800x603.png)
Creating a sample Hello World Flutter app
In Android Studio, go to Projects and select New Flutter Project. Flutter SDK path will be set by default.
![new flutter project](https://itsfoss.com/content/images/wordpress/2021/09/New_flutter_project-800x639.png)
And here is where the magic starts to appear because this is where you set your project name, which in this case it will be called hello_world.
Let’s select the three available platforms: Android, iOS, and Web. And finally, click on Finish.
![Sample Flutter project](https://itsfoss.com/content/images/wordpress/2021/09/sample-flutter-project-800x751.png)
The principal file in the projects is located in lib/main.dart
, as is shown in the next image.
![Sample Flutter projects](https://itsfoss.com/content/images/wordpress/2021/09/sample-flutter-project-1-800x435.png)
Once selected, erase everything contained inside the file and change it for this sample code:
// Copyright 2018 The Flutter team. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Welcome to Flutter',
home: Scaffold(
appBar: AppBar(
title: const Text('Welcome to Flutter'),
),
body: const Center(
child: Text('Hello World'),
),
),
);
}
}
It’s important to say that this is only for showing you how Flutter works, in case you’re convinced about learning this beautiful and incredible language, here is the Documentation to see more about it. Try it!
Finally, select Chome Web device and do click on the Run button, as is shown below; and see the magic!
![Sample Flutter project in Ubuntu](https://itsfoss.com/content/images/wordpress/2021/09/sample-flutter-project-2-800x450.png)
It’s incredible how fast you can create a Flutter project. Say hello to your Hello World project.
![Running a sample Flutter project](https://itsfoss.com/content/images/wordpress/2021/09/sample-flutter-project-3-800x549.png)
In the end…
Flutter and Dart are perfect if you want to contribute with beautiful mobile and Web interfaces in a short time.
Now you know how to install Flutter on Ubuntu Linux and how to create your first app with it. I really enjoyed writing this post for you, hoping this helps you and if you have any questions, please let me know by leaving a comment or sending me an email to [email protected]. Good luck!
Tutorial contributed by Marco Antonio Carmona Galván, a student of physics and data science.