How to build a Random Meal Generator App with Xcode and AI

Overview

In this tutorial, we will create a random meal generator application using Xcode and Alex, an AI assistant for iOS development. This app will provide a fun and efficient way to decide what to cook each day.

What We're Building
This is a simple app with a few key features:

A ‘Generate’ button to get a random meal suggestion
A list of previously generated meals
The ability to save and delete meals

We’ll use the TheMealDB public API to fetch random meal data.

Prerequisites
To follow along, you'll need:

Xcode
Alex (with a free trial)

Implementation Steps

1. Project Setup & Planning

Start by opening Xcode and creating a new SwiftUI project. Name it 'RandomMealGenerator'. We will mainly need two SwiftUI views: a ContentView and MealView. You could instruct Alex to create these for you by saying, "Create a ContentView with a Generate button and a MealView to display a list of meals."

2. Core Features

First, let's work on the ContentView. Here's the Swift code to create a button that generates a random meal:

struct ContentView: View {
    var body: some View {
        Button(action: {
            // Logic to fetch a random meal from the API will go here
        }) {
            Text("Generate")
        }
    }
}

Now, let’s create the model and fetch logic using theMealDB API:

struct Meal: Identifiable, Codable {
    let id: String
    let name: String
    
    enum CodingKeys: String, CodingKey {
        case id = "idMeal"
        case name = "strMeal"
    }
}
 
func fetchRandomMeal(completion: @escaping (Meal?) -> Void) {
    guard let url = URL(string: "https://www.themealdb.com/api/json/v1/1/random.php") else { return }
    
    URLSession.shared.dataTask(with: url) { data, _, _ in
        guard let data = data else { return }
        if let response = try? JSONDecoder().decode([String: [Meal]].self, from: data),
           let meal = response["meals"]?.first {
            DispatchQueue.main.async {
                completion(meal)
            }
        } else {
            DispatchQueue.main.async {
                completion(nil)
            }
        }
    }.resume()
}

You can ask Alex to help generate this API call and model by saying something like: "Alex, help me fetch a random meal from https://www.themealdb.com/api/json/v1/1/random.php".

3. Data & Storage

We can use UserDefaults to save previously generated meals. Here’s an example of saving meals:

func saveMeals(_ meals: [Meal]) {
    if let data = try? JSONEncoder().encode(meals) {
        UserDefaults.standard.set(data, forKey: "savedMeals")
    }
}
 
func loadMeals() -> [Meal] {
    if let data = UserDefaults.standard.data(forKey: "savedMeals"),
       let meals = try? JSONDecoder().decode([Meal].self, from: data) {
        return meals
    }
    return []
}

You can also ask Alex to create this boilerplate for you by saying: "Alex, write functions to save and load Meal objects using UserDefaults."

To improve the UI, you can add animations, loading and error states. For example, show a spinner while fetching meals. Alex can help you with these small improvements by giving tips like “Add animation when a new meal appears.”

Next Steps

To enhance your app, consider adding features like:

A detail view for each meal with ingredients and instructions
An option to filter meals by type (vegetarian, vegan, etc.)

You can use additional endpoints from TheMealDB API for more advanced features.

Conclusion

Congrats on building your first iOS app with the help of an AI assistant! You’ve learned to fetch data from an API, create views, manage local storage, and polish the UI. Remember, Alex can significantly speed up your development process, whether you're starting from scratch or refining your code.

If you haven't tried Alex yet, start your free trial today!