프로그래밍

[프로그래밍] SpringBoot JPA, 예약파트 만들기. html파일들을 타임리프로 바꾸기. 3. 공부해보세요~.

tt2t2am1118 2023. 2. 18. 21:26
반응형

스마트기기. 안전하게 사용합시다. 좋은 습관을 만들어요.😀🙂

 

공부해보세요. 저번시간에 이어서, SpringBoot JPA 예약파트 만들기. 게시판에 어떤 데이터를 넣었죠. 그리고, html페이지. 그 안에 넣어주면 되겠죠. 노래를 들으면서 만들고 있군요~. 들어보세요.

https://music.youtube.com/playlist?list=PLjzBpA6_cHIbTCKhGksvPuIBF1LEFqvKS&feature=share

 

음악, 안전하게 감상합시다. 들어보세요. KPop~. Pop~~. JPop. 교회 다녀보세요~.

Let's safely use smartphones, etc. Let's safely listen music. Church. Jesus Christ. Calling. 교회. 다녀보세요. 안전하게 생활합시다. I like this writing. Let's go there, church. Thank you. 2021-08-16 월요일... 노래 듣고 힘내요~.

music.youtube.com

원래는 빽빽이를 하고, 남은 시간에 만들고는 하는데... 근육통때문에, 못했군요. 오늘은 일본어 필기 공부를 안하기로 했네요. 부침개를 먹으면, 어느정도 괜찮아지기는 하는 것 같아요. 오늘은 패스~. 토요일이네요.

 

타임리프. css, img, js와 같은 파일은 static폴더 안에 넣어야 하고, templates폴더에는, html파일들이 들어가게 됨니다. 뷰 페이지라고 설명할 수 있죠.

타임리프 뷰페이지의 예

resources/static  --> css, img, js 폴더가 들어감.

resources/templates --> html파일들이 들어감.

plan과 search는 또 폴더로, html파일이 들어가구요. html파일의 수정이 필요합니다. 또, css파일을 링크를 걸때에, href를 수정해줘야합니다. 파일, bootstrap.min.css파일이 없네요. bootstrap.css로 바꿔주세요.

Ctrl+R을 통해서, bootstrap.min.css를 bootstrap.css로 바꿔줄수 있어요. 또, 그런부분이 있죠. bootstrap.bundle.min.js. 이 파일도 /js/bootstrap.bundle.js. 이렇게 바꿔줘야도 하구요.

또, 타임리프 html파일이 되기 위해서는, html태그를 이렇게 바꿔줘야합니다~.

<html lang="ko" xmlns:th="http://www.thymeleaf.org">

resources.zip
0.29MB

붙여넣기. 해보세요. 압축을 풀고... 알집으로 압축했네요. 

according에 data-bs-parent="#accordinPanelStayOpenExample"을 빼먹어서, 추가하구요. 잘 작동하네요~.

다 완성한 파일입니다~.

https://altools.co.kr/download/alzip.aspx

 

알집 | 공식 다운로드

알집은 다양한 압축파일 포맷 지원과 동시에 바이러스 검사까지 가능한 무료 압축 프로그램 입니다.

altools.co.kr

또, 타임리프, root가 되는 index.html을 실행시키기위해서 컨트롤러에 index를 리턴하는 메소드를 만들어줘야합니다. 페이지마다 있어야하죠. 우선, index.html부터. ...

InstanceUrlController. 이 파일에서, 현재 localhost:8080/ 이 접속이, firstinstance/index. 리턴값. 그래서, resources/firstinstance/index.html파일을 열게해주는 것인데요. 

Instance값을 만들어주는 게시판을 열어주는 컨트롤러이기 때문에, 컨트롤러 클래스를 새로 만들어 줍시다. com.example.controller.UrlController.java. UrlController라는 클래스를 만들어주어요. 그런데, 전에 instanceUrlController에서, /로 이동하는 메소드가 있기 때문에, 해당 값을 바꿔줌니다. admin/ 이렇게 바꿔주세요. 이렇게 바꾸면, 나중에 instance게시판의 진입점이 localhost:8080/admin. 이렇게 바뀌는 것이죠.

 

com.example.firstinstance.controller.firstinstanceurl.InstanceUrlController.java 파일.

package com.example.firstinstance.controller.firstinstanceurl;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class InstanceUrlController {

    @GetMapping("/administer/instanceurl")
    public String index(){
        //firstInstance index의 처음 위치.
        return "firstinstance/index";
    }
    

    @GetMapping("/admin")
    public String index2(){

        return "redirect:/administer/instanceurl";
    }

    

}

 

com.example.UrlController.java 파일.

package com.example.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class UrlController {

    @GetMapping("/")
    public String index(){
        return "index";
    }
}

html페이지의 a링크들을 적당한 이름으로 바꿔줘야도 합니다. welcome.html이였던 이동위치가, UrlController. 해당 컨트롤러 클래스에 한번 읽었다가 들어가야 하기 때문에... welcome. 이렇게 html확장자를 빼고, 적어주고, 컨트롤러도 그에 맞추어서 적어주고요.

package com.example.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class UrlController {

    @GetMapping("/")
    public String index(){
        return "index";
    }

    @GetMapping("/welcome")
    public String welcome(){
        return "welcome";
    }

    @GetMapping("/search0")
    public String search0() { return "search0"; }

    @GetMapping("/search1sit")
    public String search1sit(){return "search1sit";}

    @GetMapping("/search1stand")
    public String search1stand() { return "search1stand"; }

    @GetMapping("/search1move")
    public String search1move() {return "search1move"; }

    @GetMapping("/search1panel")
    public String search1panel() {return "search1panel"; }

    @GetMapping("/search2stand_make")
    public String search2stame_make() {return "search2stand_make"; }

    @GetMapping("/search2stand_food")
    public String search2stand_food() {return "search2stand_food"; }

    @GetMapping("/search2stand_food_kimchi")
    public String search2stand_food_kimchi() {return "search2stand_food_kimchi"; }

    @GetMapping("/plan/kimchi")
    public String plan_kimchi() {return "plan/kimchi"; }

    @GetMapping("/plan/kimchi2")
    public String plan_kimchi2() {return "plan/kimchi2"; }

    @GetMapping("/plan/kimchi3")
    public String plan_kimchi3() {return "plan/kimchi3"; }

    @GetMapping("/plan/kimchi4")
    public String plan_kimchi4() {return "plan/kimchi4"; }

}

여기까지네요.

각페이지가 다 연결되었습니다. 공부해보세요. 완성한 Github. 올려보네요.

https://github.com/infott2t/TDD-SB-SmartFactoryEX

 

GitHub - infott2t/TDD-SB-SmartFactoryEX: Hello.

Hello. Contribute to infott2t/TDD-SB-SmartFactoryEX development by creating an account on GitHub.

github.com

또, 교회. 다녀보세요. 기독교. 전화도 해보세요. 사회에서 쉴 곳. 하고 싶은 말이네요.

좋은 하루되세요.

--

저의 글, 봐 주셔서 감사합니다.

 

 

 

 

 

 

 

 

반응형