Mastering Flutter Project Creation: A Guide to Visual Studio Code and Command-Line Tools

Mastering Flutter Project Creation: A Guide to Visual Studio Code and Command-Line Tools

Introduction:

In this article, we will explore various methods for creating Flutter projects.

You can use either Visual Studio Code or Flutter command line tools. Visual Studio Code provides a user-friendly interface for project creation, while command line tools offer comprehensive control over the process.

Creating Flutter Project With Visual Studio Code:

  • Launch Visual Studio Code

  • Hit keyboard shortcut, Command+Shift+P (Ctrl+Shift+P on Windows) to open up Command Palette as shown below.

  • Select “Flutter: New Project” option from the list as shown below. If the option is not visible type Flutter and it will filter out the options available in the list.

  • After that, a list of project templates will appear, allowing us to create our Flutter project, as shown below.

  • Select “Application“ as a project template and hit enter.

  • Now, Visual Studio Code will prompt you to choose an empty folder on your computer to create the project. Select an empty folder of your choice.

  • Once the empty folder location is selected, Visual Studio Code will prompt to enter the project name as shown below.

  • While entering the project name, make sure all the characters are in small case and words are separated by underscore character. Once you enter the project name, hit enter key to create the project. Flutter will now create your project and Visual Studio Code will open up the project once created as shown below.

  • Now we can hit F5 to launch our Flutter application.

Creating Flutter Project With Command-Line Tools:

  • Open the terminal (or Command Prompt on Windows) at the folder location where you want to create your Flutter project.

  • Execute below command in terminal to create your Flutter project where first_flutter_app is our project name.

  •     flutter create first_flutter_app
    
  • According to the command output, we can see that our Flutter project is successfully created. It also includes helpful information such as a link to the Flutter documentation, instructions on how to run our application, and where to find our application code.

  • We can now open this project in Visual Studio Code and start modifying the code.

  • To get more information about the flutter create command, execute below command in your terminal.

  •     flutter create --help
    

  • According to the output, we can see that there are multiple options available with which we can modify the project creation process like:

    • Change the language used for android specific code.

    • Change the language used for iOS specific code.

    • Specify description for the project which will be added in pubspec.yaml

    • Specify the org which can be used as bundle identifier.

    • Platforms supported by Flutter project. When we create a Flutter project, then by default it supports all platforms like android, iOS, linux, web and windows.

    • We can also specify the type of project to create using project template.

Create Flutter Project Only For Android And iOS Platforms:

  • Open the terminal (or Command Prompt on Windows) at the folder location where you want to create your Flutter project.

  • Run the following command in the terminal to create a Flutter project for Android and iOS platforms only.

  •     flutter create --platforms android,ios --template app --description 'Android iOS Application' --org 'com.myflutterapp' android_ios_app
    
  • Let’s understand the above command.

    • —-platforms :Using this option, we can specify which platforms we want to support. In the command above, we are indicating that we want this project to support only Android and iOS platforms. Note: This option only works with the project template types app or plugin.

    • —-template: This option specifies which project template we want to use to create our project. In the command above, we are using app as our project template.

    • --description: This option specifies the project description which will be added in our pubspec.yaml file.

    • --org: This option specifies the bundle id for our android and iOS application.

    • Last option specifies our project name.

I have also created a YouTube video regarding this topic, so if you would like to watch a video tutorial, then please go to https://youtu.be/gEd2dfEviM8

Conclusion:

In conclusion, whether you prefer a visual and user-friendly environment or a more script-based, automated approach, Flutter offers flexible options for project creation. Visual Studio Code provides an intuitive interface for those who enjoy a graphical setup, while the command-line tools offer extensive control and customization for developers who prefer working with scripts. Both methods are effective, and the choice depends on your personal workflow and project requirements. I hope you enjoyed reading the article.

Happy coding!