Saltar al contenido

Categoría: Desarrollo web

Cargar dinámicamente mixins distintos desde Vue router

Si estas haciendo aplicaciones con Vue.js es probablemente que estés usando los mixins para reutilizar el código. En algunos casos, existe la posibilidad de que tengas dos o más mixins con los mismos nombres de métodos pero implementando las funcionalidades de forma distinta. Pero solo necesites importar/inyectar uno solo en la vista actual. Entonces es necesario cargar dinámicamente mixins distintos desde el router dependiendo de la ruta.

Cómo cargar dinámicamente mixins distintos

En mi caso dependiendo de la ruta, necesitaba cargar código específico. Esto es para poder reciclar la vista, el cual llama a métodos con los mismos nombres en los distintos mixin. Como Vue.js 2 no soporta importar objectos de form dinámica, no podemos hacer los imports mediante una condición inicial. Así que la forma que encontré es pasando un nuevo componente que sea hijo (para heredar los atributos y métodos) de tu mixin. Defines en cada ruta, este nuevo componente y defines que herede el mixin correspondiente.

La solución a cargar dinámicamente mixins distintos es que Vue router permite en la sección de component pasar el componente que reutilizas (en mi caso el de la vista) y luego pasar en el atributo mixins, un arreglo con el mixin que debe usar esa vista.

A continuación puedes ver a qué me refiero:

{
      path: "/rutaA",
      name: "ComponenteA",
      component: {
        extends: ComponenteComun,
        mixins: [mixinA]
      }
    },
    {
      path: "/rutaB",
      name: "ComponenteB",
      component: {
        extends: ComponenteComun,
        mixins: [mixinB]
      }
    },

Con esto, cuando se entra a una ruta el router creará un nuevo componente con los métodos, atributos y observadores del componente a reusar. Pero como se está definiendo un mixin distinto a cada vista tendrán implementaciones distintas.

Espero que está guía te haya servido en tu proyecto informático. Si te gustó puedes compartirla o si deseas aportar algo a esta entrada, simplemente deja un comentario.

¡Gracias por leerla!

Deja un comentario

Características de un hosting para WordPress

Cuando deseas hacer un sitio en cualquier tecnología o por ejemplo en WordPress. Aparte de comprar tu dominio, es necesario adquirir el servicio de alojamiento o mejor conocido como hosting. En este artículo te enseñaré que es un servicio de alojamiento y como comprar un hosting para WordPress.

¿Por qué necesito un servicio de alojamiento?

Cuando quieres tener una página en Internet requieres principalmente de dos cosas: el dominio y el hosting. En este último es el alquiler del espacio de disco duro de una computadora (llamada servidor), donde se guardan los archivos, códigos e imágenes de tu página web. De esta forma, cuando escribes la dirección URL de un sitio, el dominio apunta a esa computadora para que el navegador inicie el proceso de carga y te la muestre.

¿Qué necesito para adquirir un hosting para WordPress?

Cada servicio de hosting posee soporte para ciertas tecnologías que permiten ejecutar o cargar tu página web. Para el caso de WordPress se requiere tener 2 cosas: un servidor web y un servidor de base de datos. Las compañías suelen ofrecer ambas al mismo tiempo por lo que no debes preocuparte de adquirirlos por separado.

Servidor Web

Es quien se encarga de procesar los archivos de la pagina para mostrarlos en tu navegador, en el caso de que tenga código de un lenguaje de programación lo procesa para generar el HTML que sería la página web que ves.

El hosting para WordPress, puede ser cualquier servidor web que procese PHP, el lenguaje de programación que utiliza WordPress. Ya que actualmente este CMS posee compatibilidad para la mayoría de ellos: Apache, Nginx, Lightspeed, entre otros. Lo mas importante es que soporte PHP (recomiendo tener compatibilidad con la versión 7.4 o superior) pues sin esto no podrás tener WordPress en tu servidor web.

La diferencia entre versiones y servidores web, solo afecta a usuarios mas avanzados y técnicos. Pues la configuración cambia y la velocidad del mismo. Ya queda criterio del programador cual elegir (en caso que se pueda, pues algunos servicios de alojamiento solo te brindan una configuración única).

Base de Datos

El servidor de base de datos es aquel donde se almacenan los datos de forma clasificada y ordenada. De esta forma es rápido leerlo y clasificarlo. Por ejemplo, si tienes varias noticias o artículos en tu página, el servidor de base de datos permite organizarlas por las fecha mas reciente y permitir a WordPress mostrarlas de forma bonita y organizada en el navegador.

