DonsoftST
¿Quieres reaccionar a este mensaje? Regístrate en el foro con unos pocos clics o inicia sesión para continuar.

Tutorial usando Netlify y Github

Ir abajo

Tutorial Tutorial usando Netlify y Github

Mensaje por Overclip el Sáb 28 Nov 2020, 8:22 am

Tutorial usando Netlify y Github 1366_2000

Si quisiéramos definir Netlify en pocas palabras, diríamos que es un servicio de hosting para sitios web estáticos. Pero es un hosting al que nosotros no subiremos nada, por lo que toca olvidarse de cuentas FTP o similares: el código HTML, Javascript e imágenes estarán alojados en nuestro servicio Git favorito (Github, Gitlab o Bitbucket).

Tutorial usando Netlify y Github 1366_2000

A cambio, ofrece toda una serie de características que no encontraremos en otros servicios para sitios estáticos como Firebase o Github Pages:


  • Despliegue continuo: permite vincular nuestro sitio web con un proyecto Git, con el objetivo de poder actualizar automáticamente el primero tras cada actualización que llevemos a cabo en el repositorio.
  • Rollbacks: Si un cambio en el repositorio ha causado algún efecto indeseado en nuestro sitio web, siempre podremos hacer retroceder éste a una versión anterior de sí mismo con un único clic.



  • DNS: permite administrar zonas dentro del dominio netlify.com, así como usar dominios personalizados que hayamos adquirido.
  • HTTPS: disponible de forma automática para todas las zonas gestionadas por Netlify.
  • Split Testing: Nos da la opción de redireccionar un porcentaje configurable de nuestro tráfico web a una 'rama' de prueba de nuestro sitio, con el objetivo de realizar tests A/B.

A excepción de esta última característica (en fase beta), todas las demás opciones están disponibles en el plan 'Starter' de Netlify, totalmente gratuito, por lo que nos ofrece todo lo que necesitamos para poner online nuestra web.

Manos a la obra







Podemos usar nuestra cuenta en Github, Gitlab o Bitbucket para registrarnos e iniciar sesión en Netlify. Tras eso, cuando pretendamos crear desde éste nuestro sitio web, tendremos que dar acceso a Netlify a nuestra cuenta en Github (por ejemplo), y posteriormente se nos pedirá que vinculemos el sitio web a un proyecto concreto ya existente en la misma.

Tutorial usando Netlify y Github 1366_2000
Tras unos cuantos clics (el procedimiento es bastante intuitivo), y habiendo realizado el primer despligue, Netlify nos notificará que tenemos lista y online nuestra web en un subdominio de netlify.com. Sólo tendremos que pulsar el botón de "Domain settings" para hacer que esa URL (algo larga, y poco memorizable) sea sustituida por un dominio de nuestra propiedad.

Tutorial usando Netlify y Github 1366_2000
Pantalla final del proceso de creación de nuestro sitio web en Netlify (izquierda) y aspecto final del mismo (derecha).



Páginas estáticas... que no lo son tanto







Aunque para la prueba anterior hemos utilizado una web 100% estática (sólo un archivo HTML), lo cierto es que Netlify facilita crear páginas más complejas, en las que el límite entre lo estático y lo dinámico se desdibuja.
En los últimos años han ido apareciendo diversas aplicaciones que permiten generar sitios webs estáticos, pero que recurren a sistemas de gestión de contenidos y plantillas, e incluso a editores WYSIWYG.
Así, recurriendo a esta clase de software, apenas existe diferencia entre crear una web dinámica usando un CMS y optar por una estática, al margen de que esta última no se regenerará cada vez que un usuario la visite (algo parecido, por otra parte, a lo que ocurre con una web Wordpress cuando accedemos a ella a través de un CDN).

Entrar en detalles sobre los mismos excede el objetivo de este artículo, pero si visitáis StaticGen.com, podréis acceder a un listado de los generadores de sitios estáticos más populares (Next.js, Gatsby, Hugo, Jekyll, etc), cada uno con su correspondiente botón de 'Deploy to Netlify'.
Esto, unido a los apartados que la propia documentación de Netlify dedica al uso de los mismos os ayudará a crear sitios con la última tecnología web sin necesidad de gastar absolutamente nada en alojamiento.

Nota: Este tutorial tiene pequeñas modificaciones. Por (overclip)

Marcos Merino @MarcosMerino_B
Overclip
Overclip
Colaboradores
Colaboradores

Masculino
España
Mensajes Mensajes : 83
Puntos Puntos : 252
Fecha de inscripción : 22/11/2020

Volver arriba Ir abajo

Volver arriba


 
Permisos de este foro:
No puedes responder a temas en este foro.