Part 6 | Flutter Basics & Project Structure | Flutter Malayalam Tutorial Series

Introduction

In this tutorial, we'll explore the fundamentals of Flutter and its project structure. This guide aims to provide you with a clear understanding of how to set up your Flutter environment and the essential components of a Flutter project. Whether you're a beginner or looking to refresh your knowledge, this tutorial will set you on the path to developing Android and iOS applications.

Step 1: Install Flutter and Set Up Your Development Environment

Before diving into Flutter, you need to install it and set up your development environment.

1. Download Flutter SDK

   • Visit the Flutter website.
   • Choose your operating system (Windows, Mac, or Linux).
   • Follow the instructions to download and extract the Flutter SDK.

2. Set Up Environment Variables

   • Add the Flutter bin directory to your system's PATH.
   • For Windows, you can do this through System Properties > Environment Variables.
   • For Mac and Linux, you can update your ~/.bash_profile or ~/.bashrc file.

3. Install Android Studio

   • Download and install Android Studio from the official site.
   • During installation, ensure you include the Android SDK and Android Virtual Device.

4. Verify Installation

   • Open a terminal or command prompt.
   • Run the command:

     flutter doctor
     

   • This command checks your Flutter installation and provides instructions for any missing dependencies.

Step 2: Create a New Flutter Project

Now that your environment is set up, let’s create your first Flutter project.

1. Open Android Studio

   • Launch Android Studio and select “Start a new Flutter project.”

2. Select Project Type

   • Choose “Flutter Application” and click “Next.”

3. Configure Project

   • Enter your project name, Flutter SDK path, and project location.
   • Choose a description and set the package name (e.g., com.example.myapp).

4. Finish Project Setup

   • Click “Finish” to create your project.
   • Android Studio will generate the project files for you.

Step 3: Understand the Flutter Project Structure

Once your project is created, familiarize yourself with its structure.

1. Key Directories and Files

   • lib/: Contains your Dart code. The main entry file is main.dart.
   • android/: Contains Android-specific configurations and files.
   • ios/: Contains iOS-specific configurations and files.
   • pubspec.yaml: This file manages the project's dependencies and assets.

2. Main Dart File

   • In lib/main.dart, you can start writing your Flutter application code.
   • The basic structure includes the main() function and a StatelessWidget or StatefulWidget.

3. Understanding Widgets

   • Flutter is built around widgets. Everything you see on the screen is a widget.
   • Learn to use common widgets such as Container, Row, Column, and Text.

Step 4: Running Your Flutter Application

With your project set up, it's time to run your application.

1. Select a Device

   • Connect a physical device or start an Android Emulator.
   • Ensure that your device is recognized by running:

     flutter devices
     

2. Run the Application

   • In Android Studio, click the green play button or use the command:

     flutter run
     

   • Your Flutter application should launch on the selected device.

Conclusion

You've now learned how to set up Flutter, create a new project, and understand its structure. With this foundation, you can start building your own mobile applications. For next steps, consider exploring Flutter's rich widget library, experimenting with layouts, and diving into more complex state management solutions. Happy coding!