Para WordPress requieres tener como base de datos MySQL o 100% compatibles como MariaDB. Si tu servidor de alojamiento tiene soporte para base de datos MySQL o MariaDB es suficiente. Generalmente el otro requerimiento es el espacio (depende de cuanta información tienes) y la versión que debe ser superior a 5.0.15, que hoy en día es una versión muy vieja.

Otro software

Adicionalmente al gestor de Base de Datos y el servidor web que ejecute PHP. Recomiendo tener adicionalmente:

  • Panel de administración como Cpanel, para poder navegar en el sistema de archivos, crear cuentas de correo, administrar dominio y demas cosas fácilmente.
  • Tener instalado GIT para que los programadores puedan subir sus desarrollos fácilmente. Además permite actualizar o revertir actualizaciones rápidamente.
  • SSH para subir los archivos al servidor de forma segura. También con acceso SSH los programadores pueden ejecutar comando o correr scripts que facilitan el trabajo.
  • Soporte a correos electrónicos para poder enviar correos desde el servidor y no usar (inicialmente) otro servicio adicional para enviar informaciones a tus usuarios.

Conclusiones

Como resumen, si andas buscando un hosting para WordPress, te recomiendo hacer esta comparativa de hostings y seleccionar el que tenga la mejor relación de características ajustadas a tu presupuesto.

¡Luego empieza a subir tus archivos y disfruta de tu sitio con WordPress!

Deja un comentario

¿Sirve una Mac con Apple Sillicon (M1, M1 Pro, M1 Max) para el desarrollo web?

Hace unos meses adquirí una Mac mini con el nuevo procesador de Apple Sillicon (M1). Estaba buscando remplazar mi Mac mini anterior y cuando vi que sacaron nuevos equipos con el chip M1 que en las pruebas de rendimiento superaban a la mayoría de procesadores, no producían mucho calor (vivo en un lugar caliente ) y por lo tanto no eran equipos ruidosos.

¿Que tienen de distinto los chips M1 y cual adquirir?

Los chips de Apple Sillicon (M1) son diseñados por la misma Apple. Utilizan la arquitectura ARM a diferencia de x86 que era la utilizada por AMD e Intel (quien proveía procesadores a Apple desde el 2005).

Esto significa que utilizan otra instrucciones, por lo tanto los programas deben ser compilados para esta arquitectura. Pero tiene como ventaja que los equipos con ARM se diseñan para consumir menos energía y actualmente poseen gran rendimiento.

El chip de Apple Sillicon (M1)
El chip de Apple Sillicon (M1)

Apple Sillicon (M1) para el desarrollo web

Respecto a la compatibilidad de aplicaciones, macOS ofrece Rosseta 2. Una aplicación que traduce el código de x86 a ARM permitiendo ejecutar cualquier aplicación previa sin problemas. Respecto al rendimiento, obviamente es menos al nativo pero igual están a la par con los equipos anteriores de Apple con procesadores Intel.

Sin embargo, a estas alturas la mayoría de aplicaciones ofrecen compatibilidad para el Apple Sillicon (M1). Por lo que podrás trabajar sin problemas como si estuvieses en otro equipo.

Editores o IDEs

Actualmente los principales IDEs para programación web ofrecen compatibilidad nativa. El primero en probar fue Sublime Text 4 que es el mas rápido que usado. Xcode como es el propio de Apple también es rápido pero casi no me gusta para desarrollo web. Visual Studio Code también ofrece version nativa que funciona muy rápido al igual que la suite de Jet Brains.

Lo único que se debe tener cuidado es con instalar la versión para ARM y no la de x86. Ya que todos estos editores ofrecen ambas versiones y a pesar que la versión de x86 corre en tu equipo. No lo hará de forma nativa y es muy lento.

Compatibilidad con lenguajes de programación

macOS ofrece versiones nativas de lenguajes com Ruby, PHP, entre otros. Sin embargo, puedes conseguir versiones nativas de Rust, Go, PHP, Ruby, JavaScript (con Node) y usarlas sin problemas. Si usas lenguajes interpretados, el código será igual entre arquitecturas así que no habrá problemas al momento de ejecutar o desarrollar tus aplicaciones. En nodeJS tuve que compilar algunos módulos para que quedaran nativos para que funcionara en mis proyectos, pero creo que otro sistemas operativos también hace eso la primera vez.

Docker

