jHipster 3.4 創建最流行Java Web應用項目最簡單的入門基本教程


jHipster(J潮客)其亮點:

  1. 風頭超勁,席卷歐美,最新全能Java Web開發程式產生器 (java web generator)。
  2. 由Java專家累積的開發經驗,配上各類實用的框架技術,去繁取精的運用,全方位的配置,制成出完備的開發應用程式。
  3. 完美Java體系架構,適合各行各業項目,尤其以適用於面向服務的體系結構(SOA)更為勝任。
  4. 不論菜鳥,老牛或專家,極容易上手,只要你可以下載及建立以下要求的工作環境。
  5. 快速建成一個制作就緒的基本項目工作模版,令你可以用有限的精力專注業務上的運作。
  6. 制作例子包括:jHipster3.4+Spring4.2.6+Spring Boot1.3.5+Hibernate4.3.11+MySQL5.7.12+AngularJs1.5.5

開場白

最近兩,三年(2013-2016),Java 開發領域內刮起一股熱騰騰的潮流風。引起世界各地Java開發者蜂擁跟隨。這就是Java潮客者(J潮客),稱jHipster。根據專家統計,每月下載量約有12000,每月制成的J潮客應用程式有一萬份之多。可惜在國內有關J潮客資料及其應用十分稀少, 故此本文提供一些實用有效的信息。Java愛好者可以一起學習和研究。如果一切順利,不論你是否菜鳥,只需要按照本文提供的步驟工作20-30分鍾(不包括安裝工作環境),即等於一個有5至7年的Java 經驗程式員工作了6個星期的結果:一個完善又先進,配合了Java web 技術趨勢,同時具備了制作就緒的基本工作模版。這就是J潮客(jHipster)閃亮賣點。

早在十多年前在道瓊斯總部打工時, 時常接觸實體或虛撰的Java網絡服務器和應用服務器, 其運作十分復雜費時。 就算現今的有關Java web技術, 各種各類特色繁多。例如Java框架技術有Struts,Spring,Hibernate,iBatis,EJB3.0,JPA,等等;還有不少客戶端的技術,Javascript, jQuery, Easyui, AngularJs, Velocity ; 數據庫有SQL和NOSQL,本文只例舉部份而已。選擇多多,令人不容易適從。去年筆者希望找到更詳細的Spring Framework 4的應用資訊,走遍香港廣州及深圳各書店,仍然空手而返。原因是技術更新太快,有部份資料剛出版已是舊版本。究竟那項技術好,該用什么客戶端,什么樣的數據庫最適用,相信有不少的爭論。而本文的主題是不論菜鳥老手,只要好好地把握當今Java web 技術趨勢,分配本身有限的精力,創造出精彩的Java項目! 有關J潮客的應用,會由淺入深,分數期和各位共同學習,敬請各位讀者留意為要。

簡介J潮客

J潮客(jHipster)是什么東西? 是誰開始的?其實J潮客是開源技術, 在2013年由法國Java專家 Julien Dubois (朱利安 杜波爾斯)率先倡導,至今仍是J潮客項目主導者。簡易直說它是工具集堆綜合技術,意思是由多種技術工具配置而成的Java Web開發程式產生器。好處是由Java專家累積的開發經驗,配上各類實用的框架技術,去繁取精的運用,全方位的配置,制成出完備的開發應用程式,絕對適用於面向服務的體系結構 (SOA).

J潮客包括最先進的Java 8,特色是多用注解, 不用XML 配置的組態,配備了全方位的工作環境,從開發,測試,監控到制成,以及雲部署。能提供最先進的Java 技術如微服務綜合技術 (Microservices)。

主要的技術有以下幾種,簡單介紹而已。如果想知道更多有關這些資訊,可問百度。

  • Spring Boot: 能建成獨立Spring 的應用程式
  • Spring Security: 標准業內的授權和認證
  • AngularJS:  JavaScript的MVC框架客戶端
  • Bootstrap: 來自Twitter,是目前最受歡迎的前端框架
  • REST APIs: 基於Http協議實現資源操作
  • Liquid Database: 數據庫源代碼版本控制
  • CSS3 + 動畫
  • HTML5: 移動開發主導(Mobil First)
  • Full internationalization support: 支持完善的國際化文字
  • Web Socket: 允許用戶在瀏覽器中實現雙向通信,實現數據的及時推送
  • 嵌入式tomcat ,jetty 及undertow

