회원가입/로그인 페이지 구현
회원가입과 로그인 페이지는 웹 애플리케이션에서 매우 중요한 부분입니다. 이번 챕터에서는 Spring Boot와 Thymeleaf를 사용하여 간단한 회원가입 및 로그인 페이지를 구현하는 방법에 대해 알아보겠습니다.
1. 회원가입 페이지 구현
먼저, 회원가입 페이지를 구현해야 합니다. 아래는 간단한 회원가입 페이지의 HTML 코드입니다.
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>회원가입</title>
</head>
<body>
<h2>회원가입</h2>
<form th:action="@{/signup}" method="post">
<label for="username">사용자명:</label>
<input type="text" id="username" name="username">
<br>
<label for="password">비밀번호:</label>
<input type="password" id="password" name="password">
<br>
<button type="submit">가입</button>
</form>
</body>
</html>
위의 코드에서는 사용자명과 비밀번호를 입력할 수 있는 폼을 구현했습니다. th:action 속성을 사용하여 회원가입 요청을 처리할 컨트롤러의 엔드포인트를 지정했습니다.
2. 로그인 페이지 구현
다음으로는 로그인 페이지를 구현합니다. 아래는 간단한 로그인 페이지의 HTML 코드입니다.
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>로그인</title>
</head>
<body>
<h2>로그인</h2>
<form th:action="@{/login}" method="post">
<label for="username">사용자명:</label>
<input type="text" id="username" name="username">
<br>
<label for="password">비밀번호:</label>
<input type="password" id="password" name="password">
<br>
<button type="submit">로그인</button>
</form>
</body>
</html>
회원가입 페이지와 비슷하게 사용자명과 비밀번호를 입력할 수 있는 폼을 구현했습니다. th:action 속성을 사용하여 로그인 요청을 처리할 컨트롤러의 엔드포인트를 지정했습니다.
3. 컨트롤러 구현
회원가입과 로그인을 처리할 컨트롤러를 구현해야 합니다. 아래는 간단한 컨트롤러의 예시입니다.
@Controller
public class AuthController {
@GetMapping("/signup")
public String showSignupForm(Model model) {
model.addAttribute("user", new User());
return "signup";
}
@PostMapping("/signup")
public String signup(@ModelAttribute("user") User user) {
// 회원가입 로직 구현
return "redirect:/login";
}
@GetMapping("/login")
public String showLoginForm() {
return "login";
}
}
위의 코드에서 showSignupForm 메서드는 회원가입 페이지를 보여주고, signup 메서드는 회원가입 요청을 처리합니다. 비슷하게 showLoginForm 메서드는 로그인 페이지를 보여주고, 실제 로그인 로직은 Spring Security에 의해 자동으로 처리됩니다.
4. 실행
애플리케이션을 실행하고 회원가입 및 로그인 페이지를 테스트하여 기능이 올바르게 작동하는지 확인합니다.
5. 요약
이제 간단한 회원가입과 로그인 페이지를 구현하는 방법을 알아보았습니다. 이러한 기능은 웹 애플리케이션의 핵심 부분이며, Spring Boot와 Thymeleaf를 사용하여 쉽게 구현할 수 있습니다. 이러한 기능을 통해 사용자들은 웹 애플리케이션에 가입하고 로그인하여 서비스를 이용할 수 있습니다.
'Thymeleaf' 카테고리의 다른 글
23. Thymeleaf 성능 최적화 - 2 (0) | 2024.02.24 |
---|---|
22. Thymeleaf 성능 최적화 - 1 (0) | 2024.02.24 |
21. 실전 예제와 실무 적용 사례 - 3 (0) | 2024.02.24 |
20. 실전 예제와 실무 적용 사례 - 2 (0) | 2024.02.24 |
18. Thymeleaf와 Spring Framework의 통합 - 3 (0) | 2024.02.24 |
17. Thymeleaf와 Spring Framework의 통합 - 2 (0) | 2024.02.24 |
16. Thymeleaf와 Spring Framework의 통합 - 1 (0) | 2024.02.24 |
15. Thymeleaf의 유효성 검증 - 2 (0) | 2024.02.24 |