Webx3 FrameWork 教程

原创 2016年05月31日 18:09:12

Webx是什么?

 

Webx是一个框架,它可用来做下面的事情:

 

创建一个全功能的Web应用

Webx提供了创建一个Web应用所需要的所有必要功能。

 

创建一个新的Web框架

Webx允许你定制、甚至重写大部分的Webx框架逻辑,从而实现全新的功能,或者和其它应用框架相整合。

 

创建一个非Web应用

Webx的功能并不受限于Web应用,而是对所有类型的应用都有帮助。

 

Webx所提供的SpringExt子框架是对Spring框架的扩展,能简化Spring的配置,加强了Spring组件的扩展性。

 

浏览源码

Webx的源码被托管在GitHub。你可以从浏览器中直接查看Webx的全部源代码:https://github.com/webx/citrus

 

取得源码

你需要安装Git。然后用下面的命令取得所有可编译的源代码:

 

git clone https://github.com/webx/citrus.git

编译源码

你需要安装Maven。然后用下面的命令编译所有的源代码:

 

cd citrus

mvn clean install

 

创建第一个Webx应用

 

 

安装JDK  & 安装和 配置maven

 

Webx需要JDK 5.0以上的版本。请从这里下载并安装它:http://www.oracle.com/technetwork/java/javase/

 

Webx需要maven 2或更高版本。请从这里下载并安装它:http://maven.apache.org/

[注意] 注意

 

你不需要对maven进行特殊的配置,因为运行Webx应用所需要的所有包都存放在全世界共享的中心Maven仓库(Central Maven Repository)中。Maven将从那里自动获取所有的jar包、源代码和javadoc

 

你可以从这里查询到所有和Webx有关的发布包:http://search.maven.org/#search%7Cga%7C1%7Ccom.alibaba.citrus

 

安装集成开发环境

