في الآونة الأخيرة ، كنت أتعلم حذاء الربيع. إن تعلم الإطار ليس أكثر من استخدامه لفعل ما فعلته من قبل. الاثنان مختلفان. دعني أخبرك بما جربته باستخدامه.
دعنا نتحدث عن SPRING BOOT أولاً ، microframework. التطوير السريع يعادل التكوين صفري. من وجهة نظر الماجستير: تمهيد الربيع يعادل إطارًا للإطار ، وهو الكثير من عمليات الدمج. فقط أضف التبعيات التي تكفي عليها. بهذه الطريقة ، لن ترى التكوين بنفسك. للمطورين الذين اعتادوا على استخدام التكوينات ، قد لا يزالون غير مألوفين بعض الشيء مع المطورين الذين استخدموا للتو حذاء الربيع. لا يحتاجون إلى مطابقة أي شيء. لا يرون التكوين. أشعر بأنني غير مألوف بعض الشيء مع العمارة العامة للمشروع. الى جانب ذلك ، باستخدام thymeleaf في الحذاء الربيعي. دعنا نأخذ أبسط مثال لتوضيح أن JSP يعرض HelloWorld ، ويظهر ThymeLeaf HelloWorld. يختلف الاثنان عن تكوين تبعيات مقدمة ملف POM وملفات السمات. عند استخدام JSP ، لا تقدم تبعيات Thymeleaf. بالطبع ، لا تقدم تبعيات JSP عند استخدام Thymeleaf. قد يسبب صراعات. يوصي مسؤول الحذاء الربيعي باستخدام Thymeleaf. أنا شخصياً أشعر أنه جيد ، لنبدأ المشروع!
1. قم أولاً ببناء مشروع meaven وشاهد الهيكل العام للمشروع المبني
بناء بنية المشروع واستخدم pom.xml. يستخدم هذا العرض التوضيحي فقط Thymeleaf. لا توجد تبعيات لقاعدة البيانات وبعض التبعيات مطلوبة.
<project xmlns = "http://maven.apache.org/pom/4.0.0" http://maven.apache.org/xsd/maven-4.0.0.xsd "> <Dodeversion> 4.0.0 </modelversion> <roupl> springboot_bootstrap </groupid> </insifactid> springboot_bootstrap </artifactid> <roupl> org.springframework.boot </groupId> <StifactId> Spring-boot-starter-parent </artifactId> <sored> 1.4.7.Release </version> <recbatepath/> <!-Lookup Parent من Respository-> </parent> <parties> <project.build.sourceencoding> utf-8 </project.build.sourceencoding> <project.reporting.outputencoding> utf-8 </project.reporting.outputencoding> <java.version> <roughid> org.springframework.boot </rougiD> <StifactId> Spring-Boot-Starter </stifactid> </syperency> <reperence> <roupl> org.springframework <roupl> org.springframework.boot </groupId> <StifactId> Spring-boot-starter-thymelef </shintifactid> </premited> </rependencies> </sults> </build> </project>
إنشاء ملف Application.Properties في SRC /MAIN /المورد
server.port = 8080 server.session.timeout = 10 server.tomcat.uri-encoding = utf-8 spring.thymeleaf.prefix = classpath:/views/spring.thymeleaf.suffix = .html spring.thymeleaf.mode = html5 spring.thymeleaf.encoding = spring.ThymeLeaf.cache = خطأ
كتابة برنامج المنفذ
حزمة com.zanghan.youyu ؛ استيراد org.springframework.boot.springapplication ؛ استيراد org.springframework.boot.autoconfigure.SpringBootApplication ؛ springbootapplication الفئة العامة youyuapplication {public static void main (string [] args) {springapplication.run (youyuapplication.class ، args) ؛ }} وحدة تحكم القفز واجهة bootstrap
حزمة com.zanghan.youyu.controller ؛ استيراد org.springframework.stereotype.controller ؛ استيراد org.springframework.web.bind.annotation.requestmapping ؛ controller الفئة العامة logincontroller { @requestmapping ("/") public string index () {return "/index" ؛ }}أين تقدم Bootstrap JS CSS؟ ضعه في المجلد الثابت ، يتم وضع الصفحة في طرق العرض
يتم تخزين واجهة index.html في مجلد العرض تحت SRC/Main/Resource. لماذا ليس زملائه؟ نظرًا لكتابة المحتوى في ملف تكوين الخصائص باستخدام طرق عرض ، يمكن تغيير بادئة وتلويح Thymeleaf.
<! doctype html> <html xmlns = "http://www.w3.org/1999/xhtml" xmlns: th = "http://www.thymeleaf.org" xmlns: sec = "http://www.thymeleaf.org/thymeleaf-extras-springsecurity3"> <head> <meta charset = "utf-8"/> <meta http-equiv = "x-ua- content" content = "ie = edge"/> scale-scale = 1 "/> <title> mes platform </title> <!-bootstrap-> <link th: href =" {bootstrap/bootstrap/css/bootstrap.min.css} "rel =" stylesheet "/> <! Th: href = "@{bootstrap/font-awesome/css/font-awesome.min.css}" rel = "stylesheet"/> <! Th: href = "{bootstrap/sidebar-menu/sidebar-menu.css}" rel = "stylesheet"/> <link Th: Th: href = "{bootstrap/ace/css/ace-skins.min.css}" rel = "STYLESHEET"/> <script th: src = "{bootstrap/jQuery-1.9.1.min.js}"> </script> <script> Th: src = "{bootstrap/bootstrap/js/boutstrap.min.js}"> </script> <script th: src = "{bootstrap/sidebar-menu/sidebar-menu.js} Th: src = "{bootstrap/bootstrap/js/bootstrap-tab.js}"> </script> <!-[إذا كان lt ie 9]> <script src = "/scripts/html5shiv.js <style type = "text/css"> body {font-size: 12px ؛ } .nav> li> a {padding: 5px 10px ؛ } .tab-content {padding-top: 3px ؛ } </style> </head> <body> <div id = "navbar"> <ul> <a id = "menu-toggler" href = "#" </a> </ul> <div rob = "savigation"> <ul> <li style = "الارتفاع: 50px ؛"> <a data-toggle = "tropown" href = "#"> <img src = "content/ace/avatars/avatar2.png"/> <span> مرحبًا ، </small> <a href = "#"> <i> </i> الإعدادات </a> </li> <li> <a href = "#"> <i> </i> الملف الشخصي </a> </li> <li> </li> </li> </li> </li> </li> </li> </li> </li> </li> </li> </li> </viv> </viv> <div id = "main-container"> <viv> <div id = "sidebar"> <div id = "sidebar"> <div id = "side-collapse" style = "display: none ؛ id = "menu"> </ul> </viv> <viv> <viv> <viv> <viv> <viv> <div> <div style = "padding-left: 5px ؛"> <ul rom = "tableist"> <li> <a href = "#index" style = "tab" table = "tab" rob = "tabpanel" id = "index" style = "الارتفاع: 100 ٪"> <h2> مرحبًا بكم في نظام إدارة الواجهة الخلفية </h2> </viv> </viv> </viv> </viv> </viv> </viv> </viv> <script type = "text/javaScript"> $ (function () {$ ('#menu'). sideBarmenu ({data: [{id: '1' ، النص: "إعدادات النظام" ، أيقونة: "Icon-Cog" ، url: '' ، menus: [{id: '2' ، text: 'coding management 1' '، icon:' icon-glass '، url: أيقونة: 'icon-glass' ، url: '' ، menus: [{id: '2' ، النص: "إدارة الترميز 1" ، أيقونة: "Icon-Glass" ، url: '' ،} ، {id: '3' ، text: 'coding Management 2' ، icon: 'icon-glass' ، url: '، "Icon-Glass" ، url: '' ،}]}]}]}]}]}) ؛ $ ($) .Removeclass ("icon-double-alft"). $ ("#الشريط الجانبي"). </script> <script th: src = "{bootstrap/ace/js/ace-extra.min.js}"> </script> <script th: src = "@{bootstrap/ace/js/ace.min.js}قم بإنجازه ، وتشغيل التطبيق وأدخل مضيف محلي: 8080
ما سبق هو كل محتوى هذه المقالة. آمل أن يكون ذلك مفيدًا لتعلم الجميع وآمل أن يدعم الجميع wulin.com أكثر.