Monster Factory

In this challenge, you will be building a monster factory component that will allow you to mix and match heads, torsos, and legs to create a unique monster using the Monster Factory API with designs outlined in the Figma Document

During this challenge you should first prioritize layout / functionality, and then if time allows, the styling from the Figma Document

Using the Parts API, you can query information about different parts that can be used as building blocks to create a monster.

Each part has a src field that points to a 500x500 png image url. By overlaying one image of each part type you can draw a full monster.

Note that at this time we are only interested in parts with a category of MONSTER as it seems the art department has slacked off and failed to draw any assets for other categories...

The arrow buttons to the left and right of your viewport should allow you to cycle through the various heads, torsos, and legs available in the Parts API.

Once you are satisfied with your customized monster, you should be able to give it a name and create it with the Monster API upon pressing the create monster button

Note if that you don't have a sufficiently interesting monster ( all parts are from the same CREATURE ), you will receive a
Boring Monster Error
This should be displayed below the viewport as shown in the Figma Document

Once you have successfully created a monster via the Monster API your monster will be given an id, use this to redirect the user to https://monster-factory.online/monster/{monsterId} If the monster in the page looks like the one in your preview window and has the correct name, you have successfully completed the layout / functionality part of this challenge, Congratulations!

With your remaining time, focus on implementing the design laid out in the Figma Document using the additional assets provided below.