創立項目工具技術選擇多

  1. 自動配置依賴資源:Maven 或 Gradle
  2. 驗證類型: Cookie type, JWT 和OAuth2
  3. 數據庫: SQL 及 NOSQL (MySQL, Postgres, H2)
  4. 高速緩存: EhCache or Hazelcast
  5. 自動化重復任務:實時編輯: GULP 及 Grunt
  6. 各類工具:Yeoman, npm (nodejs), BrowserSync

安裝J潮客 (jHipster)

建立J潮客 (jHipster) 的工作環境是必須的,需要配備有:

  • Java 8 SDK
  • Maven 或 Gradle
  • nodeJs
  • PhantomJS
  • Xcode (ios)
  • Mysql 或 Postgres (Mysql Workbench or pgAdmin3)
  • Git 版本控制
  • STS ide, Eclipse, Intellij IDEA, 其中一個

具體詳細安裝方法,網上多。必須測試好開發環境,各軟件工具以最新版本安全運行。

(有關安裝開源工具-J潮客,對於菜烏來說,可能是一個挑戰,因為它是比較短暫歷史,沒有具體處理步驟提供,故此本文特別加入十分具體詳細安裝步驟顯示。以便對應是否安裝成功。)

安裝 J潮客有多種,本文只推薦本地安裝法,基本可分Windows 8 和 10; ios 和 Linux.

  • Windows 8 和 10: 要用有管理員權益的命令提示符 (cmd)
  •  ios 和 Linux 用終端 terminal,用管理員權益安裝(sudo)

安裝方法:

  安裝 Yeoman: npm install -g yo

  安裝 Bower: npm install -g bower

  安裝 Gulp: npm install -g gulp

  安裝 JHipster: npm install -g generator-jhipster

粗體字是輸入指令(ios):

sudo npm install -g yo

在終端 terminal出現以下的顯示:(你的可能不完全相同,大概相同就可以)

。。。

/usr/local/bin/yo -> /usr/local/lib/node_modules/yo/lib/cli.js 

> yo@1.8.4 postinstall /usr/local/lib/node_modules/yo

> yodoctor

Yeoman Doctor

Running sanity checks on your system

✔ Global configuration file is valid

✔ NODE_PATH matches the npm root

✔ Node.js version

✔ No .bowerrc file in home directory

✔ No .yo-rc.json file in home directory

✔ npm version

  

Everything looks all right!

/usr/local/lib

└── yo@1.8.4

 

sudo npm install -g bower

/usr/local/bin/bower -> /usr/local/lib/node_modules/bower/bin/bower

/usr/local/lib

└── bower@1.7.9

sudo npm install -g gulp

npm WARN deprecated graceful-fs@3.0.8: graceful-fs v3.0.0 and before will fail on node releases >= v7.0. Please update to graceful-fs@^4.0.0 as soon as possible. Use 'npm ls graceful-fs' to find it in the tree.

npm WARN deprecated lodash@1.0.2: lodash@<3.0.0 is no longer maintained. Upgrade to lodash@^4.0.0.

npm WARN deprecated graceful-fs@1.2.3: graceful-fs v3.0.0 and before will fail on node releases >= v7.0. Please update to graceful-fs@^4.0.0 as soon as possible. Use 'npm ls graceful-fs' to find it in the tree.

/usr/local/bin/gulp -> /usr/local/lib/node_modules/gulp/bin/gulp.js

/usr/local/lib

└─┬ gulp@3.9.1

  └─┬ gulp-util@3.0.7

    └─┬ dateformat@1.0.12

      └─┬ meow@3.7.0

        └─┬ loud-rejection@1.4.1

          └── currently-unhandled@0.4.1

sudo npm install -g generator-jhipster

npm WARN deprecated cross-spawn-async@2.2.4: cross-spawn no longer requires a build toolchain, use it instead!

npm WARN deprecated npmconf@2.1.2: this package has been reintegrated into npm and is now out of date with respect to npm

/usr/local/lib

└── generator-jhipster@3.4.0

注意: 安裝最大的問題是網絡通暢,因大部分資源都在外國,你懂的?

ios 和 Linux方面,安裝時常常遇到是權益問題,可用管理員權益處理的。

安裝上述的軟件,各版本如下:

yo@1.8.4

bower@1.7.9

gulp@3.9.1

generator-jhipster@3.4.0

npm@3.9.2

 

