应用IntelliJ IDEA开发Web项目 _Web前端

使用IntelliJ IDEA开发Web项目

一、打开IntelliJ IDEA 7.0.3 并新建一个工程文件：

?????? 1、打开Intellij IDEA7.0.3，“File” ――>“New Project”：

?????? 2、“Next”：

?????? 3、更改工程名字和存放路径，如以下例子：

?????? 4、“Next”：

?????? 5、这一步的操作是关联本机的jdk文件目录（第一次需要做，之后就不需要再设定了），找到自己本机里面的JAVA目录下的JDK的目录（如果找不到自己的JDK目录的，说明没有装JDK，那么可以先装JDK -7或者其他版本，然后再找到自己本地的JDK文件夹。同时再装上JRE -7）。
?????? JDK-7下载：http://jdk7.java.net/download.html
?????? JRE-7下载：http://jdk7.java.net/download.html

?????? 6、因为我们要开发的是Web项目，所以勾选Web Application。如果全部都不选，则新建一个纯项目工程。

?????? 到此为止，就应该新建了一个Web 的项目工程，并自动打开该工程。

二、开发Web项目（以一个例子说明）：

?????? 1、打开新建的项目后，把左边的文件夹都展开，然后把Index.jsp文件删除，等一下我们会新建一个Html的文件：

?????? 2、双击打开web.xml，可以修改字体的大小，按下下图的设置按钮：

?????? 3、我们在这里新建一个自己的样式，并命名，如：myfont：

?????? 修改字体样式，比如：

?????? 修改字体大小，比如：15 ：

?????? 4、设置工程的运行方式：

?????? 在此，我们选择以Tomcat Server来打开项目：

?????? 进行到这一步的时候，有可能没有安装Tomcat，那么就要先安装Tomcat（如Tomcat 7.0）：
?????? Tomcat 7.0下载：http://tomcat.apache.org/download-70.cgi 或http://www.skycn.com/soft/58951.html
?????? （安装教程http://user.qzone.qq.com/529901956/blog/1270043200 ）

?????? 按下Fix按钮：

?????? 5、新建Class文件：

?????? 给Class文件一个名字，如：ClassicServer ：

?????? 打开刚刚新建的Class文件之后，把预先准备好的代码复制进来（当然也可以自己写代码开发，这里作为一个例子，预先准备好了代码）：
?????? ClassicServer代码：

?import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;

public class ClassicServer extends HttpServlet {
??? protected void doGet(HttpServletRequest request, HttpServletResponse response)
??????? throws ServletException, IOException {
??????? try{
??????????? response.setContentType("text/html;charset=GB2312");
??????????? PrintWriter out = response.getWriter();
??????????? String old = request.getParameter("name");
??????????? if(old == null || old.length() == 0){
??????????????? out.println("用户名不能为空");
??????????? } else{
??????????????? String name = new String(old.getBytes("ISO8859-1"));
??????????????? if(name.equals("wangxingkui")){
??????????????????? out.println("用户名[" + name + "]已经存在，请使用其他用户名");
??????????????? } else{
??????????????????? out.println("用户名[" + name + "]尚未存在，可以使用该用户名注册");
??????????????? }
??????????? }
??????????? out.println("<br/><a href=\"index.html\">返回校验页面</a>");
??????? } catch(Exception e){
??????????? e.printStackTrace();
??????? }
??? }
??? protected void doPost(HttpServletRequest request, HttpServletResponse response)
??????? throws ServletException, IOException {
??????? doGet(request,response);
??? }
}

?????? 把代码复制进来之后，作为演示，我们在这里先把public class以下的代码选中并且按Ctrl+/(?)键以把这段代码转换为注释：

?????? 把public class以上的代码选中并删去：

?????? 此时，有一部分代码会变成红色，说明这部分代码运行的时候会出错，于是我们把鼠标光标放在红色的代码上面，按下Alt+Enter，即可自动修复错误代码：

?????? 6、新建Html或者Xhtml文件，这里我们新建的是Html文件：

?????? 输入Index，不用加后缀，它会自动添加后缀名：

?????? 双击打开Index.html，把预先准备好的代码复制输入（作为演示）：
?????? Index代码：

?<html>
<head>
? <title></title>
</head>
<body>
??? 校验用户名是否存在的例子<br/>
??? <form action="ClassicServer" method="GET">
??????? 用户名：<input type="text" name="name"/>
??????? <input type="submit" value="检验"/>
??? </form>
</body>
</html>

?????? 切换到web.xml，手工输入以下蓝色区域的内容，注意其中的ClassicServer要对应回Index.html里面的ClassicServer：

?????? 7、切换到ClassicServer.java，再次选中public class以下的内容，Ctrl+/(?)把代码恢复会代码模式：

?????? 8、再次把鼠标光标放在红色的代码上面，按下Alt+Enter，即可自动修复错误代码：

?????? 9、最后把项目部署到Tomcat Server上：
?????? 点击绿色三角箭头按钮：

?????? 点击Run按钮：

?????? 按了Run按钮后，将会自动弹出一个页面显示出我们所做的web项目的内容。

1 楼 key87 2011-08-04

lz，看不到图片

2 楼 fancyleeo 2012-04-19

图挂了，不过还是谢谢了！