Probas en JavaScript

Temos a web estática de i-rochiño e alí aprendemos como ir creando sitios web cada vez máis dinámicos. Nalgúns casos precisamos facer pequenas probas e ter que crear carpeta cos seus .html, .css, .js non paga a pena. Os navegadores facilítannos o noso traballo.

O teu traballo:

• En Firefox teclea F12 ou co botón da dereita clic en Inspeccionar.
• Escolle a lapela chamada Consola.
• Teclea algo así como alert(3+3) e despois intro
• Agora imos usar o navegador como un “terminal de JS”: teclea console.log(4+4)
• O navegador pode incluso ser un sinxelo editor de texto se premes Ctrl B e lembras que para executar podes darlle ao triángulo Ejeutar ou o atallo Ctrl Intro á vez.
• Fai algunhas probas para xogar cos tipos de datos:
  • • console.log("5*5")
    • console.log("5" + "1")
    • console.log("4+4" + 5 + 5) //olliño aquí
    • console.log("Hoxe é día.. " + 4)
• Consultamos aquí para poñer comentarios.

JavaScript aos poucos

As nosas páxinas web só mostran contido, presentación bonita pero non interacionan co usuario. Só os formularios fan algo así pero non lles sacamos moito partido.

Neste tema imos aprender un nadita de programación. A idea é que vexades como vai eso de teclear código, palabras chave, sintaxe, erros chorras que te amargan unha tarde.. en fin, o normal.

O teu traballo:

Crea un repositorio en GitHub que se chame JavaScript. Pon a ligazón a este repositorio no teu blog.

• Vai escollendo o editor co que queres traballar. Procura aprender a usalo: aforras moito tempo!!!
• Estamos de mudanza. Neste tema deixamos WordPress. Terás que facer tooodas as tarefas que se propoñen na web estática de i-rochiño.
• A nosa referencia neste tema serán as páxinas de mozilla.
• En que navegador funciona? Que é ECMAScript?

Tuneado de Bootstrap

Que tal se usamos o noso Bootstrap como plantilla e cambiamos de tema por completo?

O teu traballo:

Coa información deste vídeo fai outro sitio web e que quede serio e interesante.

Posibilidades en Bootstrap

Que son os badgets? Para que se usa o pagination? Pulgarcito deixaba breadcrumbs? Viran os spinners? Bootstrap ten a posibilidade de usar clases prefabricadas para mellorar o noso sitio.

O teu traballo:

Buscando aquí e alá inclúe no teu sitio web estas cousiñas e demostra que sabes usalas, lembra persoalizar con coloríns.

Bootstrap con carrusel

Photo by Jeff Sheldon on Unsplash

Imos dar un pasiño máis. Queremos que a nosa páxina web en Bootstrap teña unha pequena presentación na que ao facérmonos clic  vaian pasando as imaxes, como  nesta web que atopei.  Botade un ollo á que sempre usamos de w3schools,  na oficial ou tamén esta é chula.

O teu traballo:

Fai unha coleción de fotos con boa resolución de recetas de cociña.

• Usa GIMP para poñelas dun tamaño axeitado: Menú Imagen/Escalar imagen… Non gardedes, mellor: Menu Archivo/Exportar como…
  
• Para quitar o fondo branco esta entrada antiga

O teu index.html ten que ter un carrusel.

Insire   o código deste gist e modifícao para que quede estupendo na túa web.