Docker requiere de Linux para funcionar, en macOS Big Sur ofrecen algo llamado Virtualization Framework que sirve para correr otros sistemas como Linux en un hypervisor. Docker desde la version 3.3 ofrece soporte para equipos con Apple Sillicon (M1). Desde que actualicé a la versión 4 no he tenido problemas siguiendo estas recomendaciones:

  • Uso las imágenes de mis contenedores en versiones de ARM para mejorar la velocidad. Algunos contenedores como el de Mailcatch, solo tienen para x86 y lo uso sin problemas.
  • Usar qemu como método de virtualización para tener 100% de estabilidad. Yo uso Virtualization Network y a veces falla al hacer operaciones pesadas con la base de datos.
  • La imagen oficial de MySQL no está para ARM y uso MariaDB en ARM. Siempre que intente usar MySQL inclusive con la emulación falla, desconozco la causa y por eso lo dejé de usar.

Pero en general funciona bien, estable y hasta los momentos no ha afectado mi trabajo.

Homebrew y aplicaciones del sistema

Te recomiendo visitar Does it ARM para buscar si el software corre en tu equipo. Aunque no he tenido problemas de compatibilidad. Suelo instalar las aplicaciones del sistema a través Homebrew y este separa las versiones de x86 y ARM por separado, así que si ofrece versión nativa se instala esa, si no, usará la arquitectura de x86. Todo esto funciona de forma transparente así que no habrá que intervenir.

Recomendaciones finales

Me parece que los equipos con Apple Sillicon (M1) son buenos para el desarrollo web, la relación costo/rendimiento es muy buena, gran compatibilidad con las aplicaciones existentes de macOS, gran potencia, poco consumo de energía y ningún ruido en el hardware. Hacen de estos unos equipos una buena compra para el desarrollo web.

Por ahora, la única limitación que veo es la cantidad de RAM, actualmente un máximo de 16GB, esta cantidad compartida con el chip de vídeo puede ser muy poco para algunos usuarios y probablemente deseen esperar por la siguiente generación de equipos con Apple Sillicon. Sin embargo, debido a la velocidad de los discos, al usar el área de intercambio o swap, la velocidad sigue siendo muy alta por lo que si necesitas mas RAM la velocidad sigue siendo muy potente, pero no es lo recomendable.

Respecto al disco duro, no me preocupa. Tengo una portátil con un disco duro SSD de menor calidad y hasta los momentos me ha durado 7 años, estoy seguro que esos me durarán mucho mas. Ademas he tomado medidas como no indexar ciertos archivos para aumentar el rendimiento y vida útil del disco duro.

En fin, si buscas un equipo con buen costo/rendimiento para realizar desarrollo web y prefieres usar macOS. Te recomiendo las computadoras con Apple Sillicon (M1). No tendrás problemas de compatibilidad con las aplicaciones existentes y el rendimiento será muy bueno.

Si compraste un equipo o vas a hacerlo, ¡Bienvenido(a) a la arquitectura ARM!

Deja un comentario

WordPress y Docker: Mi charla del WordCamp Cochabamba 2021

Hace unas semanas tuve la oportunidad de participar en el WordCamp de Cochabamba 2021. En ella hablé por primera vez de Docker y como utilizarlo con WordPress. Para quienes no conocen Docker, es una herramienta que permite trabajar con contenedores, una tecnología para encapsular las aplicaciones junto a su entorno de ejecución (podemos verlo como una proceso que por dentro tiene Linux y mas aplicaciones corriendo sobre él).

En el caso de WordPress, podemos encapsular en un contenedor una instalación de WordPress junto un servidor MySQL, Nginx con versiones específicas. Así cuando ejecutemos ese contenedor en producción, en el ambiente local o desarrollo; van a poseer la misma versión y el mismo software así que nos podemos concentrar solo en el desarrollo de WordPress.

¿Por qué usarlo?

Una de las ventajas es que se encarga de la configuración e instalación de las capas inferiores de una aplicación. En el caso de WordPress, no nos preocuparemos si la versión de PHP o MySQL instaladas en el ámbito de desarrollo son diferentes al del entorno de producción. Por lo que podemos programar a una versión específica del lenguaje sin que falle posteriormente. Otro uso es poder intercambiar esas capas inferiores fácilmente y así probar un tema o plugin que hemos desarrollado, en diferentes versiones de PHP o de WP y comprobar compatibilidad.

Arquitectura de varias instalaciones de WordPress con distintas versiones de MySQL usando Docker
Ejemplo de como puedes usar Docker para correr un plugin en instalaciones de distintas versiones de WordPress

