[Spring] Bootstrap SB Admin 2 설치하기

https://greed-yb.tistory.com/209

[SpringBoot+IntelliJ+Oracle+Thymeleaf+Paging] 웹 게시판 만들기(1) - 구성

해당 글은 프로젝트의 연상선이지만 설치하는 부분에 있어서는 관계가 없다

 

 

 

Bootstrap(부트스트랩) 설치

https://startbootstrap.com/

Start Bootstrap

위의 주소로 이동한다

 

제일 흔하고 많이 사용하고 무료인 Admin2 를 설치한다

 

사이트 이동 후 아래로 내리면 있다

 

Free Download 클릭

 

다운로드 압축 해제

 

 

resources 폴더 -> statice -> bootstrap 폴더 생성

 

html 파일을 templates 폴더 안에 다 넣는다

resources 폴더 -> templates -> 붙여넣기

한눈에 볼 수 있고 화면을 나누기 위해

폴더를 생성하고 넣으면 더 깔끔하겠지만

현재 화면에 대한 설계가 되지 않아 한번에 다 붙여놓았다 

 

(이전에 사용하던 index.html은 부트스트랩 index.html 과

이름이 중복되기 때문에 beforeIndex.html 로 임시로 변경해두었다)

 

 

나머지 파일들을 static -> bootstrap 폴더 안에 넣는다

붙여놓기 끝

 

 

 

Bootstrap(부트스트랩) 실행 

이전에 사용하던 메인페이지

    @GetMapping("/")
    public String Main(Model model,@ModelAttribute SearchCriteria cri) throws Exception{
    /**
     * 안에 내용은 이전 프로젝트에 맞춰놓았기 때문에
     * 다 지우고 실행하거나 본인의 프로젝트에 맞춰서 실행하면 된다
     */ 
        return "index";
    }

 

실행하면 이렇게 나온다

경로가 맞지 않아서 그렇다

 

css를 사용하는 곳과 img 가 들어가는 부분을 위와 같이 맞춰준다

resources 를 바라보고 있다고 생각해야하고

거기서 ../ 가 static을 의미한다

 

 

 

정상적으로 나오는 것으로 확인

 

어느 부분에서 에러인지 모르겠다면

ctrl + shift + i 또는 F12번을 눌러서 관리자 도구에서

해당 에러를 확인하여 경로를 변경하면 된다