IntelliJ IDEA 开发Web应用图文教程

1. 简介

Eclipse/MyEclipse确实用起来诸多不爽,准备切换IntelliJ IDEA,本篇介绍如何配置IDEA并使用IDEA开发一个Web应用。

2. 软件下载与安装

1,首先下载安装JDK并配置环境变量。

JDK安装目录D:\Java\jdk1.7.0_79
新建环境变量JAVA_HOME,其值为D:\Java\jdk1.7.0_79
环境变量PATH中添加 %JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;
新建环境变量(如果已有CLASSPATH则在其起始位置添加 .;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar;(最开始有个小数点)

2,下载Tomcat并解压到D:\Java\apache-tomcat-7.0.73

3,下载并安装IntelliJ IDEA 2016.3.4,这里尽量安装2016版本的,其他版本可能跟下面截图中不大一样哦。安装过程比较简单,一直下一步下一步就行,不再具体介绍。

3. 创建Project

1,首先必须做一个说明,在IDEA中有两个非常重要的概念分别为Project和Module,注意Project是指的工作空间,而Module指的是工作控件下面的一个应用,比如一个Web应用就是一个Module。(IDEA中的Project相当于MyEclipse中的Workspace,而IDEA中的Module相当于MyEclipse中的Project)

2,新建一个目录IntelliJProject,用作IDEA项目的一个工作空间保存目录。此处为:D:\Java\IntelliJProject

3,打开IDEA,界面如下,选择Create New Project创建一个工作空间。
这里写图片描述

4,在New Project界面,注意选择Project SDK为之前下载的版本,然后Next
这里写图片描述

5,不选中Create project from template,我们不用模版,自己创建一个纯净的项目。然后Next
这里写图片描述

6,Project location选中之前设定的目录D:\Java\IntelliJProject,同时将Project name设为IntelliJProject(也可以跟目录不同名,但是建议同名,比较好记忆)。然后Finish完成Project的创建。
这里写图片描述

7,至此Project创建完毕,项目结构如图:
这里写图片描述

4. 创建Module

1,右键点击项目名称IntelliJProject,选择New-Module,打开新建Module窗口,注意因为要开发web项目,所以选择Web Application,同时创建一个web.xml,所以选中Create web.xml选项。点击Next。
这里写图片描述

2,Module name可设置为FirstModule,点击Finish。
这里写图片描述

3,此时项目结构如图,在工作空间IntelliJProject下有一个FirstModule应用,且已有web.xml配置文件和一个index.jsp网页。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-3Res2WdG-1581740772113)(https://img-blog.csdn.net/20170527174439466?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvd29zaGlzYW5nc2FuZw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)]

4,创建必要的classes和lib文件夹,classes用来放置编译后的类,lib用来放置导入的包,都是需要的文件夹。创建方法:右击WEB-INF,选择New-Directory。
这里写图片描述

5. 项目目结构设置

1,虽然已经创建了classes和lib,但是此时项目并不知道这两个文件夹的作用,需要配置一番。

2,选择IDEA菜单栏的File-Project Structure,然后点击Project Structure窗口左侧菜单栏的Module,如图:
这里写图片描述

3,在中间一栏选中FirstModule,然后选择path选项卡,配置Output path和Test output path为classes目录,然后点击Apply,如图:
这里写图片描述

4,选择Dependencies选项卡,点击**+**,选择lib目录,如图:
这里写图片描述

5,在弹出的窗口选择Jar Directory,然后点击Apply。如图
这里写图片描述

6. 配置Tomcat服务器

1,选择菜单栏Run-Edit Configurations,在打开的窗口的左侧点击**+**符号添加Tomcat。
这里写图片描述

2,将Name设置为Tomcat7,点击Configure,配置之前下载的Tomcat如图,然后点OK
这里写图片描述

3,去掉After Launch之前的勾,然后点击Apply即可。注意默认端口8080
这里写图片描述

7. 部署web应用并运行

1,修改index.jsp代码为:

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>第一个网页</title>
  </head>
  <body>
  测试网页
  </body>
</html>

2,在Run-Edit Configurations窗口选中刚刚建立的Tomcat7容器,然后选择Deployment,点击右边的**+**号,选择Artifact如图:
这里写图片描述

3,选择之前的FirstModule,配置其Application context为**/FirstApp**如图,然后点击OK
这里写图片描述

4,在最下方Application Servers窗口左侧的启动按钮,启动Tomcat
这里写图片描述

5,出现信息信息: Server startup in 149 ms,表示启动完成。

6,在浏览器地址栏输入:http://localhost:8080/FristApp/index.jsp
注意FirstApp即为配置的Application context,页面如下,成功了!
这里写图片描述


如有问题请扫码联系我
在这里插入图片描述

已标记关键词 清除标记
©️2020 CSDN 皮肤主题: 代码科技 设计师:Amelia_0503 返回首页