En fin, hay un montón de usos que podemos hacer pero mejor mira mi charla sobre el tema. Aprenderás todo lo necesario para iniciarte en poco tiempo.

Mi charla sobre WordPress y Docker

Esta es la primera vez que doy la charla en un WordCamp. En esta charla explico las bases teóricas de Docker, cómo aplicarlo para un instalación de WordPress, ejemplos y escenarios de como usarlos. Por ejemplo, si quieres probar un código con varias versiones de WordPress al mismo tiempo, en el vídeo puedes ver hacerlo y así ahorrar tiempo.

Si deseas saber todo eso, te recomiendo ver el video sobre Dockeriza tu flujo de desarrollo con WordPress y aprende a iniciarte con esta tecnología. Si no puedes verlo puedes hacerlo desde su página en WordPress.tv

Si te gustó, recuerda compartirlo con otras personas para que todos aprendamos a mejorar nuestras habilidades. También puedes dejar tu comentario si deseas agregar algo al contenido o si tienes una duda.

¡A estudiar contenedores!

Deja un comentario

Estudiar desarrollo de aplicaciones web

El desarrollo de aplicaciones web consiste en crear programas y software que son ejecutados dentro de un navegador web como Firefox, Chrome o Edge. Estos programas se instalan en un servidor que sirve páginas web dependiendo de las acciones del usuario. Las tecnologías utilizadas para hacer estas aplicaciones son: HTML, CSS y Javascript. Así que si quieres dedicarte a esta rama, necesitas aprender estas tecnologías aparte de manejo básico de servidores, comunicaciones, entre otros.

Puede sonar complicado, pero estos temas se van aprendiendo poco a poco. Si quieres iniciarte en este mundo, te lo recomiendo. Solo debes tomar un paso a la vez. En líneas generales las cosas básicas que debes aprender son:

  • HTML: es lenguaje para definir las páginas web. Con él puedes crear la estructura de las páginas, definir la información de las páginas web. El lugar donde va ir cada dato, imagen, entre otros.
  • CSS: es el lenguaje que permite definir la apariencia de las cosas definidas en el HTML: color, tamaño, posición, efectos, animaciones, entre otros. Dominar CSS te garantizará un buen futuro laboral y es recomendado para personas con inclinaciones artísticas.
  • JS: es el lenguaje de programación para alterar el contenido HTML de la página y obtener información de los eventos que realiza el usuario o navegador. De esta forma creas las aplicaciones, porque con esto puedes obtener los datos de la interacción del usuario con la computadora y alterar el HTML/CSS para mostrar otra información o los cambios realizados.
  • Servidores : es el corazón de todo. Aquí es donde se guardan y se ejecutan las aplicaciones web realizadas. También puede tener el gestor de la base de datos que es lugar donde se guardan y procesan los datos de la aplicación.

A pesar de que hay mas contenido por aprender, considera que esas 4 áreas son las que todo desarrollador debe aprender y conocer de forma básica. Existen mas áreas y de conocimiento pero requieren especialización y estudio adicional.

¿Cómo empezar en el desarrollo de aplicaciones web?

Si no sabes como empezar, puedes iniciar estudiando en una institución como la Escuela CES que te brinde una ruta a seguir. Así garantizas que posees todos los conocimientos requeridos para trabajar como desarrollador web y no pierdes tiempo en descubrir que cosas se requieren para ir avanzando. Por ejemplo, en la Escuela CES ofrecen el programa de Técnico Superior en Desarrollo de Aplicaciones Web a Distancia para capacitar y convertirte en un profesional con conocimientos de front-end y back-end para trabajar en diversos campos labores que existen en el desarrollo web: creación de páginas web, desarrollo de sistemas web, manejo de servidores, crear videojuegos o contenido multimedia que utilice la web como plataforma, aplicaciones web móviles entre otros.

En este Técnico Superior en Desarrollo de Aplicaciones Web a Distancia es muy completo, te enseñan las tecnologías mencionadas al inicio de este artículo. Adicionalmente, te enseñan lenguajes de programación como .NET, Java y PHP que son los mas utilizados en el mercado laboral. De modo que aprenderás tecnologías que son utilizadas ampliamente en la industría y podrás trabajar inmediatamente al terminar.

