IDEA创建JavaWeb项目(保姆级别)

文章目录

    • 1.1 原始的 Web 项目
      • 1.1.1 创建 Java web 项目
      • 1.1.2 完善项目结构
      • 1.1.3 依赖添加
      • 1.1.4 部署服务器(Tomcat)
      • 1.1.5 启动项目
    • 1.2 使用 Maven 创建 Web 项目
      • 1.2.1 使用 maven 创建 web
      • 1.2.2 配置编译路径和jar包存放位置
      • 1.2.3 部署服务器(Tomcat)
      • 1.2.4 启动项目
    • 1.3 问题
      • 1.3.1 版本过高或过低

1.1 原始的 Web 项目

本文使用 IDEA 2021.2.4 版本,有些选项不同,但是大同小异

1.1.1 创建 Java web 项目

  1. 打开 IDEA ,点击 【Create New Project】创建一个新项目

    IDEA创建JavaWeb项目(保姆级别)_第1张图片

  2. 选择创建Java项目,再点击【Next】

    IDEA创建JavaWeb项目(保姆级别)_第2张图片

  3. 无需勾选,直接点击【Next】

    IDEA创建JavaWeb项目(保姆级别)_第3张图片

  4. 填写【Project name】项目名称,其他无需动,再去点击【Finish】

    IDEA创建JavaWeb项目(保姆级别)_第4张图片

  5. 右键单击项目名称,选择【Add Framework Support】为此项目添加框架

    IDEA创建JavaWeb项目(保姆级别)_第5张图片

  6. 找到 Java EE,勾选【Web Application】,再勾选【Create web.xml】创建 web.xml 文件,最后点击【OK】

    IDEA创建JavaWeb项目(保姆级别)_第6张图片

  7. 目前为止,我们已经创建了 Web 项目,目录结构如下

    IDEA创建JavaWeb项目(保姆级别)_第7张图片

1.1.2 完善项目结构

上述步骤我们创建了一个 Java web 项目,但是如 上述目录结构图中目录无法满足我们的项目需求,接下来我们来完善下项目的结构。

  • web 目录来存放 前端代码
  • src 目录来存放 Java后端代码

接下来我们在 web 目录下,创建下述几个目录

  • css:用来存放 CSS 样式代码
  • js:用来存放 js 代码
  • image:用来存放图片
  • page:用来存放前端页面文件,包含 JSP 页面

最后,我们在 web/WEB-INF 目录下,创建此目录

  • lib:用来存放项目所需要的依赖包

完成效果如下图所示:

IDEA创建JavaWeb项目(保姆级别)_第8张图片

1.1.3 依赖添加

对于 lib 目录下的 jar 包文件(项目所需要的依赖),我们不能只是单纯复制过来,我们还需要将其添加到项目中去,我们可以选中 jar 包,右键选择【Add as Library】

IDEA创建JavaWeb项目(保姆级别)_第9张图片

接着弹出如下界面,点击【OK】即可

IDEA创建JavaWeb项目(保姆级别)_第10张图片

最后出现下图所示,代表添加成功

IDEA创建JavaWeb项目(保姆级别)_第11张图片

1.1.4 部署服务器(Tomcat)

Tomcat 的安装如此篇文章所示

  1. 接下来,我们在 IDEA 中部署服务器,找到并点击右上角的【Add Configuration】,点击左上角 "+"号,向下拉,找到并点击【Tomcat Server\Local】,最后点击【OK】

    IDEA创建JavaWeb项目(保姆级别)_第12张图片

  2. 选中【Application server】,去自己的磁盘中选择你安装的 tomcat,再点击下边的 【Fix】部署即可

    IDEA创建JavaWeb项目(保姆级别)_第13张图片

  3. 找到【Application context】,这里我去修改成TestWeb,也可以不用动,再点击【OK】==这里的Application context就是访问URL:==http://localhost:8080/TestWeb/

    IDEA创建JavaWeb项目(保姆级别)_第14张图片

1.1.5 启动项目

点击Tomcat后的绿色小三角,启动项目,会自动弹出浏览器页面,显示 index.jsp页面中的内容

我们修改 index.jsp 页面中的内容为 hello java web,并启动服务

IDEA创建JavaWeb项目(保姆级别)_第15张图片

1.2 使用 Maven 创建 Web 项目

1.2.1 使用 maven 创建 web

maven的安装和配置可参考这篇文章

  1. 打开 IDEA,点击【New Project】

    IDEA创建JavaWeb项目(保姆级别)_第16张图片

  2. 选择【Maven】,勾选【Create from archetype】,找到图示模板,点击 【Next】

    IDEA创建JavaWeb项目(保姆级别)_第17张图片

  3. 输入项目名称,后点击【Next】

    IDEA创建JavaWeb项目(保姆级别)_第18张图片

  4. 第一次使用,配置我们自己的 maven ,点击【Finish】

    IDEA创建JavaWeb项目(保姆级别)_第19张图片

  5. 确保你的 pom.xml 信息正确,这里很明显是错误的,我使用的是 JDK 1.8

    IDEA创建JavaWeb项目(保姆级别)_第20张图片

  6. 完善项目结构,分别创建下述目录

    • src/main/java:用来存放 Java 代码
    • src/main/resources:用于存放各种资源文件或配置文件
    • src/main/webapp/WEB-INF/classes:用于存储项目编译后的 Java 字节码文件,即 .class 文件
    • src/main/webapp/WEB-INF/lib:用于存放外部引入的 jar 包

    IDEA创建JavaWeb项目(保姆级别)_第21张图片

1.2.2 配置编译路径和jar包存放位置

其实就是配置 classeslib 目录,首先找到左上角【File】,点击,找到并点击【Project Structure】

IDEA创建JavaWeb项目(保姆级别)_第22张图片

接下来,按照下述步骤,执行

IDEA创建JavaWeb项目(保姆级别)_第23张图片

接下来配置 lib

IDEA创建JavaWeb项目(保姆级别)_第24张图片

IDEA创建JavaWeb项目(保姆级别)_第25张图片

IDEA创建JavaWeb项目(保姆级别)_第26张图片

1.2.3 部署服务器(Tomcat)

和上述一致,就不再描述

1.2.4 启动项目

点击Tomcat后的绿色小三角,启动项目,会自动弹出浏览器页面,显示 index.jsp页面中的内容

1.3 问题

1.3.1 版本过高或过低

  • Application Server was not connected before run configuration stop, reason:Unable to ping server at localhost:1099
  • 可能是 Tomcat 版本不匹配,建议换个低版本的 Tomcat即可

纯手码,出现文字错误等问题,还请谅解!

你可能感兴趣的:(Java,Web专栏,intellij-idea,java,JavaWeb,项目创建,Maven)