¡Suscríbete y continúa aprendiendo!

Esta lección está disponible únicamente para suscriptores.

Regístrate o inicia sesión para continuar aprendiendo:

Frontend Aprendiz

Organizar components

En esta lección organizamos mejor los componentes de nuestro proyecto. Así mismo eliminamos componentes que ya no necesitamos y que vinieron creados inicialmente.

Esta lección no cuenta con recursos adicionales.

Si crees que hace falta algo, o necesitas ayuda, puedes publicar una pregunta en el foro.

Respecto a nuestros avances anteriores han desaparecido porque ya no estamos cargando "ProductList", estamos cargando tres componentes nuevos. Pero no te preocupes porque nuestros componentes siguen existiendo. Solo necesitamos organizar un poco nuestro proyecto. Así como tenemos una carpeta "views" donde cada componente representa una página. Tenemos también una carpeta "components" donde se recomienda ubicar a los componentes de nuestra aplicación. Cuando creamos nuestro proyecto inicial, este incluía tres componentes, "HelloWorld", "TheWelcome" y "WelcomeItem". Como ya no necesitamos estos componentes, los vamos a eliminar y lo que vamos a hacer es ubicar nuestros componentes, los que habíamos creado en la carpeta de “components”, ya que los teníamos en la carpeta de "examples". Si voy a dirigirme a la carpeta de "examples" dentro del navegador de archivos de Windows y voy a cortar "ProductList", "ProductCard" y "Cart" a la carpeta correspondiente de "components". En "examples" vamos a dejar simplemente a nuestros dos contadores de ejemplo que hicimos al inicio para revisar la diferencia entre Option API y Composition API. Vamos a llevarnos nuestros tipos también a otra carpeta. Vamos a crear una carpeta "model" y dentro de esa carpeta vamos a poner nuestros tipos. Se estila crear una carpeta model para contener las interfaces, ya que representa la capa de modelo de nuestro proyecto. Tras hacer ello, vamos a modificar nuestro "HomeView". Vamos a hacer que nuestro cambio incluya en su interior a nuestro componente "ProductList". De esta manera, si hacemos eso, vemos que la ruta de inicio muestra a nuestro componente "ProductList". Esto es debido a que "HomeView" incluye a producto. Si nos vamos a la ruta de "cart", sin embargo, tiene su propio contenido y la ruta de "about" también. Solo en "home" estamos viendo los productos.

¿Tienes dudas?

Publicar pregunta

¡Comparte conocimiento!

Volver al índice

Regístrate

Inicia sesión para llevar un control de tu progreso.

Capítulos




















































52

Organizar components








































































Espera un momento ...

¿Te gustaría llevar mi curso de Laravel, gratis?

Sólo debes ingresar tus datos: