SlideShare une entreprise Scribd logo
1  sur  27
Télécharger pour lire hors ligne
Programación para Adolescentes (Online)
Acerca del curso
• 24 clases de 2 horas
• Lunes, miércoles y viernes
• 18:30 a 20:30
• Zoom y Whatsapp
• Clases y material en la plataforma
¿Qué vamos a aprender?
• Que hace un desarrollador Frontend
• Entender las tecnologías que impulsan Internet
• Usar HTML para construir una página
• Usar CSS para cambiar la apariencia de una página
• Aprender los fundamentos de la programación
• Usar JavaScript para programar y dar vida a una página web
• Proyecto final
Cómo tener éxito en el curso
• Asistir
• Tomar notas
• Usar la plataforma
• Practicar lo que vemos en clase
• Trabajar en equipo
• Hacer muchas preguntas
Cómo funciona Internet
Red
Red
Switch de red
Switch de red
Redes interconectadas
Internet
Modelo cliente - servidor
servidor internet
clientes
Qué es un
servidor web
Página web -
Sitio web
Navegadores
web
URL
https://www.example.com/index.html
https://www.example.com/index.html
protocolo://subdominio.dominio.extensión
(dominio superior)/recurso.tipo_de_archivo
Protocolos de internet
216.124.128.7 128.104.202.32
Protocolos de internet
Ipv4
256.127.54.1
Ipv6
3648:0a00:1567:0200:ff00:0042:4529
HTTP
HiperText Transfer Protocol
Responsable de transferir paginas, imágenes
y archivos al navegador desde el servidor
Estático VS Dinámico
web page, web site, y web app
Estático
Información fija, permanente
Sin funcionalidades
complejas
Propósitos específicos
Muy livianas
Dinámico
Utilizan un backend que
genera la página de forma
dinámica según variables
Muy interactivas
Responden según el usuario
Dominio VS Hosting
Dominio
Nombre que encontramosen
la URL
Asociado a una IP que apunta
a un hosting
Hosting
Servidor donde reside y se
sirve la página web que
apunta el dominio
Principios del diseño web
Accesibilidad
Funcionalidad
Contraste
Universalidad
Interfaz amigable y memorable
UX
Brindar una experiencia al
usuario que sea agradable y
pueda cumplir con sus
objetivos
Objetivo y audiencia
Un sitio web debe tener un propósitoy satisfacer una
necesidad de la sociedad a la que apunta.
Ese es su público objetivo y a partir de él el equipo de
desarrollo genera requerimientos y historias de usuario para
desarrollar funcionalidades e interfaces.
HTML – CSS - JavaScript
Internet
¿Qué es internet?
¿Qué es un servidor web y cómo funciona?
Página web y sitio web
Web hosting
Navegadores web
Protocolos de internet
HTTP
Las tecnologías fundamentales de la web
<html>
<body>
<h1>Hola Mundo</h1>
<h2>Hola otra vez</h2>
<p>Bienvenidos todos</p>
</body>
</html>

Contenu connexe

Similaire à Programación para adolescentes online

Pagina web y cazatesoro 2013
Pagina web y cazatesoro 2013Pagina web y cazatesoro 2013
Pagina web y cazatesoro 2013David Fandinho
 
Mvc + html5 + css3
Mvc + html5 + css3Mvc + html5 + css3
Mvc + html5 + css3Marc Rubiño
 
Diseño Responsivo en Drupal: ¿Qué hay de Nuevo?
Diseño Responsivo en Drupal: ¿Qué hay de Nuevo?Diseño Responsivo en Drupal: ¿Qué hay de Nuevo?
Diseño Responsivo en Drupal: ¿Qué hay de Nuevo?Rob Montero
 
Tecnologia web
Tecnologia webTecnologia web
Tecnologia webMeli Vidal
 
Pagina web y cazatesoro
Pagina web y cazatesoroPagina web y cazatesoro
Pagina web y cazatesoroDavid Fandinho
 
Aplicaciones Web SPA con WebAPI y TypeScript
Aplicaciones Web SPA con WebAPI y TypeScriptAplicaciones Web SPA con WebAPI y TypeScript
Aplicaciones Web SPA con WebAPI y TypeScriptLuis Guerrero
 
GC-F-004-V08_AP1-AA1-EV01_EV02_Transversal Formulación del proyecto multimedi...
GC-F-004-V08_AP1-AA1-EV01_EV02_Transversal Formulación del proyecto multimedi...GC-F-004-V08_AP1-AA1-EV01_EV02_Transversal Formulación del proyecto multimedi...
GC-F-004-V08_AP1-AA1-EV01_EV02_Transversal Formulación del proyecto multimedi...IvanLasso3
 
