Aprende Desarrollo Web Front End
El Desarrollo Web Front End implica diseño web y la construcción de sitios que las personas usan todos los días. Es un conjunto de habilidades integral que utilizan casi todos los negocios del mundo que necesitan un sitio web para comunicarse con sus clientes. Además, es uno de nuestros temas más populares aquí en Treehouse, y uno que hemos estado enseñando durante más tiempo.
En esta Pista, aprenderás a construir sitios web hermosos e interactivos aprendiendo los fundamentos de HTML, CSS y JavaScript — tres lenguajes de codificación comunes en los que se construyen todos los sitios web modernos. Al final de esta pista, tendrás todas las habilidades necesarias para construir tus propios sitios web o incluso iniciar una carrera con una de las miles de empresas que tienen un sitio web.
-
Un salario de nivel inicial para las tecnologías cubiertas en esta ruta es aproximadamente $51,000 / año en promedio.
-
Algunas empresas que utilizan estas tecnologías regularmente incluyen: Google, Facebook, Yahoo, eBay, Amazon y Treehouse
¿Listo para comenzar a aprender?
Treehouse ofrece una prueba gratuita de 7 días para estudiantes nuevos. Obtén acceso a miles de horas de contenido. Aprende a programar, consigue el trabajo de tus sueños.
Comienza Tu Prueba Gratuita
-
Curso
- 1
- 2
- 3
Introducción a HTML y CSS
Comienza a crear páginas web con HTML y CSS, los bloques de construcción básicos del desarrollo web. HTML, o HyperText Markup Language, es un conjunto estándar de etiquetas que usarás para indicarle al navegador web cómo está estructurado el contenido de tus páginas web y aplicaciones. Usa CSS, u Hojas de estilo en cascada, para seleccionar etiquetas HTML e indicarle al navegador qué aspecto debe tener tu contenido. Ya sea que estés programando por diversión o planeando comenzar una carrera en desarrollo web, aprender HTML y CSS es un excelente lugar para empezar.
-
Curso
- 1
- 2
- 3
- 4
Conceptos Básicos de HTML
Aprende HTML (HyperText Markup Language), el lenguaje común de todos los sitios web. HTML describe la estructura básica y el contenido de una página web. Si quieres construir un sitio web o una aplicación web, necesitarás saber HTML.
-
Curso
- 1
- 2
- 3
- 4
Conceptos Básicos de CSS
En este curso, vamos a aprender los conceptos básicos de CSS, una de las tecnologías principales para diseñar y construir sitios web y aplicaciones. No importa qué tipo de sitio web o aplicación web quieras construir, tendrás que usar CSS.
-
Curso
- 1
- 2
- 3
- 4
Diseño CSS
En este curso, aprenderemos técnicas para tener mejor control sobre nuestros diseños de layouts CSS. Cubriremos cómo el Modelo de Caja CSS impacta la presentación de cada elemento HTML, aprenderemos a controlar la posición de cada elemento en la pantalla, e incluso comenzaremos a ajustar nuestros diseños para diferentes tamaños de pantalla y entornos.
-
Curso
- 1
- 2
- 3
- 4
Mejora del Diseño con CSS
En este curso, vamos a aprender propiedades CSS para mejorar el diseño visual. Cubriremos varias propiedades para estilos de texto, incluyendo la carga de fuentes web desde recursos externos. Aprenderemos técnicas para convertir nuestras cajas CSS en más que solo rectángulos. Y finalmente, aprenderemos algunos efectos visuales realmente geniales usando filtros y degradados CSS.
-
35 minTaller
Depuración de CSS con Chrome DevTools
En este taller, exploraremos la herramienta más útil y eficiente para depurar CSS: Chrome Developer Tools.
Visto -
Curso
- 1
Diseño de Diseño CSS Móvil Primero
En este curso, obtendrás práctica práctica usando técnicas de diseño CSS como un Reinicio CSS con Normalize, un contenedor de diseño, un pie de página adhesivo y contenido centrado con un encabezado de ancho completo.
-
Curso
- 1
- 2
- 3
Diseño de Diseño CSS Flexbox
Flexbox es un conjunto de propiedades CSS que te da una forma flexible de diseñar contenido. Con flexbox puedes cambiar la dirección, alineación, tamaño y orden de elementos, independientemente de su tamaño y orden original en HTML. ¡Incluso puedes estirar y encoger elementos y distribuir espacio, todo con solo unas pocas líneas de CSS!
-
Curso
- 1
- 2
Tablas HTML
La web está llena de texto e imágenes, pero también está llena de información como puntuaciones deportivas a lo largo de los años, listas de nombres y direcciones de correo electrónico de empleados, o información nutricional de tus alimentos favoritos. Las tablas HTML permiten mostrar información en lo que se conoce comúnmente como datos tabulares, que es información almacenada en una estructura similar a una tabla de columnas y filas. En general, cualquier cosa que podrías poner en una hoja de cálculo podría ir en una tabla. Hay muchos casos de uso para una tabla, por lo que es importante agregarlas a tus habilidades porque es un método muy común para mostrar información.
-
Curso
- 1
- 2
- 3
Formularios HTML
La web es un medio de comunicación bidireccional. Hay muchos elementos HTML para mostrar datos y producir resultados, y a la inversa, también hay muchos elementos HTML para aceptar entrada. Aceptar entrada del usuario significa crear formularios web. En este curso, aprenderemos sobre todos los elementos de formulario más importantes que los profesionales web utilizan diariamente.
-
Curso
- 1
- 2
- 3
Selectores CSS
En este curso corto, vamos a ir más allá de los conceptos selectores básicos cubiertos en Conceptos Básicos de CSS. Además de las formas comunes de seleccionar elementos con selectores de tipo, ID y clase, podemos dirigirnos a elementos basados en sus atributos, posición en el documento HTML, incluso su relación con otros elementos.
-
Curso
- 1
- 2
Accesibilidad para Desarrolladores Web
La accesibilidad es un proceso que considera específicamente las necesidades de personas con discapacidades.
-
2 minInstrucción
Introducción a Git
Un sistema de control de versiones como Git puede evitar que pierdas tu trabajo y ayudarte a colaborar con otros....(continúa leyendo)
Visto -
Curso
- 1
- 2
- 3
Diseño de Cuadrícula CSS
La Maquetación CSS Grid proporciona una forma integrada y más eficiente de diseñar maquetaciones basadas en cuadrículas en el navegador. Trae un nuevo conjunto de propiedades, funciones y unidades flexibles que te permiten controlar la ubicación exacta y el tamaño de los componentes de la cuadrícula.
-
Curso
- 1
- 2
- 3
- 4
Fundamentos de JavaScript
JavaScript es un lenguaje de programación que impulsa la web: desde el diseño de la interfaz de usuario front-end hasta la programación backend del lado del servidor, encontrará JavaScript en cada etapa de un sitio web y una aplicación web. En este curso, aprenderá los conceptos fundamentales de programación y la sintaxis del lenguaje de programación JavaScript.
-
Curso
- 1
- 2
Números en JavaScript
Los números están en todas partes en la programación. Los usas para rastrear la puntuación de un jugador en un juego, calcular el costo de envío de un producto o contar el número de veces que se hace clic en un botón "Me gusta" en una página. En este curso, aprenderás a usar números para tareas útiles en tus programas de JavaScript, incluyendo hacer matemáticas, convertir cadenas a números, generar números aleatorios y más.
-
Curso
- 1
- 2
- 3
Funciones de JavaScript
Las funciones de JavaScript te permiten crear fragmentos de código reutilizables. Hacen que la programación sea más rápida, fácil y menos propensa a errores. También son uno de los conceptos esenciales en la programación de JavaScript.
-
Curso
- 1
- 2
Bucles en JavaScript
Los bucles son una forma de repetir código -- son útiles para tareas repetitivas. Los bucles se usan frecuentemente para acciones que necesitan ejecutarse un número particular de veces o hasta que se cumpla una cierta condición.
-
Curso
- 1
- 2
- 3
Arrays en JavaScript
Los arrays proporcionan una forma de almacenar múltiples piezas de información. Un array es una lista de valores: números, cadenas, valores booleanos, o incluso otros arrays. En este curso, aprenderás los conceptos básicos de usar arrays como estructuras de datos.
-
Curso
- 1
- 2
Objetos de JavaScript
Los objetos son una parte esencial de JavaScript; proporcionan una forma flexible de hacer un seguimiento de los datos asociando un nombre con un valor particular. En este curso, aprenderás los conceptos básicos de los objetos de JavaScript como una estructura de datos (usando objetos para almacenar pares clave/valor).
-
Curso
- 1
- 2
- 3
JavaScript y el DOM
JavaScript te permite crear páginas web interactivas que pueden responder a las acciones del usuario. En este curso, aprenderás a dar vida a las páginas web usando el poder de JavaScript.
-
Curso
- 1
- 2
Interactuando con el DOM
Junto con la selección de elementos del DOM en JavaScript, también podemos escribir código que da comportamiento a los elementos. En este curso, primero exploraremos cómo observar la interacción y responder usando el método addEventListener. Aprenderemos sobre diferentes tipos de eventos y cómo podemos usar las relaciones entre elementos para escribir código más potente.
-
Curso
- 1
- 2
- 3
- 4
JavaScript Orientado a Objetos
En este curso, aprenderás los fundamentos de la programación orientada a objetos en JavaScript junto con la nueva sintaxis de Clase ES2015.
-
Curso
- 1
- 2
Obtención de Datos en JavaScript
Aprende cómo las aplicaciones web modernas se comunican con servidores, obtienen datos y actualizan páginas dinámicamente. Este curso cubre los fundamentos de HTTP y APIs, introduce la programación asincrónica con promesas, y te guía a través de técnicas modernas usando Fetch y async/await, todo a través de un proyecto práctico de Visor de Imágenes de Perros. Al final, tendrás confianza trabajando con APIs y construyendo características interactivas del front-end del mundo real.
-
Curso
- 1
- 2
- 3
- 4
Conceptos básicos de Bootstrap
Aprende a construir con Bootstrap, uno de los marcos de trabajo front end de código abierto más populares, para ayudarte a construir un diseño y diseño funcional en poco tiempo.
-
53 minTaller
Crear un Portafolio Usando HTML y CSS
Los portafolios son una excelente manera de mostrar tus habilidades a un empleador potencial. En este taller, comenzaremos con mockups proporcionados y haremos un viaje juntos a través de la construcción de un portafolio impresionante usando HTML y CSS, agregando un toque de JavaScript para la interactividad. Priorizando un enfoque mobile-first y teniendo en cuenta la accesibilidad, nos aseguraremos de que el portafolio no solo sea visualmente cautivador sino también fácil de usar para todos.
Visto -
1 minInstrucción
Próximos Pasos: Alojando Tus Sitios Web
¿Listo para compartir tus proyectos en la web? GitHub proporciona una solución de alojamiento, llamada GitHub Pages, que te permite alojar tus proyectos web directamente desde un repositorio de GitHub.
Visto -
60 minExamen
Examen Final de la Pista de Desarrollo Web Front End
Pon tus habilidades de Desarrollo Web Front End a prueba. Este examen final incluye una mezcla de tipos de preguntas para evaluar lo que has aprendido. Aprueba para ganar tu certificado.
-
Finalización de la Ruta
Esta ruta incluye:
- Introducción a HTML y CSS 2 horas
- Conceptos Básicos de HTML 3 horas
- Conceptos Básicos de CSS 3 horas
- Diseño CSS 2 horas
- Mejora del Diseño con CSS 2 horas
- Depuración de CSS con Chrome DevTools 35 min
- Diseño de Diseño CSS Móvil Primero 38 min
- Diseño de Diseño CSS Flexbox 105 min
- Tablas HTML 59 min
- Formularios HTML 2 horas
- Selectores CSS 2 horas
- Accesibilidad para Desarrolladores Web 91 min
- Introducción a Git 2 min
- Diseño de Cuadrícula CSS 111 min
- Fundamentos de JavaScript 3 horas
- Números en JavaScript 83 min
- Funciones de JavaScript 2 horas
- Bucles en JavaScript 76 min
- Arrays en JavaScript 2 horas
- Objetos de JavaScript 67 min
- JavaScript y el DOM 2 horas
- Interactuando con el DOM 66 min
- JavaScript Orientado a Objetos 111 min
- Obtención de Datos en JavaScript 83 min
- Conceptos básicos de Bootstrap 2 horas
- Crear un Portafolio Usando HTML y CSS 53 min
- Próximos Pasos: Alojando Tus Sitios Web 1 min
- Examen Final de la Pista de Desarrollo Web Front End 60 min