Java Web开发——网页篇[1]——开始使用MyEclipse

简介: Java Web开发——网页篇[1]——开始使用MyEclipse

前一章节演示了如何在自己的机器上搭建一个网页,然后可以让其他的计算机访问,其中有很多有规则的步骤,比如建立网页、复制到Tomcat目录下等,计算机程序设计的基本意义就是避免重复的劳动,所以MyEclipse这样的集成开发环境出现了,他们可以让开发者只需关心写自己的代码,其他的事情就交给他们吧。

在开始本章节前,建议大家尊重正版,坚决不要使用百度搜索如何激活MyEclipse,坚持凑合着用,老是弹出的提示大家手工激活的那个窗口,是非会员用户不得不忍受的广告...

好的,还是那个最简单的网页:

<html>    
<head>    
<title>哥的个人主页</title>    
</head>    
<body>    
我很帅    
</body>    
</html>

Setup1,首先打开MyEclipse2014,点击【File】-【Switch Workspace】,这样,我们使用MyEclipse创建的项目都在【D:\Java\Code】目录下,比较方便管理,如图:
图片描述


如果想学习java可以来这个群,首先是二二零,中间是一四二,最后是九零六,里面有大量的学习资料可以下载、


Setup2,点击【File】-【New】-【Web Project】,准备创建一个新的Web Project,洋气点说是创新一个网络项目,说白了就是建个网站。如下图,在【Project name】一栏输入咱的网站名:WebSiteFirst,然后点击【 Finish】按钮完成创建。
图片描述

Setup3,在左侧项目【Package Explorer】窗口展开项目目录,如下图。需要说明下,项目名(网站名)WebSiteFirst是刚刚设置的没有疑问,Src是放Java程序的,最后WebRoot表示Web根木录,是用来放网页的,现在可以看到一个index.jsp,.jsp文件表示动态网页,暂时咱不去了解。

所以目前我们建立html文件,直接在WebRoot目录下建立就行,可以在WebRoot上点右键-【New】-【HTML】的方式新建html网页。

图片描述

Setup4,第四步比教特殊,该步骤只需要执行一次即可,以后再建项目的时候就不用了。这一个神秘的步骤的作用是让MyEclipse开发环境认识Tomcat!前面我们装了个免安装版本的Tomcat,所谓免安装版本,就是一堆文件嘛,操作系统都不知道这玩意有还是没有,更不用说级别远低于操作系统的MyEclipse老弟了。所以第一次使用MyEclipse建Web项目,需要让MyEclipse和Tomcat认识认识,既然认识了,那以后不用重新认识了哈。

其实这一步的真正意义是让MyEclipse知道Tomcat的版本和位置,以便MyEclipse在帮我们自动启动Tomcat和自动将我们的网站部署到Tomcat时,知道怎么办。

具体操作方法很简单,点击MyEclpse菜单栏的【Windows】-【Preferences】,在Preferences界面下依次选择左侧【MyEclipse】-【Servers】-【Tomcat】-【Tomcat7.x】,打开如下界面,注意选【Enable】,选择tomcat安装根目录,然后务必点击【Apply】。如下图:
图片描述
Setup5,编辑网站内容,因为目前我们只懂html,不懂jsp,所以右击【WebRoot】,建立一个index.html文件。然后双击打开index.html文件,将

<html>    
<head>    
<title>猫哥的个人主页</title>    
</head>    
<body>    
猫哥很帅    
</body>    
</html>

复制进去,覆盖原有内容,如下图,在右侧的编辑区上方,可以看到页面的预览。
图片描述
Setup6,将网站部署于Tomcat服务器并启动服务器。

需要注意工具栏这三个按钮:图片描述,第一个用于部署网站,第二个用于启动服务器,第三个打开MyEclipse内置浏览器预览网站。一般猫哥不推荐使用第三个按钮,咱直接用IE看网站。

好了,首先咱先部署网站,不部署网站,启动服务器也没用,你服务器上都没部署网站呢,有啥用?(人家设计的这三个按钮真是绝了,从左到右,部署、运行、浏览,一波流顺畅)。点击第一个按钮,打开【Project Deployments】(项目部署)窗口,点此左侧【Add】按钮,在【Sever】下拉框选择【Tomcat 7.x】,这个Tomcat 7.x就是第四步配置的,咱自己下载的Tomcat7服务器,选定后点击【finish】按钮完成添加。如图,Tomcat 7.x左边绿色对号表示部署完成,右边【Remove】表示从服务器移除选定项目,而【Redeploy】表示重新部署,如果网站项目代码改变了,最好是点下Redeploy重新部署,否则可能会有编写代码和Tomcat运行效果不一致的现象发生。
图片描述

