Why clean architecture maintains codebases in iOS Swift - Build It to Prove It

Build: Clean Architecture Info

This screen explains why clean architecture helps keep codebases easy to maintain and grow.

Target UI

-----------------------------
| Clean Architecture Info   |
|---------------------------|
| Why use clean architecture?|
|                           |
| - Separates code clearly   |
| - Makes testing easier     |
| - Helps add features fast |
| - Keeps bugs low          |
|                           |
| [Close]                   |
-----------------------------

Show a title at the top

Display a bullet list explaining benefits of clean architecture

Add a Close button at the bottom that dismisses the screen

Starter Code

iOS Swift

import SwiftUI

struct CleanArchitectureInfoView: View {
    var body: some View {
        VStack {
            // TODO: Add title text here
            // TODO: Add bullet list here
            Spacer()
            // TODO: Add Close button here
        }
        .padding()
    }
}

struct CleanArchitectureInfoView_Previews: PreviewProvider {
    static var previews: some View {
        CleanArchitectureInfoView()
    }
}

Task 1

Task 2

Task 3

Task 4

Task 5

Task 6

Task 7

Solution

iOS Swift

import SwiftUI

struct CleanArchitectureInfoView: View {
    var body: some View {
        VStack(alignment: .leading, spacing: 16) {
            Text("Why use clean architecture?")
                .font(.title2)
                .bold()

            VStack(alignment: .leading, spacing: 8) {
                Text("- Separates code clearly")
                Text("- Makes testing easier")
                Text("- Helps add features fast")
                Text("- Keeps bugs low")
            }

            Spacer()

            Button(action: {
                print("Close tapped")
            }) {
                Text("Close")
                    .frame(maxWidth: .infinity)
                    .padding()
                    .background(Color.blue)
                    .foregroundColor(.white)
                    .cornerRadius(8)
            }
        }
        .padding()
    }
}

struct CleanArchitectureInfoView_Previews: PreviewProvider {
    static var previews: some View {
        CleanArchitectureInfoView()
    }
}

This screen uses a vertical stack to arrange the title, bullet points, and a Close button.

The title uses a bold, larger font to stand out.

The bullet points are simple Text views with a dash to simulate bullets, spaced nicely.

The Close button is styled with a blue background and white text, filling the width for easy tapping.

When tapped, it prints a message to the console to simulate closing the screen.

This simple layout clearly communicates why clean architecture helps maintain codebases by separating concerns, easing testing, speeding feature addition, and reducing bugs.

Final Result

Completed Screen

-----------------------------
| Clean Architecture Info   |
|---------------------------|
| Why use clean architecture?|
|                           |
| - Separates code clearly   |
| - Makes testing easier     |
| - Helps add features fast |
| - Keeps bugs low          |
|                           |
| [       Close Button      ]|
-----------------------------

User taps the Close button

Console prints 'Close tapped' to simulate closing the screen

Stretch Goal

Add a dark mode color scheme that changes background and text colors

💡 Hint

Use ColorScheme environment and conditional colors for background and text