Linear Flow with Async/Await

Linear Flow

👨‍💼 Let's refactor a Promise chain to use async/await. This will make the code much more readable!

type Recipe = { id: string; title: string }
type Ingredient = { name: string }

async function loadRecipe(id: string): Promise<Recipe> {
	return { id, title: 'Pancakes' }
}

async function loadIngredients(recipeId: string): Promise<Array<Ingredient>> {
	return [{ name: `${recipeId}-flour` }]
}

async function loadCookingData() {
	const recipe = await loadRecipe('r1')
	const ingredients = await loadIngredients(recipe.id)
	return { recipe, ingredients }
}

🐨 Open

index.ts

and refactor loadUserData so it uses async/await instead of .then() chains.

📜 MDN - async function

02. Async/Await/01. Linear Flow with Async/Await (💪 problem)

Linear Flow with Async/Await