Proyectos Frontend de roadmap.sh

Recopilación de los ejercicios de la web de roadmap.sh, todos los proyectos están terminados y cumplen con los requerimientos que se solicitan.

Single page CV

Single page CV

Crea un CV HTML de una sola página para mostrar tu historial profesional.

  • HTML
  • Semantic HTML
  • Layout
  • SEO
Código Demo Detalles
Personal Portfolio

Personal Portfolio

Convierte un sitio web HTML simple en un portafolio personal.

  • CSS
  • Responsive Design
  • Box Model
  • Flexbox
  • Typography
Código Demo Detalles
Changelog Component

Changelog Component

Crear un componente de registro de cambios para un sitio web utilizando HTML y CSS.

  • HTML
  • Layouts
  • CSS
  • Flexbox
Código Demo Detalles
Testimonial Cards

Testimonial Cards

Crear tarjetas de recomendación para un sitio web utilizando HTML y CSS.

  • HTML
  • Layouts
  • CSS
  • Flexbox
  • Positioning
Código Demo Detalles
Datepicker UI

Datepicker UI

Crear una interfaz de usuario de selector de fechas simple utilizando HTML y CSS.

  • HTML
  • Layouts
  • CSS
  • Positioning
Código Demo Detalles
Accessible Form UI

Accessible Form UI

Crear una intefaz de usuario de formulario accesible utilizando HTML y CSS.

  • HTML
  • Layouts
  • CSS
  • Positioning
  • Accessibility
Código Demo Detalles
Image Grid Layout

Image Grid Layout

Crear un diseño de cuadrículas de imágenes utilizando HTML y CSS.

  • HTML
  • CSS
  • Grid Layout
  • Responsive Design
Código Demo Detalles
Tooltip UI

Tooltip UI

Crear una bandera de información para los elementos de navegación utilizando HTML y CSS.

  • HTML
  • CSS
  • Positioning
  • Hover Effects
Código Demo Detalles
Tabs

Tabs

Crear un componente de pestañas simple utilizando HTML, CSS y JavaScript.

  • HTML
  • CSS
  • JavaScript
  • DOM Manipulation
Código Demo Detalles
Cookie Consent

Cookie Consent

Crear un banner de consentimiento de cookies simple usando JavaScript.

  • HTML
  • CSS
  • JavaScript
  • DOM Manipulation
Código Demo Detalles
Restricted Texarea

Restricted Texarea

Crear un textarea con un recuento de caracteres en vivo, con un límite máximo de caracteres.

  • HTML
  • CSS
  • JavaScript
  • DOM Manipulation
Código Demo Detalles
Accordion

Accordion

Crear un componente de acordeón utilizando HTML, CSS y JavaScript.

  • HTML
  • CSS
  • JavaScript
  • DOM Manipulation
Código Demo Detalles
Age Calculator

Age Calculator

Crear una calculadora de edad utilizando HTML, CSS y JavaScript.

  • HTML
  • CSS
  • JavaScript
  • DOM Manipulation
  • Package Management
Código Demo Detalles
Flash Cards

Flash Cards

Crear una aplicación de flash cards utilizando frameworks de JavaScript.

  • HTML
  • CSS
  • JavaScript
  • JavaScript Frameworks
Código Demo Detalles
Custom Dropdown

Custom Dropdown

Crear un menú desplegable personalizado utilizando HTML, CSS y JavaScript.

  • HTML
  • CSS
  • JavaScript
  • DOM Manipulation
Código Demo Detalles
Task Tracker

Task Tracker

Crear un gestor de tareas con una lista de pendientes usando JavaScript.

  • HTML
  • CSS
  • JavaScript
  • DOM Manipulation
Código Demo Detalles
GitHub Random Repository

GitHub Random Repository

Crear un buscador de repositorios aleatorios de GitHub usando la API de GitHub.

  • HTML
  • CSS
  • JavaScript
  • API Integration
  • DOM Manipulation
Código Demo Detalles
Reddit Client

Reddit Client

Crear un cliente de Reddit con secciones personalizables para subreddits.

  • HTML
  • CSS
  • JavaScript
  • API Integration
  • DOM Manipulation
  • Asynchronous Programming
Código Demo Detalles
Temperature Converter

Temperature Converter

Crear un conversor de temperatura que convierta entre diferentes unidades.

  • HTML
  • CSS
  • JavaScript
  • DOM Manipulation
Código Demo Detalles
Pomodoro Timer

Pomodoro Timer

Crear una aplicación de Pomodoro para mejorar la productividad.

  • HTML
  • CSS
  • JavaScript
  • Frameworks
Código Demo Detalles
Quiz App

Quiz App

Crear una aplicación de preguntas basada en el navegador para poner a prueba tus conocimientos.

  • HTML
  • CSS
  • JavaScript
  • Frameworks
Código Demo Detalles
Weather Web App

Weather Web App

Crear una aplicación metereológica que obtenga y muestre el clima para una ubicación seleccionada.

  • Programming Language
  • 3rd Party APIs
  • JavaScript
  • HTML
  • CSS
Código Demo Detalles
24hr Story Feature

24hr Story Feature

Crear un clon de la función de 'Historias' de Instagram del lado del cliente.

  • JavaScript
  • Storage
  • Timeouts
Código Demo Detalles