SpringBoot으로 웹 출시까지 #4

springboot logo

4. thymeleaf를 이용해 레이아웃 만들기

1 myhome 만들기

https://start.spring.io/

 

project : maven

springboot :  최대한 낮은 버전 / SNAPSHOT X로 선택

group : godcoder

artifact, name : myhome

java: 8

dependencies : Thymeleaf / Spring Web / Spring Boot DevTools / Lombok

2 IntelliJ와 git 연동하기

https://github.com/

깃허브 계정이 없으신분들은 회원가입을 진행합니다.

그 뒤 강의 내용대로 진행하시면 됩니다.

저는 이번 클론 코딩을 진행하는 모든 코드를 한 번에 관리하기 위해 강의와 다르게 연동하였습니다.

git repository 생성 및 로컬 폴더 연결

을 누르시면 모든 프로젝트를 하나의 리포지토리로 관리 하실 수 있습니다.

3 bootstrap 적용

부트스트랩 스타터 탬플릿 적용

https://getbootstrap.kr/docs/5.0/getting-started/introduction/

– 강의 시점과 시간이 달라 버전이 업그레이드 되었습니다.

    코드가 달라지고, 명령어가 수정되었습니다.

    최대한 유사한 코드를 사용해서 작성했습니다.

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

    <title>Hello, world!</title>
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- Optional JavaScript; choose one of the two! -->

    <!-- Option 1: Bootstrap Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>

    <!-- Option 2: Separate Popper and Bootstrap JS -->
    <!--
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>
    -->
  </body>
</html>

Visual Studio Code 연결

컴퓨터에 자동 설치된 비주얼스튜디오를 실행시켜 프로젝트 파일(myhome – main – resources)을 열어줍니다.

template 폴더 아래 “index.html” 파일을 만들고 복사한 내용을 붙여넣습니다.

<html lang=“en”> -> <html>으로 수정합니다.

[intelliJ] HomeController 만들기

myhome 아래 “controller” 폴더를 생성하고,  “HomeController” 클래스를 작성합니다.

package com.godcoder.myhome.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class HomeController {
@GetMapping
public String index(){
return "index";
}
}

[VSCode]starter-template.css 작성

myhome – src – main – resources – static 아래 “starter-template.css” 파일을 생성합니다.

body {
padding-top: 5rem;
}
.starter-template {
padding: 3rem 1.5rem;
text-align: center;
}

