# Introduction to SwiftUI

### What is SwiftUI?

SwiftUI is a declarative framework that allows us to create the user interface in our apps. It was introduced back in 2019 as a replacement for UIKit. The best way to understand declarative UI is to compare it to imperative UI.

### Imperative vs Declarative

If you are familiar with languages such as Java or C++, these are imperative languages. Imperative programming defines ***how*** tasks should be accomplished. For example, say we plan on cooking steak for dinner. The imperative approach would be:

1. Walk to the meat section in the grocery store.
2. Search for any piece of fine steak starting from the top shelf to the bottom.
3. Once found, check the price and weight.
4. Place it in our shopping cart if we are satisfied.

As we can see, these steps tell us ***how*** we should shop for a piece of steak once we enter the grocery store. Now, compare this to the declarative approach:

1. Search for any satisfactory piece of steak in the grocery store.

There is one single step and that step tells us **what** to do. In other words, declarative programming defines **what** tasks should be accomplished compared to \*\****how**.* When we think about computation, the imperative paradigm defines the control flow and state changes whereas the declarative paradigm defines only the logic.

### The Issue with Imperative UI

If you are familiar with creating an app using the UIKit framework, you can see why UIKit is an imperative approach to creating UI. If we have a `UILabel`, then to change the ***state*** of that label, we could modify the properties of that object (such as `.text`). ***State*** is just another way of saying “the values that we store in our code.” The problem with imperative UI is that we need to constantly keep track of the state of our code and ensure that our UI correctly reflects that state.

For example, we could have a `UIButton` that, when tapped, triggers a change in the state of a `UILabel`. If we were to introduce another `UIButton` or an additional `UILabel`, we would need to write code to ensure that all of these UI components properly reflect the current state. As we add more components to our app, we can see that things can get pretty complicated.

### Declarative UI to the Rescue

With SwiftUI and its declarative approach, we can create a `Text` view that is associated with some ***state*** variable. When the value of this variable changes (in other words, there is a state change), all views that rely on that state is updated accordingly. Everything stays in sync and is handled automatically. We no longer have to update our views manually when data changes.

That is the beauty of SwiftUI. We told it ***what*** to show based on the current state and SwiftUI moves between user interface layouts for us. That is the declarative approach. We define rules that our views should follow and SwiftUI enforces those rules.

### The Future of SwiftUI

SwiftUI is relatively new and is only available for iOS 13 and above. It is also a growing framework and there are still a lot of improvements that need to be made. If you are new to iOS development and are deciding to choose between SwiftUI and UIKit, then I recommend learning SwiftUI. However, although SwiftUI is the future, many apps are currently built in UIKit. UIKit will still be needed for a few more years, so it is important to know both.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ios-course.cornellappdev.com/resources/textbook/swiftui/introduction-to-swiftui.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
