在本系列博客中，我們將使用Springboot，Angular等構建完整的Web應用程序。

在上一個博客中，我們與Thymeleaf建立了基本的登錄頁面。 在此博客中，我們將介紹bower ，它用于管理前端依賴項，例如CSS，JS。

1.）涼亭
使用此鏈接安裝bower。 安裝涼亭后，我們需要對其進行配置以在我們的應用中使用。 要配置Bower，我們只需在項目的根文件夾中添加兩個文件，即.bowerrc文件和bower.json文件。 .bowerrc文件可幫助我們配置依賴項應放在哪個目錄中。 默認情況下，它會在當前目錄中創建一個bower_components文件夾，但我們希望將其放入src / main / resources / static中，因為默認情況下，Spring會在該位置拾取所有靜態資源，并使它們可供使用。

.bowerrc文件：

{"directory": "src/main/resources/static/bower_components","json": "bower.json" }

然后運行：

$ bower init

這將在您的根文件夾中安裝文件bower.json。 下一步是將Jquery和Bootstrap依賴項添加到我們的應用程序中，這可以通過以下命令完成：

$ bower install --save jquery bootstrap

現在我們已經為我們的應用程序配置了Jquery和bootstrap，讓我們為應用程序創建一個漂亮的登錄頁面。 要找到目標網頁的模板，我們可以在此處簽出任何設計：
http://startbootstrap.com/有一些很酷的免費html模板，選擇任何一個并下載源文件。

例如，我下載了此模板： http : //blackrockdigital.github.io/startbootstrap-freelancer/
要使其作為我們的主頁工作，我們需要執行以下操作：
1）將內容index.html文件復制到我們的index.html中。 2）用我們的bower_components路徑替換所有的bootstrap / JQuery CSS / JS路徑。 3）復制下載的所有自定義CSS或JS文件，并將其放在我們應用程序的靜態文件夾中，在index.html中更新其路徑 4）將所有字體，圖像等靜態文件復制到靜態文件夾中，并在index.html中更新其路徑

現在讓我們使用mvn clean package構建我們的應用程序，并使用mvn spring-boot運行它：

如果所有路徑都正確并且所有文件都存在。 我們將擁有漂亮的響應式登錄頁面作為我們的主頁。

在下一個博客中，我們將添加登錄/注銷/注冊功能，并為客戶端MVC添加Angular。

翻譯自: https://www.javacodegeeks.com/2016/05/build-new-web-application-scratch-using-spring-boot-thymeleaf-angularjs-part-2.html

總結

以上是生活随笔為你收集整理的使用Spring boot，Thymeleaf，AngularJS从零开始构建新的Web应用程序-第2部分的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。