Custom decoder configuration in iOS Swift - Mini App: Build & Ship

Build: User Profile Decoder

This screen fetches and decodes a JSON user profile using a custom JSONDecoder configuration to handle date formats and key decoding strategy.

Target UI

-------------------------
| User Profile          |
|-----------------------|
| Name:                 |
| Email:                |
| Birthdate:            |
|                       |
| [Load Profile] Button |
-------------------------

Create a User struct conforming to Decodable with name, email, and birthdate properties.

Configure JSONDecoder to use ISO8601 date decoding strategy.

Configure JSONDecoder to convert snake_case keys to camelCase properties.

Add a button labeled 'Load Profile' that triggers JSON decoding from a hardcoded JSON string.

Display decoded user data on the screen after decoding.

Starter Code

iOS Swift

import SwiftUI

struct User: Decodable {
    let name: String
    let email: String
    let birthdate: Date
}

struct ContentView: View {
    @State private var user: User? = nil

    var body: some View {
        VStack(spacing: 20) {
            Text("User Profile")
                .font(.title)
                .bold()

            Text("Name: \(user?.name ?? "")")
            Text("Email: \(user?.email ?? "")")
            Text("Birthdate: \(user != nil ? DateFormatter.localizedString(from: user!.birthdate, dateStyle: .medium, timeStyle: .none) : "")")

            Button("Load Profile") {
                // TODO: Add JSON decoding logic here
            }
            .padding()
            .background(Color.blue)
            .foregroundColor(.white)
            .cornerRadius(8)
        }
        .padding()
    }
}

Task 1

Task 2

Task 3

Task 4

Task 5

Solution

iOS Swift

import SwiftUI

struct User: Decodable {
    let name: String
    let email: String
    let birthdate: Date
}

struct ContentView: View {
    @State private var user: User? = nil

    var body: some View {
        VStack(spacing: 20) {
            Text("User Profile")
                .font(.title)
                .bold()

            Text("Name: \(user?.name ?? "")")
            Text("Email: \(user?.email ?? "")")
            Text("Birthdate: \(user != nil ? DateFormatter.localizedString(from: user!.birthdate, dateStyle: .medium, timeStyle: .none) : "")")

            Button("Load Profile") {
                let json = """
                {
                    \"name\": \"Alice Johnson\",
                    \"email\": \"[e-mail]\",
                    \"birthdate\": \"1990-05-15T00:00:00Z\"
                }
                """
                guard let jsonData = json.data(using: .utf8) else { return }

                let decoder = JSONDecoder()
                decoder.dateDecodingStrategy = .iso8601
                decoder.keyDecodingStrategy = .convertFromSnakeCase

                do {
                    let decodedUser = try decoder.decode(User.self, from: jsonData)
                    user = decodedUser
                } catch {
                    print("Decoding error: \(error)")
                }
            }
            .padding()
            .background(Color.blue)
            .foregroundColor(.white)
            .cornerRadius(8)
        }
        .padding()
    }
}

This solution creates a User struct that matches the JSON keys but uses camelCase property names. The JSONDecoder is configured with dateDecodingStrategy = .iso8601 to parse the birthdate string into a Date object. The keyDecodingStrategy = .convertFromSnakeCase automatically converts JSON keys like birthdate or snake_case keys to camelCase properties in Swift.

When the user taps the "Load Profile" button, the app decodes the hardcoded JSON string and updates the UI with the user's name, email, and formatted birthdate. This demonstrates how to customize decoding behavior to handle common JSON formats easily.

Final Result

Completed Screen

-------------------------
| User Profile          |
|-----------------------|
| Name: Alice Johnson   |
| Email: [e-mail] |
| Birthdate: May 15, 1990|
|                       |
| [Load Profile] Button |
-------------------------

User taps 'Load Profile' button.

App decodes JSON with custom decoder settings.

User info appears below the title with formatted birthdate.

Stretch Goal

Add error message display below the button if JSON decoding fails.

💡 Hint

Use a @State String? variable to hold error messages and show a Text view conditionally.

Practice

1. What is the main purpose of using a custom decoder configuration in Swift's Decodable protocol?

easy

A. To control how data keys map to your code properties

B. To change the app's user interface colors

C. To speed up the app's launch time

D. To encrypt data before decoding

Solution

1. Step 1: Understand the role of custom decoding

   Custom decoder configuration allows you to specify how JSON or other data keys match your Swift properties.

2. Step 2: Identify the purpose in data mapping

   This helps fix mismatches when the data keys differ from your property names.

