Let's add some code

Let's get our hands dirty with some code. We can try using the template panel to implement a switch statement and a for loop. How do we do this?

1. Let's open the Utilities panel. To do so, use the topmost right icon on the toolbar or simply press Option + cmd + 1.
2. Then select the second tab in the bottom part {} to open the code snippets library.
3. Next, type the following in the filter field—Swift switch.
4. You should see just a single item.
5. Drag that item to the editor:

1. Once you drop it,  you will see the switch structure with a few placeholders to fill in.
2. Try to fill the gaps, so the switch looks something like this:

switch str {
    case "swift":
        print("Hello, Swift 4!")
    default:
        print("Who are you?")
}

1. Then, we can open the console at the bottom to see the output of our program. Use the   button to open the Debug console where all print messages are displayed or press cmd + Shift + Y.
2. You should see: Who are you?

Now, let's try to create a for...in loop, which prints all numbers from one up to five inclusive. Let's use the same procedure as before, but at step 3 we should use Swift for for filtering. Then, at step 7 we should try to reach the following:

for i in 1...5 {
    print("\(i)")
}

It's normal while you are writing code to see some warnings or even errors. Playgrounds are built automatically on every change in the code, thus, the compiler is showing errors when the code is not valid. When you are ready, all errors should be gone and in the output of the program, you will see all numbers from one to five.

To switch to manual mode, press the Play button at the bottom menu and hold for a bit. A menu with two options should pop up—Automatically Run and Manually Run. The first one is selected, but you can switch to manual mode.

If you are in Manually Run, once you change the code of the playground, you will have to Run the playground to reflect the changes. A simple save action is not enough, compared to the Automatically Run mode.

When you start a manual build (or an automatic one was executed), the toolbar at the top changes briefly. The progress indicator appears while the execution takes place.

If there is an output of the playground, it is printed on the console. But this is not the only way to see the evaluation of the code. There is a right panel in the editor, which is really handy when exploring the playgrounds. Unfortunately, it's not expanded by default, but it shows the evaluation of each statement. You can resize it with your mouse to make it visible. Just grab the leftmost edge of the gray panel to the right of the editor—it's easily distinguishable:

Here is the expanded version of the panel, which shows the value of each line. It looks nice, when you have just a single statement on each row:

This is not the case when there are two or more statements separated with ; .

Keep the code clean and simple by adding just a single statement on each line. This will help you to write understandable and easily maintainable code.

Now let's explain the default screen. There are two icons which you see on the line which is hovered. The first one is Quick Look, which shows the evaluation in a pop-up window. The other button is Show results. When it's activated, the results are displayed inline. (To activate this, you can use Editor | Show Result for Current Line):

Different values are presented in a different fashion such as a chart, a list of values, or simply the last value stored in that variable.

Here is an example, which shows how the value stored in the sum variable is growing over time. With the mouse, you can explore the exact value at every single moment:

You can explore the result with the mouse. It's pretty easy to resize the answer area too; just move the mouse close to the edges, until the pointer changes to a double-headed arrow.
If you want to change the way a result is presented, then use the following option, but it should be selected first: Editor | Result Display Mode; then three options will be presented:

• Latest Value: Displays the last value of the statement
• Value History: Displays a list of all values
• Graph: Plots the values

We can see the whole sequence of the invocation in the console (cmd + Shift + Y).

Playgrounds can contain a lot of code. But there is a neat way to add it to a project by using auxiliary files.