Ir al contenido principal

Hi, I'm Mariano Guerra, below is my blog, if you want to learn more about me and what I do check a summary here: marianoguerra.github.io or find me on twitter @warianoguerra or Mastodon @marianoguerra@hachyderm.io

Creemos en la Web: Recursos online

Si venís siguiente todas las secciones de esta serie habrás notado un patrón:

  1. Esto parece bastante repetitivo

  2. Abra alguien que haya hecho algo para facilitar esto?

  3. Si!

En esta sección vamos a ver algunos recursos que nos van a hacer mas fácil empezar y adaptar los recursos disponibles a lo que necesitemos.

Adaptando boostrap a nuestros gustos

Whoostrap cuenta con una lista de temas para aplicar a bootstrap y cambiar su aspecto básico.

Acá hay un ejemplo de como usarlo:

Guardamos el texto del CSS en un archivo y lo incluimos en nuestro proyecto, aca hay un ejemplo: https://thimbleprojects.org/marianoguerra/512478/

La pagina tambien provee algunos themes predefinidos themes.guide

Otras paginas quen nos brinda themes gratuitos que podemos descargar y usar: hackerthemes y Now UI Kit

Copiando fragmentos de HTML

Muchas de las partes de una pagina son generales y se repiten, por ejemplo la barra de navegación superior, el pie de pagina, una lista de productos o características, como esas cosas son repetitivas pero no hay una forma simple de "abstraerlas" sin tener que aprender javascript, hay paginas que nos muestran distintos fragmentos de HTML para componentes comunes. En ingles le llaman cheatsheets, acá hay una de bootstrap que es muy útil:

Bootstrap Cheatsheet

Hace click en el componente que querés ver y te va a mostrar el HTML a la izquierda y como se ve a la derecha.