下一個步驟當然是要建立J潮客的應用模版。本文例子是要建立一個叫 kenlen 的應用程式模版。

打開一個終端 terminal或 cmd,用管理員權益安裝,選取要安裝的磁盤,輸入以下指令:

mkdir kenlenècd kenlenèyo jhipster

 (以下是螢幕上顯示出來的)

Welcome to the JHipster Generator v3.4.0

Application files will be generated in folder: /Users/Emac/kenlen

? (1/16) Which *type* of application would you like to create? Monolithic application (recommended for simple projects)

? (2/16) What is the base name of your application? kenlen

? (3/16) What is your default Java package name? com.emodak.kenlen

? (4/16) Which *type* of authentication would you like to use? HTTP Session Authentication (stateful, default Spring Security mechanism)

? (5/16) Do you want to use social login (Google, Facebook, Twitter)? Warning, this doesn't work with Cassandra! No

? (6/16) Which *type* of database would you like to use? SQL (H2, MySQL, MariaDB, PostgreSQL, Oracle)

? (7/16) Which *production* database would you like to use? MySQL

? (8/16) Which *development* database would you like to use? MySQL

? (9/16) Do you want to use Hibernate 2nd level cache? Yes, with ehcache (local cache, for a single node)

? (10/16) Do you want to use a search engine in your application? Yes, with ElasticSearch

? (11/16) Do you want to use clustered HTTP sessions? No

? (12/16) Do you want to use WebSockets? Yes, with Spring Websocket

? (13/16) Would you like to use Maven or Gradle for building the backend? Maven

? (14/16) Would you like to use the LibSass stylesheet preprocessor for your CSS? No

? (15/16) Would you like to enable internationalization support? Yes

? Please choose the native language of the application? English

? Please choose additional languages to install Chinese (Simplified), Chinese (Traditional)

? (16/16) Which testing frameworks would you like to use? (Press <space> to select)Gatling

Installing languages: en, zh-cn, zh-tw

   。。。

注意:有顏色的是選擇了那些建立應用程式的配置。

如果網絡通暢,不會出現問題,建立該應用程式不超過30分鍾。但是通常會有些不能下載的資源檔案(jar),就要耐心應付的。如果有問題,怎么辦呢?本文提供了多種方法處理。何況隨時可以問候百度娘的!其中可行方法有:

再輸入以下指令:

npm install

bower install

gulp install

根據筆者經驗,主要是下載POM的依賴資源,可輸入Maven 指令:

mvn clean

mvn install –U 或 mvn install –U --debug

(螢幕顯示出那個Jar沒能下載)

或者轉用淘寶的鏡像,用以下指令:

npm config set registry https://registry.npm.taobao.org

再輸入以上指令。

 

應用程式的測試和運作

當該項目-kenlen應用程式成功創立了,下一步驟就是測試這模版。首先要建立了該程式使用的數據庫。打開MySQL Workbench:(有關MySQL的使用步驟,參考網上MySQL資料)

建立數據庫要求:

scheme name: kenlen

default collation: utf8-utf8_unicode_ci

連接數據庫的用戶名稱:root; 密碼: (無)

在那個剛完成創立kenlen模版的終端 terminal或 cmd里,輸入:

    ./mvnw (ios) 或 ./mvnw spring-boot:run

    mvn (Window 8/10) mvn spring-boot:run

以下是Kenlen開發應用模版各網頁顯示:

源代碼輸入Eclipse STS)或 Intellij IDEA

成功建立了J潮客的應用模版后,當然可以把源代碼輸入Eclipse 或 STS, 方便修改和刪除。輸入前要知道該應用模版用什么工具來配置依賴資源:Maven 或 Gradle。

  1. 配置Eclipse (STS):
  • Maven (推薦使用)
    •  Select File(選擇文件)-> Import
    •  Choose (選擇)“Existing Maven Projects”
    •  Select your project(選擇項目)
    •  Click on “Finish”(點擊“完成”)

