SpringBootシリーズ教程web編のBeetl環境構築

前の二つのページでは、現在流行しているテンプレートエンジンFreemakerとThymeleafがウェブアプリケーションを構築する方式を紹介しています.次に、性能が一番いいという国産のテンプレートエンジンBeetlを見てみます.どうやってウェブ環境を構築しますか?
この文章は主に公式文書から来ています.http://ibeetl.com/guide/#beetl
I.準備
1.依存
まず私達はspringbootプロジェクトが必要です.基本的なpom構造は大体似ています.

    org.springframework.boot
    spring-boot-starter-parent
    2.0.4.RELEASE
     



    UTF-8
    UTF-8
    Finchley.RELEASE
    1.8



    
        
            
                org.springframework.boot
                spring-boot-maven-plugin
            
        
    


    
        spring-milestones
        Spring Milestones
        https://repo.spring.io/milestone
        
            false
        
    

このプロジェクトでは、私たちは主に2つの依存パッケージを導入する必要があります.ウェブ、1つのオフィシャルbeetl-framework-starter、現在の最新バージョンは1.2.12.RELEASEです.

    
        org.springframework.boot
        spring-boot-starter-web
    
    
        com.ibeetl
        beetl-framework-starter
        1.2.12.RELEASE
    

2.設定パラメータ
通常は、デフォルトのthymeleafパラメータ構成をそのまま使用すればいいです.以下にいくつかのよく使われている構成を提供します.

beetl:
  enabled: true
  suffix: btl
beetl-beetlsql:
  dev: true #          

II.プロジェクト構築デモンストレーション
1.プロジェクト構造
ウェブプロジェクトを構築するのは前の純粋なバックエンドプロジェクトとはちょっと違って、フロントエンドのリソースはどこに置いていますか?
前の図のように、フロントエンドのリソースファイルはデフォルトではレスポンスディレクトリの下にあります.下に二つのディレクトリがあります.

templates:テンプレートファイルを保存すると、私たちが作成したものと理解できます.このファイル名に問題がないように注意してください.

static:js、css、イメージなどの静的リソースファイルを保存する

2.Resetサービス
ここでは三つのインターフェースを提供しています.主に三つの異なるデータバインディング方式を実証するためです.

@Controller
public class IndexController {

    @GetMapping(path = {"", "/", "/index"})
    public ModelAndView index() {
        Map data = new HashMap<>(2);
        data.put("name", "YiHui Beetl");
        data.put("now", LocalDateTime.now().toString());
        return new ModelAndView("index.btl", data);
    }

    private static String[] contents =
            ("       ，      。
       。
     ，     。
       ，      。
       。
     ，     。").split("
");
    private static Random random = new Random();

    @GetMapping(path = "show1")
    public String showOne(Model model) {
        model.addAttribute("title", "   ");
        model.addAttribute("content", contents[random.nextInt(6)]);
        return "show1.btl";
    }

    @GetMapping(path = "show2")
    public String showTow(Map data) {
        data.put("name", "Show2---->");
        data.put("now", LocalDateTime.now().toString());
        return "show2.btl";
    }
}

上の3種類のcaseの中で

最初の一つは、ModelAndViewを作成する際に、view Nameとデータ

に入ることができるということです.

の第二は、インタフェースパラメータModelを介して、viewに転送されるデータ

を設定することである.

第3の種類は、直接Mapを使用してデータを転送する

である.
注意
前の2つのブログと比較すると、著しい違いが発見されます.以前のFreemaker、Thymeleafがビュー名を指定したとき、拡張子は必要ありませんでした.しかし、ここでは、拡張子を付けなければなりません.さもなければ、500のエラーが発生します.
三つのインターフェース、対応する三つのbtlファイルは、以下の通りです.
index.btl

    
    
    
    
    
    
    




    
hello world!
    

    
      ${name}
    

    
     ${now}
    

      2テスト     
      3テスト

show 1.btl

    
    
    
    
    
    
    




    
${title}
    
${content}

show 2.btl

    
    
    
    
    
    
    




    
${name}
    
${now}

上のテンプレートファイルでは、cssパターンファイルを参照する必要があります.パスの前にstaticがありません.対応するcssファイルです.
index.css

.title {
    color: #c00;
    font-weight: normal;
    font-size: 2em;
}

.content {
    color: darkblue;
    font-size: 1.2em;
}

.sign {
    color: lightgray;
    font-size: 0.8em;
    font-style: italic;
}

3.プレゼンテーション
プロジェクトを起動すると、3ページの切り替えが見られます.テンプレートのデータはバックエンドの戻りによって置き換えられます.特にホームページの時間は、更新するたびに変わります.
II.その他
0.プロジェクト&シリーズ記事

190822-SpringBootシリーズ教程web編のBeetl環境構築

190820-pringBootシリーズ教程web編のThymeleaf環境構築

190816-SpringBootシリーズ教程web編のFreemaker環境構築

プロジェクト:https://github.com/liuyueyi/spring-boot-demo

プロジェクトの住所:https://github.com/liuyueyi/spring-boot-demo/tree/master/spring-boot/206-web-beetl

1.灰色のBlog
本を信じているなら、上記の内容はまったくの家族の話です.個人の能力には限りがありますので、どうしても漏れと間違いがあります.もしバグを発見したら、もっといい提案があります.批判と指摘を歓迎します.感謝の意を表します.
以下は灰色の個人ブログです.勉強と仕事中のブログを記録します.

灰色のBlogの個人のブログhttps://blog.hhui.top

灰色のBlog-sppringのテーマのブログhttp://spring.hhui.top