如果你使用Eclipse(从这里下载:http://www.eclipse.org/),建议安装如下插件:

 

    Maven eclipse插件:http://eclipse.org/m2e/

 

    Git eclipse插件:http://eclipse.org/egit/

 

    SpringExt eclipse插件:http://openwebx.org/updatesite/

    [注意] 注意

 

    关于SpringExt eclipse插件,请参阅更详细的说明:第12.3 节 “Eclipse插件”。

 

 

创建应用

 

Windows下不支持命令换行

 

mvn archetype:generate -DgroupId=com.alibaba.webx -DartifactId=tutorial1 -Dversion=1.0-SNAPSHOT -Dpackage=com.alibaba.webx.tutorial1 -DarchetypeArtifactId=archetype-webx-quickstart -DarchetypeGroupId=com.alibaba.citrus.sample -DarchetypeVersion=1.8 -DinteractiveMode=false

 

 

 

会看见一个新目录:tutorial1。它就是我们刚刚创建的新项目。项目的各项参数如下所示:

 

项目组(groupId):com.alibaba.webx

项目名称(artifactId):tutorial1

项目版本(version):1.0-SNAPSHOT

 

项目中Java类的包名(package):com.alibaba.webx.tutorial1

 

你完全可以根据你的需要来调整上述命令中的参数,改用其它的groupIdartifactIdversion以及package

 

运行应用

 

mvn jetty:run

 

这条命令会启动Jetty Server,默认的端口是8081。请在浏览器地址栏输入地址,或直接点击这个链接:http://localhost:8081/

 

 

 

 

 

基于webx3的用户登陆系统

认识Webx3的目录结构及相关概念

 

 

 

 

 

Web3X 是一个典型的MVC结构

图一 存放的是 MVC中的Controller Java

图二 存放的是 MVC的 视图渲染模板

Model 业务逻辑层在此未涉及

 

Webx3 MVC结构中,值得一提的是 视图, 即渲染模板,Webx3的模板遵循turbine风格,根据职能不同。又分为Layout/Screen/Control  

 

 

 

 

 

 

用户系统开发演示

分析登录系统功能

 

 

 

 

 

 

 

开发登录功能

 

 

login.vm

$page.setTitle("login")

<form action="$app1Link.setTarget("form/login")" method="post">

    $csrfToken.hiddenField

    <input type="hidden" name="action" value="login_action"/>

    #set ($group = $form.login.defaultInstance)

    <p>登录</p>

    <p>#if($errorMsg)$errorMsg #end</p>

  <p>

    #if (!$group.name.valid)

        <p>$group.name.message</p>

    #end

        <input type="text" name="$group.name.key" value="$!group.name.value"/>

    #if (!$group.password.valid)

        <p>$group.password.message</p>

    #end

        <input type="text" name="$group.password.key" value="$!group.password.value"/>

       

        <input type="submit" name="event_submit_do_login"/>

    </p>

</form>

 

 

 

 

 

 

 

LoginAction.java

package com.alibaba.webx.tutorial1.app1.module.action;

import com.alibaba.citrus.turbine.Context;

import com.alibaba.citrus.turbine.Navigator;

import com.alibaba.citrus.turbine.dataresolver.FormGroup;

import com.alibaba.webx.tutorial1.app1.Visitor;

 

public class LoginAction {

public void doLogin(@FormGroup("login") Visitorvisitor, Navigator nav,

Context context) {

String name = visitor.getName();

String password = visitor.getPassword();

if (name.equals("chen") &&password.equals("123456")) {

nav.redirectTo("app1Link").withTarget("form/welcome")

.withParameter("name", name);

} else {

context.put("errorMsg","Name or Password id invaild");

}

}

}

 

 


/tutorial1/src/main/webapp/WEB-INF/app1/form.xml

 

        <group name="login" extends="csrfCheck">

            <field name="name" displayName="你的名字">

                <fm-validators:required-validator>

                    <message>必须填写 ${displayName}</message>

                </fm-validators:required-validator>

            </field>

            <field name="password" displayName="你的密码">

                <fm-validators:required-validator>

                    <message>必须填写 ${displayName}</message>

                </fm-validators:required-validator>

            </field>

        </group>

版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

webx3 PDF(阿里巴巴 前端web框架)

  • 2013年07月11日 17:43
  • 15.8MB
  • 下载

Webx3_Guide_Book

  • 2011年10月03日 00:51
  • 12.83MB
  • 下载

Yii Framework 开发教程(3) 为应用添加日志

在开发应用的过程中,调试也是非常重要的一个环节,除了IDE支持的即时调试(如VS.PHP或IDE支持的调试功能),给Web应用添加适当的调试信息也是非常有用的一个方法,开发过Java或.Net 应用的...

webx3文档——web开发

  • 2015年06月02日 19:44
  • 15.43MB
  • 下载

Yii Framework2.0开发教程(3)数据库mysql入门

Yii Framework开发教程(3)数据库mysql入门

Swoole Framework 入门教程(3)-风骚的入口文件

看一段 入口文件的代码 ,求佛祖保佑代码无bug。。。。

YII Framework学习教程-YII的Model-数据库操作3-自定义的DAO操作

虽然我们可以使用CActvieReord完成大部分对数据库的操作。他简化了数据库操作,但是有时候却把一些数据库操作复杂化了。所以YII同时允许我们可以自己连接数据库,组织查询语句,执行查询语句,获取查...

Yii Framework 开发教程(3) 为应用添加日志

在开发应用的过程中,调试也是非常重要的一个环节,除了IDE支持的即时调试(如VS.PHP或IDE支持的调试功能),给Web应用添加适当的调试信息也是非常有用的一个方法,开发过Java或.Net 应用的...

C++网站开发MVC框架TreeFrog Framework教程——3.代码解析

本文详细剖析了在上一篇博客中利用框架自动生成的源代码,到底程序是怎么跑起来的,具体讲述MVC这三部分是如何相互配合的。...

WEBX3学习-用Nexus配置Maven仓库管理器

由于webx3采用maven管理项目部署,而maven会用到中央仓库,由于全球都在用中央仓库,下载的速度可想而知,我用的时候简直有点崩溃,所以需要先配置一个中央仓库的代理服务,供局域网内的项目组用,那...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Webx3 FrameWork 教程
举报原因:
原因补充:

(最多只允许输入30个字)