3. Final Answer:

   To control how data keys map to your code properties -> Option A

4. Quick Check:

   Custom decoding = data key mapping control [OK]

Hint: Custom decoder fixes key-property name mismatches [OK]

Common Mistakes:

• Thinking it changes UI appearance
• Assuming it improves app speed
• Confusing decoding with encryption

2. Which of the following is the correct way to define a custom key mapping in a Swift Decodable struct?

easy

A. Declare properties as lazy var

B. Use an enum conforming to CodingKey with cases matching JSON keys

C. Override the init() method without parameters

D. Use @IBOutlet annotations on properties

Solution

1. Step 1: Recall how to customize keys in Decodable

   Swift uses an enum conforming to CodingKey to map JSON keys to property names.

2. Step 2: Identify the correct syntax

   The enum cases represent the JSON keys, allowing custom mapping.

3. Final Answer:

   Use an enum conforming to CodingKey with cases matching JSON keys -> Option B

4. Quick Check:

   Custom keys = enum CodingKey [OK]

Hint: Custom keys use enum CodingKey with cases [OK]

Common Mistakes:

• Trying to override init() without parameters
• Using lazy vars for decoding
• Confusing UI annotations with decoding

3. Given this struct and JSON, what will be the value of userName after decoding?

struct User: Decodable {
  let userName: String
  enum CodingKeys: String, CodingKey {
    case userName = "user_name"
  }
}

let json = "{\"user_name\": \"Alice\"}".data(using: .utf8)!

medium

A. "userName"

B. Decoding error

C. nil

D. "Alice"

Solution

1. Step 1: Understand the custom key mapping

   The JSON key "user_name" maps to the property userName via the CodingKeys enum.

2. Step 2: Decode the JSON data

   The decoder reads "Alice" from "user_name" and assigns it to userName.

3. Final Answer:

   "Alice" -> Option D

4. Quick Check:

   Mapped key value = "Alice" [OK]

Hint: Check CodingKeys mapping to find decoded value [OK]

Common Mistakes:

• Assuming property name must match JSON key exactly
• Expecting nil if names differ
• Thinking decoding fails without exact key match

4. What is wrong with this custom decoder implementation?

struct Product: Decodable {
  let id: Int
  let name: String
  enum CodingKeys: String, CodingKey {
    case id
    case productName
  }

  init(from decoder: Decoder) throws {
    let container = try decoder.container(keyedBy: CodingKeys.self)
    self.id = try container.decode(Int.self, forKey: .id)
    self.name = try container.decode(String.self, forKey: .productName)
  }
}

medium

A. Missing Decodable conformance

B. Properties are not declared as optional

C. CodingKeys enum does not map 'name' property correctly

D. Decoder container is not created properly

Solution

1. Step 1: Check CodingKeys enum against properties

   The property name expects a key, but CodingKeys has productName which does not match the property name.

2. Step 2: Identify the mapping issue

   Since productName is not linked to name, decoding will fail or mismatch.

3. Final Answer:

   CodingKeys enum does not map 'name' property correctly -> Option C

4. Quick Check:

   Property-key mismatch = error [OK]

Hint: Ensure CodingKeys cases match or map all properties [OK]

Common Mistakes:

• Not mapping property names to keys
• Forgetting Decodable conformance
• Misusing decoder container creation

5. You receive JSON data with keys "first_name" and "last_name", but your Swift struct uses firstName and lastName. How do you configure your decoder to handle this mismatch efficiently?

hard

A. Create a CodingKeys enum mapping firstName = "first_name" and lastName = "last_name"

B. Rename your struct properties to match JSON keys exactly

C. Manually parse JSON strings without using Decodable

D. Use @objc annotations on properties

Solution

1. Step 1: Identify the key-property name mismatch

   JSON keys use snake_case, but Swift properties use camelCase.

2. Step 2: Use CodingKeys enum to map keys to properties

   Define enum with firstName = "first_name" and lastName = "last_name" to decode correctly.

3. Step 3: Avoid renaming properties or manual parsing for cleaner code

   This approach keeps your code clean and flexible.

4. Final Answer:

   Create a CodingKeys enum mapping firstName = "first_name" and lastName = "last_name" -> Option A

5. Quick Check:

   Use CodingKeys for key mapping [OK]

Hint: Map JSON keys to properties with CodingKeys enum [OK]

Common Mistakes:

• Renaming properties instead of mapping keys
• Parsing JSON manually instead of using Decodable
• Using irrelevant annotations like @objc