Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Programación Web - Club de Programación CMD 2014

Programación Web - Club de Programación CMD 2014

Charla introductoria a la web y la programación para el Club de Programación en el Centro Metropolitano de Diseño de Buenos Aires 2014 - Guión: https://gist.github.com/inkel/85b0ff564af6c002919b

Leandro López

December 06, 2014
Tweet

More Decks by Leandro López

Other Decks in Technology

Transcript

  1. Qué es la Internet

  2. WWW

  3. World
 Wide
 Web

  4. @inkel Leandro López" Programando la web desde 2000" Actualmente para

    Citrusbyte" Organizador de RubyConf Argentina" Coach de las Punchgirls
  5. Cliente" Servicio" Servidor √" √" √

  6. URL" HTTP(S)" HTML" CSS

  7. http://google.com/search?q=ruby+inkel Esquema
 (servicio) Dominio (servidor)
 y puerto Ruta Consulta

  8. URL" HTTP(S)" HTML" CSS √" ! !

  9. None
  10. URL" HTTP(S)" HTML" CSS √" √" !

  11. <!doctype html> <html> <head> <title>Club de Programación</title> </head> <body> <h1>Club

    de Programación</h1> <p>Gracias por venir.</p> <p> <a href=“https://www.ruby-lang.org/es/”> Ruby Language </a> </p> </body> </html>
  12. None
  13. <!doctype html> <html> <head> <title>Club de Programación</title> </head> <body> <h1>Club

    de Programación</h1> <p>Gracias por venir.</p> <p> <a href=“https://www.ruby-lang.org/es/”> Ruby Language </a> </p> </body> </html>
  14. <!doctype html> <html> <head> <title>Club de Programación</title> </head> <body> <h1>Club

    de Programación</h1> <p>Gracias por venir.</p> <p> <a href=“https://www.ruby-lang.org/es/”> Ruby Language </a> </p> </body> </html>
  15. <!doctype html> <html> <head> <title>Club de Programación</title> </head> <body> <h1>Club

    de Programación</h1> <p>Gracias por venir.</p> <p> <a href=“https://www.ruby-lang.org/es/”> Ruby Language </a> </p> </body> </html>
  16. <!doctype html> <html> <head> <title>Club de Programación</title> </head> <body> <h1>Club

    de Programación</h1> <p>Gracias por venir.</p> <p> <a href=“https://www.ruby-lang.org/es/”> Ruby Language </a> </p> </body> </html>
  17. <!doctype html> <html> <head> <title>Club de Programación</title> </head> <body> <h1>Club

    de Programación</h1> <p>Gracias por venir.</p> <p> <a href=“https://www.ruby-lang.org/es/”> Ruby Language </a> </p> </body> </html>
  18. URL" HTTP(S)" HTML" CSS √" √" √"

  19. body { font-family: sans-serif; color: black; background: #fff; } a

    { color: lightblue; }
  20. URL" HTTP(S)" HTML" CSS √" √" √" √

  21. GET /hola HTTP/1.1 ! Verbo Ruta Versión

  22. HTTP/1.1 200 OK Content-Type: text/plain Content-Length: 13 ¡Hola, Mundo!

  23. 1xx Información 2xx Éxito" 3xx Redirección" 4xx Error del cliente"

    5xx Error del servidor"
  24. 200 OK 301 Movido" 302 Movido" 404 No encontrado" 500

    Explotó el servidor"
  25. HTTP/1.1 200 OK Content-Type: text/plain Content-Length: 13 ¡Hola, Mundo!

  26. text/plain text/html text/css image/jpg image/png text/javascript

  27. HTTP/1.1 200 OK Content-Type: text/plain Content-Length: 13 ¡Hola, Mundo!

  28. POST /hola HTTP/1.1 Content-Type: application/x-www-form- urlencode Content-Length: 10 name=inkel

  29. HTTP/1.1 200 OK Content-Type: text/plain Content-Length: 13 ¡Hola, inkel!

  30. Sinatra http://www.sinatrarb.com/

  31. require "sinatra" ! get "/hola" do "¡Hola, Mundo!\r\n" end !

    post "/hola" do name = params[:name] "¡Hola, #{name}!\r\n" end
  32. The Guide to Cuba http://theguidetocuba.io/

  33. require "cuba" ! Cuba.define do on "hola" do on get

    do res.write "¡Hola, Mundo!\r\n" end ! on post, param("name") do |name| res.write "¡Hola, #{name}!\r\n" end end end
  34. “No hay preguntas tontas, sino tontos que no preguntan”

  35. twitter.com/inkel github.com/inkel