Diseño Web: Qué necesitamos para empezar?
Diseño Web: Qué necesitamos para empezar?Diseño Web: Qué necesitamos para empezar?
Diseño Web: Qué necesitamos para empezar?Karla Arosemena
 
Html5 y otras yerbas
Html5 y otras yerbasHtml5 y otras yerbas
Html5 y otras yerbasPeter Concha
 
Html5 y otras yerbas
Html5 y otras yerbasHtml5 y otras yerbas
Html5 y otras yerbasAvanet
 
Programación Reactiva, Javascript Isomorfo y Meteorjs !
Programación Reactiva, Javascript Isomorfo y Meteorjs !Programación Reactiva, Javascript Isomorfo y Meteorjs !
Programación Reactiva, Javascript Isomorfo y Meteorjs !ouuyeah
 
Diseño de Páginas Web
Diseño de Páginas WebDiseño de Páginas Web
Diseño de Páginas Web8vivi8
 
La importancia del frontend y backend en un proyecto
La importancia del frontend y backend en un proyectoLa importancia del frontend y backend en un proyecto
La importancia del frontend y backend en un proyectoAptitud Emprendedora
 
Desarrollo web con html5 + css3 + j script + asp mvc4 (vstudio 2012)
Desarrollo web con html5 + css3 + j script + asp mvc4 (vstudio 2012)Desarrollo web con html5 + css3 + j script + asp mvc4 (vstudio 2012)
Desarrollo web con html5 + css3 + j script + asp mvc4 (vstudio 2012)Pedrito Abiel
 
Modulo1-Presentaciones-parte01.1.ppt
Modulo1-Presentaciones-parte01.1.pptModulo1-Presentaciones-parte01.1.ppt
Modulo1-Presentaciones-parte01.1.pptssuser73f459
 
Taller de Servicios WEB usando JAVA
Taller de Servicios WEB usando JAVATaller de Servicios WEB usando JAVA
Taller de Servicios WEB usando JAVAEdwin Maraví
 
31paginas w3oi taniajuarez
31paginas w3oi taniajuarez31paginas w3oi taniajuarez
31paginas w3oi taniajuarezTANIAJUAREZROJO
 

Similaire à Programación para adolescentes online (20)

Pagina web y cazatesoro 2013
Pagina web y cazatesoro 2013Pagina web y cazatesoro 2013
Pagina web y cazatesoro 2013
 
Mvc + html5 + css3
Mvc + html5 + css3Mvc + html5 + css3
Mvc + html5 + css3
 
Diseño Responsivo en Drupal: ¿Qué hay de Nuevo?
Diseño Responsivo en Drupal: ¿Qué hay de Nuevo?Diseño Responsivo en Drupal: ¿Qué hay de Nuevo?
Diseño Responsivo en Drupal: ¿Qué hay de Nuevo?
 
Tecnologia web
Tecnologia webTecnologia web
Tecnologia web
 
Pagina web y cazatesoro
Pagina web y cazatesoroPagina web y cazatesoro
Pagina web y cazatesoro
 
Aplicaciones Web SPA con WebAPI y TypeScript
Aplicaciones Web SPA con WebAPI y TypeScriptAplicaciones Web SPA con WebAPI y TypeScript
Aplicaciones Web SPA con WebAPI y TypeScript
 
GC-F-004-V08_AP1-AA1-EV01_EV02_Transversal Formulación del proyecto multimedi...
GC-F-004-V08_AP1-AA1-EV01_EV02_Transversal Formulación del proyecto multimedi...GC-F-004-V08_AP1-AA1-EV01_EV02_Transversal Formulación del proyecto multimedi...
GC-F-004-V08_AP1-AA1-EV01_EV02_Transversal Formulación del proyecto multimedi...
 
Diseño Web: Qué necesitamos para empezar?
Diseño Web: Qué necesitamos para empezar?Diseño Web: Qué necesitamos para empezar?
Diseño Web: Qué necesitamos para empezar?
 
Html5 y otras yerbas
Html5 y otras yerbasHtml5 y otras yerbas
Html5 y otras yerbas
 
Html5 y otras yerbas
Html5 y otras yerbasHtml5 y otras yerbas
Html5 y otras yerbas
 
Programación Reactiva, Javascript Isomorfo y Meteorjs !
Programación Reactiva, Javascript Isomorfo y Meteorjs !Programación Reactiva, Javascript Isomorfo y Meteorjs !
Programación Reactiva, Javascript Isomorfo y Meteorjs !
 