“SpringBoot으로 웹 출시까지 #4”의 70,835개의 댓글

  1. Этот обзор содержит информацию о передовых достижениях в области медицины. Мы разберем инновационные технологии, которые меняют подход к лечению и диагностике, а также их влияние на эффективность оказания медицинской помощи.
    Продолжить чтение – [url=https://autohirebuy.ru/pages/vyvod-iz-zapoya-stoimost/]вывод из запоя в клинике[/url]

  2. Si estas buscando una experiencia de entretenimiento divertida y completa, el catalogo de juegos en needfor-slotscasino.es es el destino ideal para los usuarios en Espana [url=https://needfor-slotscasino.es/games]need for slots online games[/url] . Esta plataforma se ha consolidado como un referente al ofrecer una gama variada que colma los gustos mas exigentes, garantizando horas de diversion en un entorno seguro y profesional.

    Cuando exploras la seccion principal de need for slots games, te encuentras con una interfaz sencilla disenada para mejorar la experiencia de usuario. La oferta es realmente extensa, destacando especialmente los need for slots casino games, que incluyen desde los titulos tradicionales como la ruleta o el blackjack hasta opciones modernas con distribuidores en vivo. Para los entusiastas de la accion inmediata, los need for slots slot games representan el corazon del entretenimiento, con cientos de titulos que incluyen desde tematicas de aventura hasta maquinas clasicas de frutas.

    La ventaja de jugar en este portal se encuentra en la calidad de sus desarrolladores. Si eres de los que prefieren probar mecanicas antes de arriesgar dinero, la plataforma tambien permite entrar a diversos need for slots free slot games, ideales para entrenar habilidades y conocer las funciones de cada maquina sin presion. Por otro lado, la seccion de need for slots online games garantiza un funcionamiento optimo tanto en ordenadores como en dispositivos moviles, permitiendo que disfrutes de tu pasion en cualquier momento y lugar.

    Para aquellos que buscan la emocion pura, los need for slots live casino games ofrecen una experiencia inmersiva que recrea la emocion de un casino fisico desde la comodidad de tu hogar. La tecnologia empleada asegura transmisiones en alta definicion y una interaccion dinamica con los crupieres que dirigen las mesas. En conclusion, si buscas calidad, confianza y facilidad de uso, esta web es el sitio ideal para disfrutar del mejor catalogo de juegos del momento. Explora ahora su seleccion y comprueba por que tantos usuarios confian en esta plataforma para sus momentos de ocio diario, disfrutando de ofertas atractivas y una jugabilidad de primer nivel.

  3. chickenroad-Erepsy

    El juego *La Carretera de los Pollos* ha ganado popularidad en los últimos años, sin duda entre los entusiastas de los juegos de conducción y las experiencias cooperativas [url=https://chickenroad-game-240.onrender.com]Juego Chicken Road Opiniones[/url] .

    Si estás leer impresiones honestas sobre este producto, es esencial revisar tanto sus características destacados como sus latentes desventajas para determinar si merece la experiencia.

    Aquí te presentamos una revisión detallada basada en las experiencias de aficionados en Europa y en plataformas como Redes de Automovilistas, donde muchos participantes comparten sus juicios sobre *El Desafío de la Ruta Veloz*.

    Uno de los puntos relevantes de *La Carretera de los Pollos* es su facilidad. El juego brinda a los usuarios desafiarse en carreras de coches con un estilo retro, donde la rapidez y la inteligencia son claves. Muchos aficionados destacan que es apropiado para quienes necesitan entretenimiento fácil evitando problemas. Además, su edición sin costo en la página principal (accesible desde *chickenroad-game-240.onrender.com*) ha sido valorada, ya que no demanda instalación de programas ajenos, lo que agiliza su acceso desde cualesquiera dispositivo con browser.

    No obstante, no todo éxito. Algunos jugadores han señalado que la sesión puede convertirse monótona con el tiempo, notablemente si no se valoran los componentes multijugador. También hay críticas que destacan fallas de conexión en momentos de intensa concurrencia, lo que interfiere la smoothness del producto. En cuanto a su confiabilidad, la gran parte de los usuarios acuerdan en que, aunque no se considera un producto profesional como *Asphalt*, satisface con lo anunciado: entretenimiento rápida y evitando pretensiones.

    Si necesitas críticas en español, espacios como Red de Automovilistas o espacios de videojuegos alternativos suelen tener hilos especializados a *Road Chicken Challenge*, donde usuarios hispanos exponen sus opiniones. Allí encontrarás críticas profundas, desde recomendaciones para aumentar tu calificación hasta evaluaciones con otros entornos similares. También es habitual observar que muchos recomiendan experimentar al menos una vez por su forma único y su habilidad para producir adrenalina en minutos.

    En sumario, *Road Chicken Challenge* es una opción llamativa para quienes desean un producto de pruebas accesible, rápido y evitando complicaciones. Aunque no es impecable, su facilidad y diversión lo convierten en una alternativa recomendable, particularmente si te encanta el modo multijugador informal. Si te animas probarlo, no olvides consultar las opiniones actuales en comunidades temáticos para mantenerse al corriente de eventuales actualizaciones en el producto.

  4. Специалисты регулярно помогают при интоксикации, запоях, абстиненции и сложных состояниях зависимости.
    Дополнительная информация – [url=https://1.vyvod-iz-zapoya-balashiha13.ru/]pomoshch-vyvod-iz-zapoya[/url]

  5. chickenroad-raize

    Si deseas una aventura de apuesta estimulante y llena de intensidad, te gustara conocer la opcion para jugar chicken road desde este dominio dedicado [url=https://chickenroad-reviewgame.es/demo]modo demo chicken road[/url] . Este titulo se ha transformado en una tendencia absoluta dentro del mundo de los titulos de apuestas digitales por medio de su mecanica sencilla pero increiblemente fascinante, en la cual toda decision cuenta para eludir los inconvenientes y incrementar tus premios.

    Respecto a esos jugadores que eligen conocer los pormenores y la operativa de este entretenimiento antes de apostar su propio capital, hemos habilitado el entrada a la demo chickenroad. Esta edicion de practica es la herramienta perfecta para comprender las probabilidades y los patrones de desplazamiento del personaje gratuitamente alguno. Ingresando al estilo demostrativo chicken road, poseeras la ocasion de acostumbrarte con la pantalla y los mandos, ayudandote a crear tu unica tactica ganadora en un entorno seguro y exento de riesgos.

    Gran cantidad de jugadores persiguen constantemente sitios para localizar chicken road gratis para practicar sus capacidades. El ambito esta configurado para ofrecer una experiencia fluida desde cualquier dispositivo, garantizando que el chicken road free play sea alcanzable igualmente para aficionados como para profesionales que quieran mejorar su estilo. Empleando la opcion experimental chicken road en esta interfaz, disfrutaras de la misma estetica y la misma emocion que presenta la modalidad de pago.

    No ignores la posibilidad de poner a prueba tu pericia. La opcion experimental esta creada para que puedas jugar chicken road con total tranquilidad, evaluando los periodos cruciales donde la suerte y el juicio se cruzan. Independientemente de si buscas vivir un tiempo divertido o planees abordar el desafio mas en rigurosamente, el ingreso a la version sin costo es el primer eslabon necesario. Ingresa hoy mismo, descubre el formato de prueba chicken road y disponte para dominar la carretera antes que nadie. La entretencion te espera con las mas eficaces soluciones para que tu vivencia sea sobresaliente.

  6. Современное лечение зависимости строится не вокруг одной процедуры, а вокруг последовательной программы медицинского и психологического восстановления. Специалисты учитывают причины формирования алкоголизма или наркомании, особенности поведения, физической зависимости, мотивацию, характер употребления и отношение человека к лечению. Такой индивидуальный подход помогает стабилизировать здоровье и перейти от срочной помощи к длительной ремиссии.
    Дополнительная информация – [url=https://3narkologicheskaya-klinika-balashiha.ru/]https://3narkologicheskaya-klinika-balashiha.ru[/url]

  7. Этот документ охватывает важные аспекты медицинской науки, сосредотачиваясь на ключевых вопросах, касающихся здоровья населения. Мы рассматриваем свежие исследования, клинические рекомендации и лучшие практики, которые помогут улучшить качество лечения и профилактики заболеваний. Читатели получат возможность углубиться в различные медицинские дисциплины.
    Кликни и узнай всё! – [url=https://shokolad-txt.ru/kapelnicza-ot-pohmelya-idealnoe-reshenie-dlya-bystrogo-vosstanovleniya/]нарколог на дом в Барнауле”[/url]

  8. Das mobile Spielerlebnis erwirkt durch der SpinoGambino Webseite ein komplett neues Level [url=https://spino-gambinocasino.com.de/app]spinogambino app ios[/url] . Wenn ihr Ihre Lieblingsspiele jederzeit sowie ortsunabhangig konsumieren mochten, bleibt unsere SpinoGambino App als optimale Losung bei anspruchsvolle Anwender. Die Applikation wird speziell darauf entwickelt, eine flussige Geschwindigkeit sowie dem einfaches Interface auf unterschiedlichen Endgeraten zu gewahrleisten. Gegenuber Android-Nutzer scheint dieser Vorgang maximal unkompliziert: Uber jener hauseigene Prasenz lasst man das SpinoGambino APK zuverlassig und schnell in jenes Mobiltelefon laden. Die Konfiguration des Spino Gambino APK erlaubt euch jenen sofortigen Zugang zu dem umfangreiches Portfolio an exzellenten Glucksspielen, ohne indem man den Webbrowser starten sollten.

    Jeder uber dem Apple-Gerat daddelt, gewinnt zudem durch jener angepassten Spinogambino App iOS Version. Diese Software wirkt optimal bezuglich deine Wunsche der Smartphone-Spielern konfiguriert, sodass das komplette Gaming-Portfolio unter jenen sicheren Umgebung existiert. Jener SpinoGambino Download erfolgt in kurzen Schritten finalisiert sowie bietet euch optimale Schutz sowie eine benutzerfreundliche Bedienfuhrung. Viele User schatzen die SpinoGambino mobile Erfahrung, da diese alle Features, wie ebenfalls auf jenem Computer nutzbar existieren, unmittelbar an deiner Hand bietet.

    Falls ihr sich bezuglich jenen Spino Gambino App Download wahlen, gewinnen Sie durch schnelleren Zugriffszeiten und jenen eigenen Navigation. Die SpinoGambino tragbare App wirkt derma?en erstellt, sodass sie ebenfalls in diversen Verbindungsgeschwindigkeiten jenes reibungsloses Erlebnis sichert. Sollten ihr jenen Spinogambino App Download bislang nicht durchgefuhrt besitzen, zahlt es ein Abstecher einer offiziellen Homepage, um dies frischeste Ausfuhrung dieser App beim bekommen. Durch dem Spino Gambino App Download fuhren du den Pass fur einer erstklassigen Zocker-Action zwischen deinen Fingern. Erkunden du sofort, wie einfach ein Spinogambino Download wirken darf sowie konsumieren ihr das ganze Flexibilitat wobei Spielen. Starten ihr noch gleich voran plus fuhlen ihr die Vorteile jener Spinogambino App in deinem Mobiltelefon. Jenes war bislang keineswegs so leicht, jenen Spino Gambino APK bei deinem Device zu installieren und sofort durchzustarten. [url=https://brilliantbluelogistics.com/2024/03/25/hello-world/#comment-22537]Ein flexible Gaming-Vergnugen mit der SpinoGambino Plattform: Die ideale Alternative bei versierte Anwender in verschiedenen Endgeraten.[/url] [url=https://www.bruchlee.com/south-asian-geopolitics/%e0%a6%ad%e0%a7%82-%e0%a6%b0%e0%a6%be%e0%a6%9c%e0%a6%a8%e0%a7%80%e0%a6%a4%e0%a6%bf/#comment-81298]Das tragbare Zocker-Abenteuer mittels der SpinoGambino Umgebung: Jene perfekte Losung bezuglich anspruchsvolle Anwender in diversen Devices.[/url] 98001ef

댓글 달기

이메일 주소는 공개되지 않습니다.