Setup7,现在,点击中第二个按钮的下拉三角形,在弹出的下拉框选择Tomcat7.x,然后选择Start启动。此时【Console】输出窗口会出现乱七八糟很多文字,我们只关心最后一行:“信息: Server startup in 2971 ms”——服务器在2971毫秒启动了。

Setup8,预览,打开IE,在地址栏输入【h-t-t-p: / / l o c a l h o s t :8 0 8 0/ We b Si t eF  i r st /i ndex.html】,如图:

图片描述
预览成功!感觉自己很牛X。

此时去看看Tomcat目录下Webapps目录如图:
图片描述

看来Webapps目录下每个文件夹表示一个网站项目,然后ROOT是默认的,不用输入文件夹名(网站名),其他的网站都得输入网站名+网页名。

嗯嗯,很简单,而且就应该是这样的。

OVER。

从下一章开始,就不会截这么多图了,因为操作都是一样的,主要是做说明和贴代码...

相关文章
|
15天前
|
监控 JavaScript 前端开发
《理解 WebSocket:Java Web 开发的实时通信技术》
【4月更文挑战第4天】WebSocket是Java Web实时通信的关键技术,提供双向持久连接,实现低延迟、高效率的实时交互。适用于聊天应用、在线游戏、数据监控和即时通知。开发涉及服务器端实现、客户端连接及数据协议定义,注意安全、错误处理、性能和兼容性。随着实时应用需求增加,WebSocket在Java Web开发中的地位将更加重要。
|
26天前
|
Web App开发 前端开发 开发工具
介绍Web开发的基础知识
介绍Web开发的基础知识
26 7
|
1天前
|
前端开发 Java Go
开发语言详解(python、java、Go(Golong)。。。。)
开发语言详解(python、java、Go(Golong)。。。。)
|
1天前
|
人工智能 前端开发 Java
Java语言开发的AI智慧导诊系统源码springboot+redis 3D互联网智导诊系统源码
智慧导诊解决盲目就诊问题,减轻分诊工作压力。降低挂错号比例,优化就诊流程,有效提高线上线下医疗机构接诊效率。可通过人体画像选择症状部位,了解对应病症信息和推荐就医科室。
27 10
|
1天前
|
Java 关系型数据库 MySQL
一套java+ spring boot与vue+ mysql技术开发的UWB高精度工厂人员定位全套系统源码有应用案例
UWB (ULTRA WIDE BAND, UWB) 技术是一种无线载波通讯技术,它不采用正弦载波,而是利用纳秒级的非正弦波窄脉冲传输数据,因此其所占的频谱范围很宽。一套UWB精确定位系统,最高定位精度可达10cm,具有高精度,高动态,高容量,低功耗的应用。
一套java+ spring boot与vue+ mysql技术开发的UWB高精度工厂人员定位全套系统源码有应用案例
|
4天前
|
PHP
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
|
4天前
|
前端开发 数据挖掘 API
使用Python中的Flask框架进行Web应用开发
【4月更文挑战第15天】在Python的Web开发领域,Flask是一个备受欢迎的轻量级Web框架。它简洁、灵活且易于扩展,使得开发者能够快速地构建出高质量的Web应用。本文将深入探讨Flask框架的核心特性、使用方法以及在实际开发中的应用。
|
7天前
|
JavaScript Java 测试技术
基于Java的旅游网页的设计与实现(源码+lw+部署文档+讲解等)
基于Java的旅游网页的设计与实现(源码+lw+部署文档+讲解等)
19 0
|
8天前
|
运维 NoSQL 算法
Java开发-深入理解Redis Cluster的工作原理
综上所述,Redis Cluster通过数据分片、节点发现、主从复制、数据迁移、故障检测和客户端路由等机制,实现了一个分布式的、高可用的Redis解决方案。它允许数据分布在多个节点上,提供了自动故障转移和读写分离的功能,适用于需要大规模、高性能、高可用性的应用场景。
16 0
|
10天前
|
人工智能 小程序 Java
JAVA开发智慧学校系统源码+人脸电子班牌布局
智慧校园是通过利用物联网,大数据技术来改变师生和校园资源相互交互的方式,以便提高交互的明确性、灵活性和响应速度,从而实现智慧化服务和管理的校园模式。

热门文章

最新文章