Este curso es una continuación del Proyecto API de pelis con DRF, en el que utilizando un framework JavaScript llamado Nuxt.js (basado en Vue.js), os enseñaré a crear un cliente web SPA.

El cliente nos ofrecerá tanto formularios de registro como de identificación y contará con dos páginas, una para visualizar el top de películas y realizar búsquedas, y otra para gestionar sus películas favoritas, ya que éstas se podrán marcar o desmarcar fácilmente y gestionarse en la propia sección.

Por si fuera poco añadiremos también unas alertas toast asíncronas que quedan geniales.

Dicho lo cual, teniendo Node.js instalado, desde la terminal ejecutamos:

npx create-nuxt-app cli_peliculas

Tendremos que elegir las siguientes opciones:

• Project name: Enter
• Project description: Enter
• Author name: Enter
• Package manager: npm
• UI Framework: Buefy
• Custom server framework: none
• Nuxt.js modules: Axios
• Linting tools: Enter
• Test framework: Enter
• Rendering mode: SPA

Esto nos creará una SPA básica usando Nuxt.js y la UI de Buefy automáticamente, vamos a echarle un vistazo:

cd .\cli_pelis\
npm run dev

Si accedemos a la url http://localhost:3000 podréis ver que la SPA ya cuenta con dos páginas y un diseño adaptativo basado en Bulma pero utilizando Buefy como librería de componentes para Vue.

Podríamos borrar lo que hay y construir nuestro cliente desde cero, pero he pensado que es mejor adaptar lo que tenemos, así nos centramos en lo importante.