Clon del sitio web de Tesla con HTML, CSS, JavaScript y Tailwind

En este tutorial, recreamos la landing web de Tesla y lo recrearemos paso a paso con tecnologías web.

Código fuente disponible aquí: https://github.com/midudev/landing-tesla

¿Alguna vez has admirado el diseño limpio y moderno de la página de Tesla? Si es así, este video es perfecto para ti. Te guiaré a través del proceso completo de la recreación de este impresionante sitio web utilizando tecnologías como HTML, CSS, JavaScript y Tailwind CSS.

Primero, analizaremos un poco la web, qué características únicas tiene y luego iniciaremos el proyecto con Astro.

Iremos paso a paso recreando la interfaz de la web y añadiendo el sistema de menú o el slider vertical.

Este video es adecuado para todos los niveles de habilidad. No importa si eres un principiante que busca aprender más sobre el desarrollo web, o un desarrollador experimentado buscando perfeccionar tus habilidades en estos lenguajes, encontrarás valor en este tutorial.

¡Prepárate para desatar tu creatividad y perfeccionar tus habilidades de desarrollo web!

Segmentos del vídeo 📹
00:00 - Introducción y por qué no usamos NextJS
03:00 - Instalación de Astro e inicio del proyecto
05:20 - Instalar Tailwind en Astro
07:00 - Creación del Header
19:30 - Añadir vídeo de fondo en la primera sección
37:15 - Crear slider de secciones
51:48 - Cambiar color del header según la sección
01:04:36 - Crear menu que sigue el cursor
01:19:48 - Reusar componentes en Astro




▶ No te pierdas más directos en:   / midudev