반응형
01. Spring Boot에서 프로젝트 생성하기
- 생성 시, Dependencies에서 Spring Boot DevTools, Lombok, Tymeleaf, Spring Web 선택
02. 프로젝트 생성 완료
프로젝트를 생성하면 아래와 같은 기본 폴더 구조가 생성됨
📂src/main/java
└ 📂com.peazh
└ 📄Application.java
📂src/main/resources
└ 📂templates (HTML 파일을 관리하는 폴더)
└ 📂static (CSS, 이미지, JS 등 정적 파일을 저장하는 폴더)
└ 🥬application.properties (설정 파일)
03. Controller 생성
📂src/main/java 하위에 'com.peazh.controller' 패키지 생성한 뒤, 아래 코드를 추가하여 기본 화면 연결
package com.peazh.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class HomeController {
@GetMapping
public String index() {
return "index";
}
}
04. index.html 생성
📂src/main/resouces/templates 하위에 'index.html' 파일을 생성하여 아래의 코드 추가
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Spring Boot</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<link href="../style.css" rel="stylesheet">
</head>
<body>
<main class="container">
<div class="template">
<h1>Hollo, Spring Boot</h1>
<p class="subtitle">Thymeleaf를 이용한 웹 페이지 제작</p>
</div>
</main>
<!--bootstrap-->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
crossorigin="anonymous"></script>
</body>
</html>
반응형
댓글