También me gusta como enfocan el contenido en los 2 años: en el primer año conocerás lo básico y tendrás nociones generales de desarrollo web. Con esto teóricamente puedes trabajar y tendrás conocimiento de todas las áreas para que vayan planificando tu carrera (en base a lo que mas te guste o te atraiga. En el segundo año, se profundiza cada una de los distintas áreas del desarrollo web y así puedes aplicar el conocimiento adquirido en el primer año en trabajo mas especializado y así descubrir con mayor profundidad cada área. En este segundo año ya estudiarás como es el trabajo real de un desarrollador web y al ir agarrando experiencia, empezarás a crear tu perfil profesional. De esta forma al salir al mercado laboral contarás con experiencia en varias ramas. Permitiendo buscar trabajo en un amplio sector del mercado o específicamente en lo que mas te guste.

Si deseas mas información sobre como puedes convertirte en un desarrollador(a) web, te recomiendo leer la siguiente infografía que da mas detalles sobre ello:

Infografía sobre temas de desarrollo de aplicaciones web
Infografía sobre el estudio de desarrollo de aplicaciones web

¿Que ventajas ofrece ser desarrollador web?

En mi caso, llevo varias décadas como desarrollador web. Para mí una de las cosas que mas me gusta de ésta área es que el resultado de tu trabajo puede verse en cualquier dispositivo con Internet en cualquier parte del mundo. Como casi todos los dispositivos con conexión a Internet tienen un navegador web, cada uno de estos dispositivos puede ejecutar una aplicación web o ver el contenido de una página web que hayas realizado.

Mi segunda ventaja, es una consecuencia de lo que comenté en el párrafo anterior. Al poder verse desde cualquier lado con acceso a Internet, también puedes trabajar desde cualquier parte del mundo. El desarrollo web se puede hacer 100% de forma remota, puedes crear sitios web y aplicaciones y trabajar con otros en otras partes. Utilizando herramientas como Git y de manejo de proyectos, puedes organizarte y comunicarte con otros para trabajar en conjunto. Al final, solo debes escribir código y subirlo a un servidor para que pueda ser ejecutado.

Otra de las cosas que me gusta, es que si estas en el área de Front-end. Trabajas con contenidos visuales y multimedia junto con código. Entonces si te gusta hacer cosas artísticas o visuales, puedes dedicarte a esta rama. O si te llama mas la atención el manejo de datos, cálculos matemáticos y cosas similares puedes dedicarte a la rama de Back-end. Es decir, para cualquiera de tus habilidades, conseguirás en que trabajar dentro del área de desarrollo web.

Espero que te animes a estudiar esta rama y a dedicarte a ella, puedes hacerlo desde tu casa y conseguir una carrera profesional en poco tiempo. La remuneración es buena y no requiere mucho tiempo o conocimientos para salir al mercado laboral. Así que…¡Éxitos!

Deja un comentario

¿Por qué WebAssembly? Mi charla del JSConf México 2020

El pasado noviembre del 2020 tuve la oportunidad de participar en el JSConf México para dar una breve charla titulada: ¿Por qué WebAssembly? En ella comento las razones de su existencia, cómo viene ayudar a Javascript a solucionar los problemas que ese lenguaje no permite hacer (o al menos de forma óptima).

Estaba muy emocionado por participar en este evento por muchas razones. Principalmente era volver a México luego de muchos años y compartir con la gente de allá. Pasar unos días allá, pero debido al COVID-19 se tuvo que retrasar y posteriormente hacerla virtual.

¿Por qué WebAssembly?

Esta charla es una variación de las anteriores que he dado, porque ya WebAssembly es usado cada día y no es tecnología del futuro, sino del presente. Ya hoy en día puedes usarlas sin problemas y entonces cambio el enfoque de la charla a por qué usarla.

En fin, si deseas verla totalmente en español puedes hacerlo a continuación. Una vez finalizada, me gustaría conocer tus opiniones, dudas o recomendaciones respecto al tema.

Why WebAssembly?

Me pareció muy chévere como el audio mi charla fue traducida a inglés. Agradezco al equipo de JSConf México 2020 por realizar esa labor. Gracias a ello, mi mensaje puede llegar a más personas y puedan aprender sobre ésta tecnología. Si prefieres escuchar el audio en inglés, a continuación te comparto esa versión del video.

Fue una gran experiencia participar en mi 2do JSConf, lamentablemente tuvo que ser virtual. Hubiese querido estar allá y regresar a México luego de muchos años (me encanta la comida mexicana real). Compartir tiempo con varios amigos de México como Yuliana y Luis Sanchez y disfrutar de la hermosa cultura del país.

Recuerda compartir este artículo si te gusta o deja tu comentario si deseas preguntar o complementar la información.

Deja un comentario