difficulty	chapter	training	tags
1	Chapter 1: Vue.js Essentials	true	vue

Create a Movie Rating App

Challenge Description

Your task is to create a Movie Rating App using Vue.js 3. During this challenge, we’ll code out the following features:

• Rendering a list of movies.

Requirements

• Define the movies as reactive data.
• Use the Vue.js template syntax to display the movie information.
• Render all the movies with a v-for loop.
• Display the name, description, genres, and image of each movie.
• Display the movie rating as stars, with a maximum of 5 stars

Other Considerations

• If you see the data-test attribute anywhere in the boilerplate don't remove it.
• TailwindCSS is preinstalled with the default config. It might be helpful for you, if you want to have some styles. (Not obligatory)

😀 The movie list is provided as boilerplate, but feel free to add your favorite one into the list.

👀 Don't peek at the solution until you've solved the exercise yourself or exhausted your resources. Challenging yourself will best prepare you for the exam

Example of Finished App

This is an example of what the functionality should look like for the completed exercise. If you’d like to mimic this style, feel free to do so, but it is not required.