SwiftUI - Declarative Interfaces for any Apple Device

Launch Xcode and create a new SwiftUI app to explore declarative interfaces, content view, the view protocol, the body, and live previews.

Learn to customize text and combine views using vertical and horizontal stacks in SwiftUI, control spacing, and apply font and foreground styling to individual views or their parent stack.

Learn to import and rename an image in assets, resize with view modifiers, clip shapes, apply padding, and use async image with a URL and placeholder in SwiftUI.

Learn to build a SwiftUI declarative list to display hikes with names, photos, and miles, using identifiable models, image styling, and formatted distances, with navigation via a navigation stack.

Wrap the app in a navigation stack and use a navigation link with a hashable hike value to navigate. Extract the hike cell view and pass the hike.

Create a hike detail screen that shows the hike image, name, and miles by passing the hike data, and use a preview navigation stack with inline display for the title.

Add tap-to-zoom animation on the image by toggling a zoomed state with on tap gesture, switching between fit and fill and wrapping changes in a with animation block.

Learn how to build a custom grid in SwiftUI by creating a grid control yourself, contrast with the built-in list, and implement a two-row by three-column grid.

Create a dynamic SwiftUI grid by chunking an array into subarrays, using a slider to control columns, and rendering nested loops to display animal items.

Create a hard coded grid in SwiftUI by using a list and horizontal stacks to form rows and columns of image cells, and preview the result.

Learn how to chunk an array into rows and columns to build a dynamic grid, using an array extension named chunked and stride-based indexing.

Define a dish model with an id, name, price, and image URL, then fetch and chunk data to build a dynamic grid using a list of horizontal stacks in SwiftUI.

Understand the state concept in SwiftUI by using the @State wrapper to store a counter and automatically re-render dependent views, ensuring efficient updates.

Demonstrate state management with @State by using a toggle bound to a boolean isOn, showing real-time UI updates, and conditional text and colors as the state toggles.

Learn to build a simple swiftui list using state and text fields: enter a name, press return to add it to a friends list, and render the updated list.

Learn to filter a SwiftUI list with searchable, binding a search string, and onChange to update a filtered friends array, while using a navigation stack and on appear for initialization.

Explore how binding lets a light bulb child communicate with its parent by passing is on from parent to child, toggling the bulb and updating the parent's background.

Learn how to manage global state with an environment object in pre iOS 17 by injecting app state at the root, mutating it, and letting other views access it.

Explore how iOS 17 replaces pre-17 environment object patterns with the observable macro and environment view modifier to manage app state, bind properties, and drive UI with a toggle.

Explore design patterns as best practices to solve a particular problem by outlining relationships between the classes and objects, highlighting programming independent nature, flexibility, reusability, maintainability, and mvvm design pattern.

Explore the mvvm design pattern, learn how the view communicates with the view model rather than the model, and see how the view model centralizes data to build maintainable apps.

Explore why the mvvm design pattern improves app architecture by separating a view from its data with a password reset view model, enabling client-side validation and clean data flow.

Explore MVVM with web APIs in a SwiftUI app, where the view requests data through the view model and the view model delegates calls to a web service client.

Build a weather UI that fetches temperatures from the Openweathermap API for Houston, Austin, Boston, and Denver, using MVVM to transform data into a clean UI display.

Register with OpenWeatherMap to obtain a mandatory API key, then learn to fetch current weather data by city name and view sample responses for London.

Sign up for Openweathermap, fetch the json result with a weather service, and map temperature and humidity into a decodable weather model using a URL session and an async completion.

Implement a weather view model as an observable object that fetches weather data via the weather service, publishes updates, and formats temperature and humidity for the SwiftUI interface.

Learn to display weather in a SwiftUI view by building a weather view model, binding city input, triggering searches, and presenting temperature using MVVM and the OpenWeatherMap web API.

Build a weather app interface in SwiftUI by wiring a geocoder client and a weather client to fetch and display city weather from Openweathermap, with Fahrenheit default.

Register for a free OpenWeatherMap API key, use the geocoder to obtain latitude and longitude, then fetch current weather data via the current weather data API.

Implement client models or dtos to map geocoding results to a location with name, latitude, and longitude, then model temperature and expose endpoints for geocoding and weather.

Implement an api endpoint as an enum to build urls for coordinates by location name and weather by latitude and longitude, using api.openweathermap.org and an api key.

Implement a geocoding client in SwiftUI that fetches coordinates by city using async throws, decodes JSON into a location with name, latitude, and longitude, and tests Houston.

Implement a weather client that fetches weather by location using a geocoding client and URLSession, and refactor the content view to display weather with a text box for city name.

Refactor the app to fetch coordinates from a city with a geocoding client and display weather using a weather client, including async task cancellation and Fahrenheit formatting via OpenWeatherMap.

Build a coffee ordering app with a Node.js and Express.js web API. Fetch and save orders, add Veronica's cappuccino, and see how the server posts and gets data.

Explore how a node express.js server handles coffee orders with an in-memory orders array, using post and get routes on glitch.com.

Create SwiftUI coffee and order models with codable conformance and a static all function, returning sample coffees; decode JSON orders via a web service and map to assets.

Create a web service to fetch all orders and decode them into order objects for the SwiftUI UI. Use URLSession data task with an escaping completion and main thread updates.

Implement order list view model and order view model to fetch orders from web service, map each to a view model with a unique id, and publish updates for SwiftUI.

Display coffee orders in a dedicated order list view with a navigation view, using an order view model passed from content view, showing image, name, size from a web service.

Implement a create coffee order webservice by posting a json-encoded order to a url, and decode a create order response with a success flag.

Implement an add coffee order view model to capture user input, compute total price by size, and place orders via a web service using coffee list and coffee view model.

Build the add coffee order view in SwiftUI, using a navigation view and form with name and coffee selection, a coffee cell view, and a size segmented control.

Create a reusable order total view bound to the add coffee order view model, update the total in real time as size changes, and place orders via the web service.

Implement sheet-based navigation from content view to add coffee order view using a bindable isPresented property and a plus button, with MVVM data flow and fetch orders.

Demonstrate how Xcode previews render your content view in real time using the preview provider and preview property. Learn to switch devices and themes for a restaurant menu app.

Create a SwiftUI dish cell for a list, wire it to a preview provider, and experiment with layout options, including images, text, alignment, padding, and dynamic font sizing.

Learn to apply dynamic font sizing in SwiftUI previews by using the environment size category, testing extra small to extra extra large, and grouping previews to compare multiple sizes.

Learn how to preview dark mode in SwiftUI using the color scheme function and a navigation view workaround, and how to simulate multiple devices with preview device settings in Xcode.

Wire a dish model to a dish cell in SwiftUI, display it in a list using for each, and preview updates by pinning the content view.

Preview UIKit view controllers in Xcode using SwiftUI previews, by creating a preview provider and a UI view controller representable for storyboard-based interfaces.