프레임워크(Framework)/Spring

[Spring] 4-1. 스프링 웹 개발 기초: 시작 페이지와 정적 컨텐츠 with Gradle

잇트루 2022. 8. 26. 00:02
반응형

본 내용은 온라인 강의 사이트 인프런의 김영한 님의 강의 '스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술'내용을 바탕으로 공부하여 정리한 것임을 알려드립니다.

 

스프링 웹 개발

스프링에서 웹 개발하는 것에 있어서 크게 세 가지 방법이 있다.

  1. 정적 컨텐츠 : html과 같은 파일을 웹 브라우저에 전달하여 작성한 대로 열어주는 방식
  2. MVC와 템플릿 엔진 : JSP, PHP 등과 같은 템플릿 엔진을 사용하여 서버에서 동적으로 웹 브라우저에 전달하는 방식으로 Model, View, Controller 세 가지 개발 방식으로 작성
  3. API : XML이나 JSON과 같은 데이터 포맷을 클라이언트에 전달하는 방식

 

시작 페이지(Welcome Page)

시작 페이지는 프로그램을 실행하면 가장 먼저 나타나는 페이지로 프로젝트를 실행시킨 후 인터넷 브라우저를 통해 http://localhost:8080/로 이동하면 바로 나타나는 페이지를 뜻한다.

프로젝트를 빌드하기 위한 최소환의 환경을 만들기 위해 프로젝트 생성 이후 간단한 시작 페이지를 만들어 본다.

 

스프링 부트에서 시작 페이지를 찾는 방법

  1. static 폴더 내에서 index.html을 찾는다.
  2. static에서 index.html을 찾지 못한 경우, templates에서 index를 찾는다.
  3. 위에서 파일을 찾은 경우 시작 페이지로 사용한다.

 

따라서, 프로젝트에서 scr/resources/static에 index.html 파일을 생성하여 간단한 시작 페이지를 작성

index.html

<!DOCTYPE HTML>
<html>
<head>
    <title>Hello</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
Hello Spring!
</body>
</html>

위 코드를 작성한 뒤 프로젝트를 실행시켜 인터넷 브라우저에서 http://localhost:8080/로 이동하여 다음과 같이 나타나면 성공

 

정적 컨텐츠(Static Content)

정적 컨텐츠는 위에서 시작 페이지를 불러온 것과 같이 html 파일을 작성하면 이를 그대로 받아 브라우저에 제공하는 방식.

 

스프링 부트의 정적 컨텐츠는 프로젝트 디렉토리와 /static(또는 /public 또는 /resources) 클래스 경로를 기본으로 하여 파일을 찾아 제공한다.

 

/src/main/resources/static 안에 hello-static.html 파일을 작성하여 실습한다.

<!-- hello-static.html -->
<!DOCTYPE HTML>
<html>
<head>
    <title>static content</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
정적 컨텐츠 입니다.
</body>
</html>

위 코드를 작성한 뒤 프로젝트를 실행시켜 인터넷 브라우저에서 http://localhost:8080/hello-static.html로 이동하여 다음과 같이 나타나게 된다.

 

 

 

정적 컨텐츠 호출 방식

1. 사용자가 웹 브라우저에서 정적 콘텐츠 링크에 접속하면 내장 톰캣 서버에 요청

2. 내장 톰캣 서버는 스프링 부트에 정보를 넘김

3. 스프링 부트는 1차적으로 스프링 컨테이너 내부에서 hello-static 관련 컨트롤러를 찾음

4. 스프링 컨테이너에 없음을 확인하면, /static(또는 /public 또는 /resources) 클래스 경로에서 파일을 찾음

5. resources내부에 static/hello-static.html을 찾은 후 웹 브라우저에 파일 데이터를 넘겨 호출

 

위 과정을 거치면서 사용자는 정적 컨텐츠를 받을 수 있게 되는 것이다.

반응형