나도아빠다
2k
2019-02-03 00:55:16
5
640

Spring으로 MongoDB, Jade를 사용하자! 1부 spring boot + jade4j


그냥 express로 해! 라고 외치고싶지만,

저도 하면서 이게 왠삽질인가.. 싶습니다만.. 일단 스프링이 지원해준다니 한번 해봤습니다.

하면 할수록 express가 그립습니다만.. 나름 스프링에도 장점은 있을거라 믿으며..?!


일단 simple SpringBoot + mongoDB + jade4j 설명드리겠습니다.


준비물.

일단 전 이클립스 유저라.. STS 기준으로 설명드립니다~


1.일단 심플하게 스타터 프로젝트로 가즈아! 전 운동권이니 이름은 데모로..(아재개그정도는 넘기시고)


2. 사소한건 넘어가고, 간편하게 날씬한 dependency 설정합니다.

데모니 web, mongo-DB만 체크하고 넘기겠습니다. 멋있게 하시려면 JPA도 연결가능하지만, 지금은 패스.



3. 그대로 과감하게 finish눌러서 넘겨버립시다. 꿈에 그리던(?) Demo가 만들어졌습니다.


4. 먼저 테스트 화면부터 찍어야죠.. 진작에 이야기한 jade4j설치 합시다.

		<dependency>
		  <groupId>de.neuland-bfi</groupId>
		  <artifactId>spring-jade4j</artifactId>
		  <version>1.2.7</version>
		</dependency>

pom.xml의 dependencies에 이거 추가해주시면 알아서 설치완료.


5. 이제 진짜 화면찍을 준비를 해줘야겠네요. 우선, viewResolver를 JadeViewResolver로 설정하겠습니다.

우선 적당히 관리를 위해 com.example.demo.config패키지 생성해주시고, 거기에 JadeConfig파일을 생성하겠습니다.

package com.example.demo.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.ViewResolver;

import de.neuland.jade4j.JadeConfiguration;
import de.neuland.jade4j.spring.template.SpringTemplateLoader;
import de.neuland.jade4j.spring.view.JadeViewResolver;

@Configuration
public class JadeConfig {

	@Bean
	public SpringTemplateLoader templateLoader() {
		SpringTemplateLoader templateLoader = new SpringTemplateLoader();
		templateLoader.setBasePath("/WEB-INF/views/");
		templateLoader.setEncoding("UTF-8");
		templateLoader.setSuffix(".jade");
		return templateLoader;
	}

	@Bean
	public JadeConfiguration jadeConfiguration() {
		JadeConfiguration configuration = new JadeConfiguration();
		configuration.setCaching(false);
		configuration.setTemplateLoader(templateLoader());
		return configuration;
	}

	@Bean
	public ViewResolver viewResolver() {
		JadeViewResolver viewResolver = new JadeViewResolver();
		viewResolver.setConfiguration(jadeConfiguration());
		return viewResolver;
	}
}

깔끔하게 파일하나에 jadeConfiguration과 viewResolver를 한데 몰아주고 뷰 설정 땡칩시다.


6. 이제 만들어봅시다.

src/main/ 밑에

webapp/WEB-INF/views/까지 줄줄이 폴더생성합시다.

왜 resources/template두고? 라고 물으시면.. 솔직히 말하자면 저 폴더로 basePath 설정잡는방법 아직 못찾았습니다. 죄송합니다.ㅠ

views/ 폴더아래에 new > file 을 이용해서 index.jade 파일을 만듭시다.


현재 상태를 스크린샷으로 남겨보면,

요 상태가 되면 성공입니다.


7. index.jade에는 우리가 사랑하는 hello! world!를 찍어볼까요

우선 컨트롤러 만들러 갑시다~!

com.example.demo.controller 패키지 생성해주시고 IndexController.java 를 만들게요

package com.example.demo.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class IndexController {
	
	@RequestMapping("/index.do")
	public String index(Model model) {
		model.addAttribute("world", "세계");
		return "index";
	}
}

간편한 헬로 월드용 컨트롤러 생성 끗.

이제 index.jade에 내용 채우러 고고

doctype html
html
	head
		title= world
	body
		h1 hello #{world}

이제 준비 완료돼었습니다.

boot 대시보드에서 demo를 스타트 하시거나, DemoApplication.java파일 열어서 실행!

그리고 localhost:8080/index.do 를 접속하시면


정상적으로 페이지가 뜬다면 성공입니다! 축! 하!


다음시간에 mongoDB와 연결하는 부분 완료하고, 간단하게 jade사용법 설명으로 넘어갈게요!

그럼 다음시간까지 굿바이!

1
0
  • 댓글 5

  • 한판만
    262
    2019-02-03 04:01:39

    jade가 명칭관련해서 소송문제로 pug로 변경된 것 같던데 아직도 jade 디펜던시가 사용가능한가요?

    0
  • 잠만보 
    4k
    2019-02-03 09:01:43 작성 2019-02-03 09:03:34 수정됨

    src/main/resources가 classpath로 잡혀있어서

    classpath:/templates 하시면 될겁니당.


    다른 템플릿 엔진도 기본값으로 classpath:/templates를 사용할 겁니다.

    0
  • 나도아빠다
    2k
    2019-02-03 10:02:35

    @한판만

    기존 jade시절 나온 라이브러리고, 다른사람이 만든거라.ㅎㅎ 

    분쟁패배했다고 기존에 jade기반으로 만든 다른 파생된 오픈소스 이름까지 다 문제가된건 아니더라구요. 

    만약 문제가 생기거나 pug2.0기반으로 업데이트 된다면 다시 pug4j같은이름으로 나오지않을까 싶습니다. 


    @잠만보

    SpringTempleteLoader클래스 까서 보니 아무래도 바로 classpath: 로 들어간 url은 적용이 안될거같습니다...

    처리방식은 internalResourceView기반 같은데 오버라이딩해서 손좀 봐야 제대로 될거같더라구요 일단은 뒤로 미뤄둔상태입니다..

    1
  • 잠만보 
    4k
    2019-02-03 10:50:39

    spring-boot-starter-jade4j를 사용해도 좋을것 같네요.

    SpringTemplateLoader도 ResourceLoader를 사용하고 있으니 prefix 가능할 겁니다.



    0
  • 나도아빠다
    2k
    2019-02-03 11:00:04 작성 2019-02-03 11:01:01 수정됨
    아마 제가 별도로 클래스패스 주는걸 깜박했거나 했을수도 있겠지요. 일단은 성공사례위주로 먼저 글올렸습니다 ㅎㅎ
    링크주신 Bootstarter는 붙이다가 오류 발생해서 잠시 치워놨습니다. 
    그래들로 패키징을 주로하시는 분이 만든건지 메이븐으로 가져오니 어디선가 에러발생.. 
    원인 천천히 확인해보고 업데이트하겠습니다
    0
  • 로그인을 하시면 댓글을 등록할 수 있습니다.