Diseño de Páginas Web
Diseño de Páginas WebDiseño de Páginas Web
Diseño de Páginas Web
 
Páginas Web
Páginas WebPáginas Web
Páginas Web
 
Cursopaginas web2013
Cursopaginas web2013Cursopaginas web2013
Cursopaginas web2013
 
Exposicion
ExposicionExposicion
Exposicion
 
La importancia del frontend y backend en un proyecto
La importancia del frontend y backend en un proyectoLa importancia del frontend y backend en un proyecto
La importancia del frontend y backend en un proyecto
 
Desarrollo web con html5 + css3 + j script + asp mvc4 (vstudio 2012)
Desarrollo web con html5 + css3 + j script + asp mvc4 (vstudio 2012)Desarrollo web con html5 + css3 + j script + asp mvc4 (vstudio 2012)
Desarrollo web con html5 + css3 + j script + asp mvc4 (vstudio 2012)
 
Modulo1-Presentaciones-parte01.1.ppt
Modulo1-Presentaciones-parte01.1.pptModulo1-Presentaciones-parte01.1.ppt
Modulo1-Presentaciones-parte01.1.ppt
 
Taller de Servicios WEB usando JAVA
Taller de Servicios WEB usando JAVATaller de Servicios WEB usando JAVA
Taller de Servicios WEB usando JAVA
 
31paginas w3oi taniajuarez
31paginas w3oi taniajuarez31paginas w3oi taniajuarez
31paginas w3oi taniajuarez
 

Plus de Ronald Alexander Rivero (12)

0X0D - Responsive
0X0D - Responsive0X0D - Responsive
0X0D - Responsive
 
0x08-CSS-flexbox.pdf
0x08-CSS-flexbox.pdf0x08-CSS-flexbox.pdf
0x08-CSS-flexbox.pdf
 
0x06-css_box_model.pdf
0x06-css_box_model.pdf0x06-css_box_model.pdf
0x06-css_box_model.pdf
 
0x06-CSS-texto.pdf
0x06-CSS-texto.pdf0x06-CSS-texto.pdf
0x06-CSS-texto.pdf
 
0x04-HTML_FORMS.pdf
0x04-HTML_FORMS.pdf0x04-HTML_FORMS.pdf
0x04-HTML_FORMS.pdf
 
0x03-HTML_elementos.pdf
0x03-HTML_elementos.pdf0x03-HTML_elementos.pdf
0x03-HTML_elementos.pdf
 
0x02-HTML.pdf
0x02-HTML.pdf0x02-HTML.pdf
0x02-HTML.pdf
 
0x01-HTML_intro.pdf
0x01-HTML_intro.pdf0x01-HTML_intro.pdf
0x01-HTML_intro.pdf
 
static libraries and dynamic libraries
static libraries and dynamic librariesstatic libraries and dynamic libraries
static libraries and dynamic libraries
 
File permissions symbolic_notation
File permissions symbolic_notationFile permissions symbolic_notation
File permissions symbolic_notation
 
Twos complement
Twos complementTwos complement
Twos complement
 
Low level programming: C libraries
Low level programming: C librariesLow level programming: C libraries
Low level programming: C libraries
 

Dernier

Uses of simple past and time expressions
Uses of simple past and time expressionsUses of simple past and time expressions
Uses of simple past and time expressionsConsueloSantana3
 
LA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdf
LA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdfLA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdf
LA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdfNataliaMalky1
 
Los Nueve Principios del Desempeño de la Sostenibilidad
Los Nueve Principios del Desempeño de la SostenibilidadLos Nueve Principios del Desempeño de la Sostenibilidad
Los Nueve Principios del Desempeño de la SostenibilidadJonathanCovena1
 
BIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdf
BIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdfBIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdf
BIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdfCESARMALAGA4
 
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdfOswaldoGonzalezCruz
 
FICHA DE MONITOREO Y ACOMPAÑAMIENTO 2024 MINEDU
FICHA DE MONITOREO Y ACOMPAÑAMIENTO  2024 MINEDUFICHA DE MONITOREO Y ACOMPAÑAMIENTO  2024 MINEDU
FICHA DE MONITOREO Y ACOMPAÑAMIENTO 2024 MINEDUgustavorojas179704
 
libro para colorear de Peppa pig, ideal para educación inicial
libro para colorear de Peppa pig, ideal para educación iniciallibro para colorear de Peppa pig, ideal para educación inicial
libro para colorear de Peppa pig, ideal para educación inicialLorenaSanchez350426
 
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJOTUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJOweislaco
 
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptxPPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptxOscarEduardoSanchezC
 
