@milena_suarezl 

@manvedu 

@nathalyvillamor 

@davsket 

@buritica 

@kuryaki 

@agar3s 

@sergiosinuco 

@hugozap 

@dernestoe 

Mentores

DESARROLLO WEB

Ayudar a tu compañer@ es ayudarte a ti mism@

1. Descargar el repositorio

https://github.com/coljs/taller-intro-ladies-js 

2. Personaliza tu tarjeta!

<html>
 <head> 
  <title>BIENVENIDOS A BOGOTAJS - LADIESJS</title>
 </head>
 <body>
   Que quieres mostrar?
 </body>
</html>

HyperText Markup Language (lenguaje de marcas de hipertexto)

3. A darle animación a tu tarjeta 

Hojas de Estilo en Cascada (Cascading Style Sheets)

<html>
 <head> 
  <title>BIENVENIDOS A BOGOTAJS - LADIESJS</title>
  <link rel="stylesheet" type="text/css" href="css/main.css">
 </head>
 <body>
   <h1 class="name">Grace Murray Hopper</h1>
 </body>
</html>

Selectores css

Se utiliza para seleccionar todos los elementos de la página.

*{
 // tus estilos globales
}

p {

}

.class {

}

div p {

}

Javascript

Eventos en Javascript

$('#biography-btn').on('click', function () {
  $('#biography-cont').toggleClass('hidden')
})

$('#contact-btn').on('click', function () {
  $('#contact-form').toggleClass('hidden')
})

Son cosas que sucenden con los elementos HTML, cada elemento o define su propia lista de posibles eventos que se le pueden asignar.

http://hugozap.com/guia-principiantes-js/

http://librosweb.es/libro/javascript/capitulo_6/modelo_basico_de_eventos_2.html

Es posible lograr aplicaciones web capaces de actualizarse continuamente sin tener que volver a cargar la página completa. Esto crea aplicaciones más rápidas y con mejor respuesta a las acciones del usuario.

Contáctame

$form.on('submit', function (e) 
{  e.preventDefault()
  $.post($form.attr('action'), {
      email: $('#email').val(),
      text: $('#text').val()
    })
    .then(function (res) {
      alert(res.message)
    }, function (err) {
      console.error(err)
      alert('Error sending the form.')
    })
})

4. Publicar tu tarjeta en la web

https://neocities.org/browse

4. Ver tu tarjeta publicada en la web