A DruxtJS demo of Drupal Umami content, rendered by Nuxt A DruxtJS demo of Umami by Nuxt DruxtJS demo

Crema catalana

Enjoy this sweet recipe for one of the oldest desserts in Europe. It requires very few ingredients!

Prep
10 min
Cook
20 min
Serves
8
Difficulty
Medium

Ingredients

1l milk
200g sugar
6 egg yolks
30g cornstarch
1 cinnamon stick
1 piece lemon peel

Method

  1. 1 Mix the egg yolks, sugar, and cornstarch with 1/3 of the milk.
  2. 2 In a saucepan, boil 2/3 of the milk with the lemon peel and cinnamon.
  3. 3 After 3 minutes, remove from the heat and take out the lemon and cinnamon.
  4. 4 Slowly add the egg mixture to the hot milk through a strainer to ensure there are no lumps.
  5. 5 Return it to the heat until it boils, stirring constantly.
  6. 6 Once the mixture has begun to thicken, remove from the heat and put it into individual bowls to cool.
  7. 7 For an authentic finish, sprinkle with sugar and brown with a blowtorch or under a preheated broiler to caramelize.
Same node, other view modes

Drupal's display modes are components here. Switch one and the page re-renders from the entity already in the store, with no second request.

Open card in Storybook →
How this page works

One component file renders every recipe on this site

Drupal's full display mode maps to this file. Change the layout here and all 24 recipes follow. The field templates, labels and formatters still come from Drupal's display config.

Read the Entity guide →
      
      <DruxtEntity
  type="node--recipe"
  mode="full"
  :uuid="uuid"
/>
Built with DruxtJS

This whole magazine is one Drupal site and one Nuxt app

Blocks, menus, views, breadcrumbs, entity forms and search all come straight from Drupal's JSON:API. You override a component only when you want to.

Start your own in one command
$ npx giget@1 gh:druxt/quickstart#develop my-druxt-site --install

Or open this site in DevPod, with its backend, frontend and demo content.