/Setup

Dart Quickstart for New Programmers

We’re excited that you have decided to start your programming journey with Dart. You can easily code in Dart on the web without installing anything, using the DartPad. You can simply write your code on the left panel and the result appears on the right.

You can also install Dart on your local machine using our installation guide. If you’re new our suggestion is to use the DartPad to start. Installing all the tools takes time and can always be done later.

Starting out with programming is daunting as it is learning a whole new language, but remember that you don’t need to learn everything at once.

Go at your own pace.

If you are an experienced developer you’re probably going to blaze through this tutorial, but if you’re not it might take of while for stuff to click. It might even take a while if you’re an experienced developer and come from a totally different language that has minimal similarities with Dart.

That’s totally fine. Don’t get discouraged, it is perfectly normal. Practise, take copious notes and most of all have fun.

Questions?

First try googling your problem. Most developers use Google to solve their problems every day, yes even experienced ones. If anyone tells you that they never Google anything they’re 99% lying. In the beginning you will have one tab with the editor, one tab with Google and one tab with Stack Overflow. That’s totally normal too.

If you’re really stuck you can drop us a line. We can’t assure we’ll be able to answer, but if we’re not completely full we’ll try.

Never stop believing you can do it, because you can.

Introduction

Open up the DartPad (or your favorite code editor) and take a look around. On the left you have the dart code that you can edit. It is precompiled with a function that sums the values in an array using a loop. You don’t need to understand the code yet. Press run and watch as it executes and prints the result on the console to the right.

Now delete everything from the left panel and change it to:

void main() {

}

main is the function that gets called when the application starts. Write all of your code from this tutorial in between the two curly brackets.

Variables and Functions

The building blocks of every programming languages and variables and functions. Variables declare something while functions encompass some work to accomplish a task.

Remember to always put a ”;” after each operation (at the end of the line).

Everything following a ”//” is a comment. It won’t be executed, but it is useful to use to provide context or explanation alongside the code.

var a = 1;//1

Start by defining a variable. Here we are defining “a” and we are assigning to “a” the value of 1. From this moment on we can say “a” to refer to 1 without having to write 1 directly.

Add a new line below and type:

print(a)//prints: 1

Here we are taking the value from “a” and printing it to the console. Press run and watch as the console outputs 1.

Now onto functions:

add(a,b){
  //TODO
}

We’re defining a function called “add”. Inside the round brackets we can add the input that we are passing to the function. Inside the curly brackets we execute the task and before the last curly bracket we output what we want to expose to whoever called the function.

Not all functions return a value, some functions just do a task without taking in input or emitting any output.

Edit the funtion to add the 2 numbers together:

add(a,b){
  return a+b;
}

Whenever I need to add “a+b” I can just call “add” instead. The function “add” takes the 2 numbers (“a” and “b”) as input add(a,b) where “a” is the first number and “b” is the second, sums them using + and returns them to whoever called the function.

We can now call the function and print the result to the console:

var sum = add(1,2);
print(sum);//prints: 3

Here sum holds the value returned from calling the function add. Run as the console prints 3.

For example “print” is a function as well. Print takes whatever it needs to print as an input and prints it to the console. It has no output though, it just performs a task.

Types

Another defining element in a language is its support for types and the fact if does have a type-system or not: Types define of what kind a variable is or can be. If the language has a type system (as it is the case for Dart) you are not allowed to initially define something as one type and later on try to make it equal to something else.

A more concrete example: The type int refers to a number without decimals. If I define the variable “a” to be of type int what I’m saying is that “a” can only contain values that are numbers without decimals, no exceptions. If I try to assign a to something else Dart won’t let me do it (it doesn’t even let me run the application).

int a = 1;
a = "String";//ERROR
a = 2;//SUCCESS
print(a);//prints: 2

If you run it Dart will complain and show you the exact line where the error occurred:

Error: A value of type 'dart.core::String' can't be assigned to a variable of type 'dart.core::int'.
a = "String";//ERROR

Now delete the line the compiler was complaining about and press run again. it will now correctly print out 2.

You might have noticed that in DartPad whenever you click on an element on the bottom right it will show more information about what is selected. You can use it to get information about functions included in dart.

Dart includes most of the types you would ever need to create an application. Some of the types included in Dart are:

  1. Number

A number is any number with and without decimals.

  1. String

A String is an ordered group of characters. To declare a String surround the characters with quotes ' or double quotes ".

  1. Boolean

A Boolean is a flag. It can be either true or false.

  1. List

A List is an ordered collection of another type. For example it can be a collection of Strings. It starts from the first String and continues until the last with the ability of accessing all the elements in-between.

For a more complete list of types you can read Dart Fundamentals.

Problem Solving

Now onto something a bit more complex. Let’s say for example we have an array of numbers (an ordered list) and we want to get the sum of every element in the list.

Try to write all the steps you would need to perform to do it in normal language. Here’s the list:

  1. Create a counter to keep track of the sum of the items and initially set it as zero
  2. Initialize a list with the numbers we want to sum
  3. Get the first element in the list
  4. Add the element to the counter
  5. Get the next element
  6. Repeat 3 and 4 until the list ends
  7. Print the counter

Try implementing it now in code. The building blocks we’re going to need are:

  1. Variables
  2. Arrays
  3. For loops

We’ve already explored the first 2.

Loops use the keyword for. Here’s an example of a for loop that counts from 0 to 10:

void main() {
  for (int i = 0; i < 10; i++) {
	  	print(i);
    }
}

A loop is composed by the keyword for followed by where you want to start int i = 0(at zero), where you want to stop i < 10 (as loong as i is leess than 10 continue) and what to do at each iteration i++; (increase i y 1).

Go back to DartPad (or your code editor) and inside main paste:

void main() {
  const a = [0,1,2];//define array
  var sum = 0;//define sum
  //loop through array
    //increment sum
  //end loop
  print(sum);//print sum
}

And try to fill in the gaps. Once finished, in the console on the right you should see the sum (3).

Hint: Instead of looping up to 9 (not 10 since the condition was that the number needs to be less than 10) as in the example above, you should loop up to the length of the array.

Solution:

void main() {
  const a = [0,1,2];
  var sum = 0;
  for (int i = 0; i < a.length; i++) {
		var value = a[i];
    sum += value;
  }
  print(sum);
}

//Prints: 3

Where to go from here

If you would like to learn more about Dart you can check out the Dart Fundamentals, if you’d like to do something more practic you can work on your first Flutter application.

Subscribe to Learning Flutter

Get the latest posts delivered right to your inbox

Valentino Urbano

Valentino Urbano

Valentino Urbano is an iOS and Web Developer from Milan, Italy. Working on his own he pursues his passions as a programmer.

Read More