Перейти к содержимому

Spring Boot ft Trinity

trinity

0:00 / 0:00

Spring Boot ft Trinity

8 просмотров · 3 дн. назад
trinity
228 подписчиков
8 просмотров · 3 дн. назад
🚀 ¡Aprendé a crear tu primera página web con Spring Boot, Java y HTML desde Visual Studio Code! ¿Te enredaste con la instalación de Java, la configuración del proyecto o las extensiones? 😅 En este video vamos paso a paso, desde la preparación del entorno hasta ver nuestra primera página HTML funcionando en el navegador. Trabajamos siguiendo una guía práctica para entender qué estamos haciendo y para qué sirve cada herramienta. La idea es que puedas acompañar el proceso, realizar los pasos en tu computadora y comprender cómo se conecta el código Java con la página que ve el usuario. ☕ PREPARACIÓN DEL ENTORNO CON JAVA Comenzamos preparando el JDK de Java 21, que utilizaremos para desarrollar nuestro proyecto. Explicamos la importancia de identificar correctamente la carpeta del JDK y su carpeta bin, donde se encuentran herramientas como java y javac. También abordamos una duda muy común: ¿qué pasa si ya tengo otra versión de Java instalada? En nuestro caso, hablamos de cómo mantener Java 26 y Java 21 en la misma computadora, seleccionando la versión adecuada para trabajar con el proyecto. Revisamos la función de JAVA_HOME y Path, y comprobamos la versión activa mediante los comandos java -version y javac -version. 💻 CONFIGURACIÓN DE VISUAL STUDIO CODE Preparamos Visual Studio Code instalando Extension Pack for Java y Spring Boot Extension Pack. Estas herramientas nos ayudan a escribir código, trabajar con proyectos Java y ejecutar nuestra aplicación. Después utilizamos Spring Initializr para generar un proyecto Maven. Durante este proceso seleccionamos el lenguaje, la versión de Java, el nombre del grupo, el nombre del proyecto y el tipo de empaquetado Jar. 📦 DEPENDENCIAS QUE UTILIZAMOS Agregamos tres dependencias para este primer ejercicio: 🔹 Spring Web: permite desarrollar la aplicación web y atender las peticiones que llegan desde el navegador. 🔹 Spring Boot DevTools: facilita el trabajo durante el desarrollo, con funciones como el reinicio automático de la aplicación ante determinados cambios. 🔹 Thymeleaf: permite trabajar con plantillas HTML que la aplicación procesa para mostrar páginas al usuario. 📂 CONOCEMOS LA ESTRUCTURA DEL PROYECTO Una vez creado el proyecto, revisamos sus carpetas y archivos principales. Identificamos dónde se escribe el código Java, dónde se guardan los recursos y en qué carpeta debemos colocar nuestras plantillas HTML. También revisamos pom.xml, donde se encuentra la configuración de Maven y las dependencias del proyecto. 🧩 INTRODUCCIÓN A MODELO, VISTA Y CONTROLADOR Explicamos de forma sencilla la idea de MVC: • Modelo: representa los datos y las reglas de la aplicación. • Vista: presenta la información que verá el usuario. • Controlador: recibe las peticiones y coordina la respuesta. En este ejercicio nos concentramos principalmente en el controlador y la vista. Todavía no desarrollamos un modelo propio ni conectamos una base de datos: primero queremos comprender cómo mostrar una página desde Spring Boot. ⚙️ CREAMOS NUESTRO CONTROLADOR Creamos el paquete controller y la clase UserController. Luego utilizamos la anotación @Controller para que Spring identifique la clase como un controlador. También agregamos @GetMapping para indicar qué método debe responder cuando visitamos la dirección /detalles. Explicamos qué significa devolver el texto "detalles" desde el método: ese valor indica el nombre de la plantilla que queremos mostrar, y Thymeleaf permite resolverla como nuestra vista HTML. 🌐 CREAMOS LA PÁGINA HTML Dentro de src/main/resources/templates creamos el archivo detalles.html y agregamos una estructura HTML básica con un título y un mensaje. Este paso nos permite ver cómo se relacionan la dirección que escribimos en el navegador, el método del controlador y la plantilla que aparece en pantalla. ▶️ EJECUTAMOS LA APLICACIÓN Finalmente, iniciamos el proyecto desde Spring Boot Dashboard en Visual Studio Code y revisamos la consola para comprobar que la aplicación haya arrancado. Después abrimos en el navegador: 👉 http://localhost:8080/detalles Esta dirección funciona en nuestra computadora mientras la aplicación está en ejecución y utiliza el puerto 8080. 🎉 ¡Así conseguimos mostrar nuestra primera página web con Spring Boot! Este ejercicio es un punto de partida para seguir aprendiendo a crear más páginas, recibir información mediante formularios y trabajar con datos. Primero construimos una base sencilla para comprender el recorrido de una petición desde el navegador hasta el controlador y la vista. 🎓 Si estás comenzando con Java y desarrollo web, podés pausar el video, repetir cada paso y comparar lo que aparece en tu pantalla. 👍 Dejá tu like si el tutorial te ayudó. 💬 Contame en los comentarios qué parte te costó más o qué error te apareció. 🔔 Suscribite para seguir aprendiendo programación paso a paso. ¡Vamos aprendiendo juntos, una línea de código a la vez! ☕💻