오늘은 VSCode에서 Springboot로 template를 이용해 웹사이트를 만들어보겠습니다.
1. template가져오기
Google등 검색 포털에서 웹 템플릿을 검색하여 가져옵니다.
저는 아래 웹 사이트에서 템플릿을 가져왔습니다.
https://colorlib.com/wp/templates/?v=38dd815e66db
800+ Free Website Templates | HTML & Bootstrap 2020 - Colorlib
The best source for free website templates based on Bootstrap 4 and clean HTML & CSS. We have over 800 free templates and more have been added every day.
colorlib.com
템플릿을 가져오고 다운받아봅니다.
2. 압축 풀기
압축을 풀면 아래와 같이 html화면과 css 파일 등이 보입니다.
미리 만들어둔 SpringBoot 프로젝트에 적용하여 봅시다.
만약 만들어둔 SpringBoot 프로젝트가 없다면 아래 포스팅을 참고하여 생성해줍시다.
[이전 포스팅]
VSCode에서 Spring Boot index.html 생성하기
3. 프로젝트 적용
src/main/resource/static 경로에 위의 파일들을 붙여넣기 해줍시다.
위의 구조에서 static쪽에 붙여넣기하면 아래와 같은 구조로 변경이 됩니다.
이 상태에서 스프링 부트 프로젝트를 Run해봅시다.
실행은 java/com/example/test 패키지내의 DemoApplication.java 파일을 실행하면 됩니다. (Ctrl + F5)
4. 웹페이지 확인
localhost:5090에 접속해봅시다.
아래와 같이 템플릿 내용이 적용된 것을 확인할 수 있습니다.
포스팅에 사용한 템플릿 다운받기 : https://colorlib.com/thank-you-for-downloading/?dlm-dp-dl=5153
Thank you for downloading! - Colorlib
Remember that this template is licensed under CC BY 3.0. Meaning you are not allowed to remove footer credits for that you must purchase a License. Your download will start in few seconds!
colorlib.com
'Spring Boot' 카테고리의 다른 글
| [웹사이트 제작] VSCode + Spring Boot + Gradle 프로젝트 만들기(2) - 웹 템플릿 이용하여 jsp 파일에 적용하기 (0) | 2020.04.06 |
|---|---|
| [웹사이트 제작] VSCode + Spring Boot + Gradle 프로젝트 만들기(2) - jsp, controller 세팅 및 연결하기 (0) | 2020.04.06 |
| [웹사이트 제작] VSCode + Spring Boot + Gradle 프로젝트 만들기(1) (0) | 2020.04.06 |
| VSCode에서 Spring Boot index.html 생성하기 (0) | 2020.04.02 |
| VSCode에서 Spring Boot 시작하기 (0) | 2020.04.02 |