Uso de ES6 en Vue con webpack y Babel

Una de las ventajas de este nuevo flujo de trabajo con webpack, es que ahora tenemos a nuestra disposición poderosos pre-procesadores como vue-loader que nos permite agrupar el código de nuestros componentes en archivos .vue entre muchas otras ventajas. Una de estas ventajas, que veremos en esta lección, es la eliminación de las restricciones del navegador impuestas cuando colocamos nuestras plantillas en el HTML final. Puesto que ahora las plantillas de Vue van a ser pre-procesadas y no leídas por el navegador no es necesario que mantengamos restricciones como por ejemplo definir sólo elementos <li> dentro de un elemento <ul>.

Con este nuevo flujo de desarrollo con Vue y webpack, obtenemos otra ventaja y es el uso de babel-loader. Babel nos va a permitir utilizar la sintaxis más moderna de JavaScript (ES6) sin tener que preocuparnos si ésta va a poder ser interpretada o no por el resto de los navegadores, puesto que este código se va a transpilar a una versión de JS que los navegadores modernos puedan interpretar. Así que en esta lección vamos a sacar provecho de esto y a refactorizar nuestro código para que quede aún más limpio:

Regístrate para ver ésta y cientos de lecciones exclusivas.

Componentes de un solo archivo en Vue 2 con webpack y vue-loader

En esta lección aprenderemos cómo podemos separar nuestros componentes en diferentes archivos que permitan a cada componente agrupar sus plantillas y código de JavaScript en un mismo lugar. Estos archivos que tendrán la extensión .vue, se llaman «Single File Components» y podremos utilizarlos por supuesto gracias a webpack y vue-loader los cuales instalamos en la lección pasada haciendo uso de vue-cli. En esta lección también haremos uso de Hot Module Replacement (HMR) que nos permitirá hacer cambios en el código y poder verlos reflejados automáticamente en el navegador, sin necesidad de recargar la página.

Ver post

Introducción a vue-cli y webpack

En esta quinta parte del Curso de Vue.js 2, vamos aprender cómo es el flujo de desarrollo profesional con Vue. Para ello vamos a instalar y usar, npm (manejador de paquetes para Node), vue-cli (el cliente de Vue para crear proyectos),  webpack, vue-loader, Babel y más. Si suena complicado, no te preocupes, puesto que Vue.js con la ayuda de su cliente vue-cli lo hace muy sencillo. Además a partir de la siguiente lección, vamos a explicar todo el proceso paso por paso:

Ver post

Uso del «Event Bus» para comunicar componentes en Vue 2

En la lección anterior aprendimos cómo emitir y escuchar eventos personalizados en Vue para enviar mensajes desde un componente «hijo» hacia el componente «padre» ¿Pero qué sucede si queremos enviar y recibir mensajes entre dos componentes que «hermanos» o que no están relacionados en lo absoluto? Esto es lo que aprenderemos a hacer en esta lección, utilizando un objeto de Vue adicional que nos servirá como un «Event Bus» o «Event Dispatcher» para toda nuestra aplicación.

Ver post

Reglas de validación personalizadas en Laravel

El validador de Laravel cuenta con una serie de reglas que cubren muchos de los posibles tipos de datos que puedan ser enviados a nuestra aplicación por medio de los formularios, pero siempre encontramos esos casos especiales dónde estas reglas no se adaptan a las necesidades específicas del proyecto, en este caso se crea la necesidad de crear algunos criterios de evaluación personalizados.

Veamos como podemos crear reglas personalizadas extendiendo la funcionalidad del validador de Laravel.

Ver post

Separación de datos entre el modelo y la vista en Vue.js 2

Esta es una lección muy interesante e importante del curso de Vue.js 2, puesto que aprenderemos cómo separar y diferenciar datos de nuestro modelo de aquellos datos que únicamente forman parte de la interfaz de usuario o vista. Además aprenderemos cómo asociar propiedades adicionales al modelo de forma reactiva, definir y usar la propiedad data dentro de los componentes y mucho más:

Ver post

¿Dónde y cómo comenzar a aprender Laravel?

Aquí en Stydenet hemos creado muchísimos tutoriales y videotutoriales (llevamos más de 700) de Laravel, PHP y tecnologías relacionadas. Además decidimos agruparlos en diferentes series y cursos para facilitar su aprendizaje.

Puesto que todos estamos aprendiendo pero no todos tenemos el mismo nivel, además tanto el lenguaje PHP como el framework Laravel son muy completos y constan de muchos componentes, desde lo básico (rutas, vistas) hasta lo avanzado (inyección de dependencias, pruebas unitarias), es imposible crear un solo curso para todos. Es por ello que en Styde.net hemos didivido nuestro material en diversos cursos, cada uno enfocado en un nivel específico y con una meta específica:

Ver post

Suscríbete a nuestro boletín

Te enviaremos publicaciones con consejos útiles y múltiples recursos para que sigas aprendiendo.

Suscríbete a nuestro boletín

Recibe consejos útiles, promos y múltiples recursos directamente en tu correo.

Tu nombre y correo serán enviados directamente a MailChimp. No compartiremos tus datos con otras empresas.