Metabolismo 3: Anabolismo y Fotosíntesis 2024
Metabolismo 3: Anabolismo y Fotosíntesis 2024Metabolismo 3: Anabolismo y Fotosíntesis 2024
Metabolismo 3: Anabolismo y Fotosíntesis 2024IES Vicent Andres Estelles
 
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptxLINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptxdanalikcruz2000
 
Estas son las escuelas y colegios que tendrán modalidad no presencial este lu...
Estas son las escuelas y colegios que tendrán modalidad no presencial este lu...Estas son las escuelas y colegios que tendrán modalidad no presencial este lu...
Estas son las escuelas y colegios que tendrán modalidad no presencial este lu...fcastellanos3
 
PINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).ppt
PINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).pptPINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).ppt
PINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).pptAlberto Rubio
 

Dernier (20)

Uses of simple past and time expressions
Uses of simple past and time expressionsUses of simple past and time expressions
Uses of simple past and time expressions
 
VISITA À PROTEÇÃO CIVIL _
VISITA À PROTEÇÃO CIVIL                  _VISITA À PROTEÇÃO CIVIL                  _
VISITA À PROTEÇÃO CIVIL _
 
Aedes aegypti + Intro to Coquies EE.pptx
Aedes aegypti + Intro to Coquies EE.pptxAedes aegypti + Intro to Coquies EE.pptx
Aedes aegypti + Intro to Coquies EE.pptx
 
TL/CNL – 2.ª FASE .
TL/CNL – 2.ª FASE                       .TL/CNL – 2.ª FASE                       .
TL/CNL – 2.ª FASE .
 
LA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdf
LA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdfLA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdf
LA OVEJITA QUE VINO A CENAR CUENTO INFANTIL.pdf
 
Sesión La luz brilla en la oscuridad.pdf
Sesión  La luz brilla en la oscuridad.pdfSesión  La luz brilla en la oscuridad.pdf
Sesión La luz brilla en la oscuridad.pdf
 
Los Nueve Principios del Desempeño de la Sostenibilidad
Los Nueve Principios del Desempeño de la SostenibilidadLos Nueve Principios del Desempeño de la Sostenibilidad
Los Nueve Principios del Desempeño de la Sostenibilidad
 
BIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdf
BIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdfBIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdf
BIOLOGIA_banco de preguntas_editorial icfes examen de estado .pdf
 
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
 
La luz brilla en la oscuridad. Necesitamos luz
La luz brilla en la oscuridad. Necesitamos luzLa luz brilla en la oscuridad. Necesitamos luz
La luz brilla en la oscuridad. Necesitamos luz
 
FICHA DE MONITOREO Y ACOMPAÑAMIENTO 2024 MINEDU
FICHA DE MONITOREO Y ACOMPAÑAMIENTO  2024 MINEDUFICHA DE MONITOREO Y ACOMPAÑAMIENTO  2024 MINEDU
FICHA DE MONITOREO Y ACOMPAÑAMIENTO 2024 MINEDU
 
libro para colorear de Peppa pig, ideal para educación inicial
libro para colorear de Peppa pig, ideal para educación iniciallibro para colorear de Peppa pig, ideal para educación inicial
libro para colorear de Peppa pig, ideal para educación inicial
 
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJOTUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
 
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptxPPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
 
Metabolismo 3: Anabolismo y Fotosíntesis 2024
Metabolismo 3: Anabolismo y Fotosíntesis 2024Metabolismo 3: Anabolismo y Fotosíntesis 2024
Metabolismo 3: Anabolismo y Fotosíntesis 2024
 
Tema 7.- E-COMMERCE SISTEMAS DE INFORMACION.pdf
Tema 7.- E-COMMERCE SISTEMAS DE INFORMACION.pdfTema 7.- E-COMMERCE SISTEMAS DE INFORMACION.pdf
Tema 7.- E-COMMERCE SISTEMAS DE INFORMACION.pdf
 
PPTX: La luz brilla en la oscuridad.pptx
PPTX: La luz brilla en la oscuridad.pptxPPTX: La luz brilla en la oscuridad.pptx
PPTX: La luz brilla en la oscuridad.pptx
 
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptxLINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
 
Estas son las escuelas y colegios que tendrán modalidad no presencial este lu...
Estas son las escuelas y colegios que tendrán modalidad no presencial este lu...Estas son las escuelas y colegios que tendrán modalidad no presencial este lu...
Estas son las escuelas y colegios que tendrán modalidad no presencial este lu...
 
PINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).ppt
PINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).pptPINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).ppt
PINTURA ITALIANA DEL CINQUECENTO (SIGLO XVI).ppt
 

Programación para adolescentes online