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



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

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: https://www.twitch.tv/midudev

Comments are closed.