Diferencia entre revisiones de «Usuario:Juanda/bootstrap/Themes»
De WikiEducator
< Usuario:Juanda | bootstrap
(Página creada con ' ===Bower=== *Es un gestor de paquetes de Front End. *Depende de nodejs y de npm (node package manager). sudo apt-get install npm') |
|||
| Línea 1: | Línea 1: | ||
| + | {{Usuario:juanda/bootstrap/nav }} | ||
| + | {{#widget:Slides}} {{MiTitulo| Twitter Bootstrap}} | ||
| + | <div class="slides layout-regular template-default"> | ||
| + | <div class="slide"> | ||
| + | |||
| + | = Crear un theme = | ||
| + | </div> | ||
| + | |||
| + | <div class="slide"> | ||
| + | === Requerimientos previos === | ||
| + | *node.js | ||
| + | *npm (Viene con node desde la v0.6.3) | ||
| + | *git (prerequisito for bower) | ||
| + | *[http://bower.io/ Bower], gestor de paquetes para web | ||
| + | *[http://gruntjs.com/ Grunt], gestor de tareas de javascript] | ||
| + | *Conocimiento básico de [http://lesscss.org/ less] | ||
| + | npm install -g bower | ||
| + | grunt-cli | ||
| + | npm install -g grunt-cli | ||
| + | a very light understanding of LESSs | ||
| + | </div> | ||
| + | |||
| + | <div class="slide"> | ||
| + | === ¿Qué es Twitter Bootstrap? === | ||
| + | *Es el framework de Twitter que permite crear interfaces web con CSS y Javascript | ||
| + | *The most popular front-end framework for developing responsive, mobile first projects on the web. | ||
| + | </div> | ||
| + | |||
| + | <div class="slide"> | ||
| + | ===Versiones de Bootstrap=== | ||
| + | *La versión 3 salió el 19 de Agosto de 2013, [http://blog.getbootstrap.com/2013/08/19/bootstrap-3-released/ ver blog]. | ||
| + | *Ojo con documentación, consultas en stackoverflow, etc. hay mucha más información de Bootstrap 2. ¡Debemos mirar con cuidado! | ||
| + | </div> | ||
| + | |||
| + | <div class="slide"> | ||
| + | ===Descargas de Bootstrap=== | ||
| + | *Compilada y comprimida. Sin documentos ni fuentes originales. | ||
| + | *Sin compilar ni comprimir. Los fuentes de CSS están en Less. | ||
| + | *Sin compilar ni comprimir. Los fuentes de CSS están en Sass. | ||
| + | </div> | ||
| + | |||
| + | <div class="slide"> | ||
| + | ===Documentación de Bootstrap=== | ||
| + | *[http://getbootstrap.com/ Página web del proyecto] | ||
| + | *[http://librosweb.es/bootstrap_3/ Documentación traducida al español] | ||
| + | |||
| + | </div> | ||
| + | |||
| + | <div class="slide"> | ||
| + | ===Utilidad de Bootstrap=== | ||
| + | *Tenemos dos opciones para utilizar Bootstrap: | ||
| + | *Utilizar exclusivamente su sistema de rejilla (grid) para colocar elementos y responsividad. | ||
| + | *Utilizar su diseño: botones, labels, etc así como su librería de javascript (basada en jQuery). | ||
| + | </div> | ||
| + | |||
| + | <div class="slide"> | ||
| + | ===Diseño con Bootstrap=== | ||
| + | *Modificaremos a partir de los ficheros less existentes. | ||
| + | *Crearemos themes. | ||
| + | *También podremos optar por descargar themes existentes (muchos de pago). | ||
| + | |||
| + | </div> | ||
| + | </div> | ||
| + | |||
| + | |||
| + | |||
===Bower=== | ===Bower=== | ||
Revisión de 09:51 24 feb 2014
Bower
- Es un gestor de paquetes de Front End.
- Depende de nodejs y de npm (node package manager).
sudo apt-get install npm
