jHipster3.4创建Java Web应用项目最简单的入门基本教程

开场白

最近两，三年（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) 或 ./mvn 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及其他不用验证档案目录，以免产生验证错误
  1. 右键单击项目 - >属性 - >资源 - >资源过滤器
  2. 选择：全部排除，适用于文件夹，名称相匹配“node_modules“
  3. 按“OK”
• 排除JavaScript及其他不用验证档案目录，以免产生验证错误
  1. 右键单击项目 - >属性 - >Javascript - >包含路径
  2. 点击“source”选项卡，选择项目/ src/main/webapp
  3. 选择“Excluded:（None） - >编辑 - >添加多个(以下全部是)
  4. 选择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. 请根据本身的规定改正后保存。不然就是本身开发环境不健全吧。该说都全说了！

笔者以往分享的记录：

PHP5.2.9+MySQL5.6.26+Easyui 1.41开发易贸达出入口公司产品查询浏览表