按下一步 (Next)

  • 安裝 m2e connectors
    • 輸入項目后,或會出現一個對話視窗選擇安裝那個“Maven plugin connectors“
    • 如果在輸入項目后出現了錯誤,都是沒有安裝這個附件。只需選擇Quick Fix/按Ctrl+1(Cmd的+1在Mac)上的錯誤標記,並選擇“Discover new m2e connectors”來安裝。
    • 排除Node_modules及其他不用驗證檔案目錄,以免產生驗證錯誤
    • 右鍵單擊項目 - >屬性 - >資源 - >資源過濾器
    • 選擇:全部排除,適用於文件夾,名稱相匹配“node_modules“
    • 按“OK”
    • 排除JavaScript及其他不用驗證檔案目錄,以免產生驗證錯誤
    • 右鍵單擊項目 - >屬性 - >Javascript - >包含路徑
    • 點擊“source”選項卡,選擇項目/ src/main/webapp
    • 選擇“Excluded:(None) - >編輯 - >添加多個(以下全部是)
    • 選擇bower_components和scripts,然后單擊“確定”
    • 排除包括(.TMP/; node_modules/; src/main/webapp/dist )

     注意:其實可以不必理會這些驗證錯誤,干脆把這些錯誤刪除就是,就不用這樣煩。

  • Gradle
    • 在 Eclipse Marketplace 下載及安裝 “Gradle Integration for Eclipse”
    • 選擇輸入項目后,單擊 “build.gradle”, 然后單擊“確定”
    • 參考https://jhipster.github.io/configuring-ide-eclipse-gradle/
    • 建議不在 Eclipse 運行項目,只作修改之用。可在終端 terminal測試及運行。

  2.  配置Intellij IDEA:參考https://jhipster.github.io/configuring-ide-idea/

Kenlen 項目Maven結構體如下:

 

Kenlen 項目client結構體如下:

簡單總結一下

       不少成功的秘訣教導:若要在這競爭性越來越強的世界里,需要先人一步; 光做到自強不息是不夠的,必須借助比自己能力強而累積來的經驗,相信這樣一定會事半功倍!或者說現今科學發達,日新月異,資訊繁多,怎么樣才容易跟上? 筆者以為: J潮客就是一個好好學習的例子。基本上,祇用半小時的工作就能得出六星期的工作效果。Kenlen項目有140MBs 資料, 4千多個檔案。 有人統計過:一個完成的Java項目祇需要編輯1200條代碼,其餘91%的全是由J潮客編制而成的。 各位可以親自經歷一下吧! 筆者會分數期與各位分享J潮客的經驗。 例如怎么樣增添網頁;模型實體,業務接口邏輯 ;  Javascript 動畫等等。更深入地討論數據庫的應用。不少高大上的項目都是沿J潮客的途徑而進行的。光是在法國就有一間公司, 內有數百名專家以J潮客方式來完成項目工作。

 Kenlen 項目采用各技術版本記錄:

Spring Boot 1.3.5, Spring 4.2.6, Metric 3.2.1, hibernate 4.3.11, AngularJs 1.5.5, MySQL 5.7.12

怎樣使用壓縮附件:

下載后,解壓在適當磁碟的目錄里。安裝kenlen.sql到MySQL內,打開一個終端 terminal或 管理員權益cmd,輸入指令:

./mvnw (ios) 或 ./mvn spring-boot:run

    mvn (Window 8/10) 或mvn spring-boot:run

最后螢幕出現:

         ----------------------------------------------

         Application 'kenlen' is running! Access URLs:

         Local:                  http://127.0.0.1:8080

         External:    http://192.168.11.5:8080

 ----------------------------------------------

祇需要在常用的瀏覽器輸入:localhost:8080

瀏覽器上就會出現Kenlen應用模版首頁如上面的。

注意: Kenlen壓縮附件已經是完成就緒的開發程式模版。上述所描述的步驟是開發一個全新的項目程式。如果不能啟動的話,首先考慮是否數據庫密碼問題。修改數據庫用戶名稱和密碼是在該檔案內:

   src/main/resources/config/applicationtion-dev.yml

用一般editor打開,在datasource下面(line 23-24)username, password. 請根據本身的規定改正后保存。不然就是本身開發環境不健全吧。該說都全說了!

 

附上隨文例子代碼,以供學習參考,下載后敬請贊助。如果您覺得本文的內容對您的學習或工作有所幫助,您可以贊助來支持我,您的認同就是我動力!支付微信在頂部。多少不拘,5元,10元,20元。。。心意而已!

http://files.cnblogs.com/files/sam8881-Blogs/kenlen1.zip

原創,如有轉載,請注明出處!

筆者以往分享的記錄:

 實用PHP5.2.9+MySQL5.6.26+Easyui 1.41出入口公司產品查詢瀏覽表


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM