wex5 初级项目实战入门 01 框架与思路

一.前言

使用wex5一段时间了,感觉wex5自带的baas后端不伦不类,本身用前端的思想去处理后端的技术问题,本身就是不切合实际的一种想法。能不能结合其它后端来提升wex5的整体开发水平和速度呢?

经过对比,选择了thinkphp5+layui2.0+vue.js+wex5的解决方案。

本人是初级学习者,将学习和练习过程记录,希望加深理解,并帮助更多有理想的人,答疑解惑。随后基于四大框架来制作学习视频网站,博客图文跟进介绍,便于同步学习。

先看一下管理后台基本效果。

1.加入动态星星背景的登陆页

2  深黑色的管理后台

3 数据增删改查

今天开篇不说技术节点,重点从项目设计和开发角度,重点说开发总体思路。

二  部署

对于初学者而言,项目部署个人推荐宝塔面板.linux 和window版本都有。无论是本机调试,还是服务器部署,简单,自带了环境搭建,一键建站等众多工具。具体使用可参见官网或者我的博客。

注意:1. 一键部署thinkphp5框架时,linux版自带伪静态,window 版没有,需要手动添加伪静态.

2 .管理后台和前端,后端,其实是三个应用,需要三个项目。本机测试和远程部署,后端路径可能会在页面中反复使用。一量更改,需要大量修改。可以写一个js来统一调用。

这样在页面中只要引入这段js,baseUrl就得到后端域名。

3 . window本机调试域名设置:

C:\Windows\System32\drivers\etc\hosts      文件添加本机域名

顺便说一下,一些广告也可以在这里干掉

三  框架选择与对比

一口气学4个框架,听起来吓人,其实简单。从基础流程和逻辑作起,跑通了,其它就是复制和粘贴了。特别是模块化设计思想成熟以后,代码和页面复用性提高。框架的作用就是为了高效。

1. thinkphp5.0

国产的好东西,不多说了,学习成本低,响应快,代码好看,配置简单,基于mvc模型操作,不能再简单了。关键是报错给的精确到标点。之前用baas的现在要出坑。java的一堆神报错,本人难于接受。

来几张图看看:

数据库配置,填完基本参数,就能拿到数据,不用考虑并发,连接池什么的。

在控制器里写了几行代码,根据id取出用户模型数据,转换成json返回。够简单吧。

调用淘宝接口,根据访问ip得到访问者的地理信息,查询到城市,很多人想做这件事,简单位。

2 . layui

后台管理界面用layui,无论是效率还是美观,值得使用。

关键是文档写的太好。你要什么,直接从官网托下来就能用。改的地方也给你写好了例子。无语的api.

layui重点维护表格组件table和弹层组件layer,实在是有先见之明。

table的使用,从官网拷下来,改改字段就能用。

layer功能太强大,弹信息,弹页面都可以。关键是快。

3 .vue.js

一说vue.js,大家都怕了。我也怕。但是我看看了文档几行。不用不行。

比如下面这个页面:

信息查询页面,用过wex5自然想到绑定,多简单。那要是没有绑定呢??

老老实实一个一个取出元素赋值!!!!!

用了vue.js以后,创建一个vue实例,绑到外层div上,内层元素就可以直接绑定显示了。

数据变了,内容就响应的变。

vue我只用到了v-model.已经可以用了。其它可以用到了再学。

layui和vue在一些地方会有冲突:

1。layui  的layui-admin样式内的元素不能绑定vue实例

2.  layui 的form表单中,radio,checkbox 等样式不能正确绑定vue实例,可使用原生form组件

3.  div嵌套中绑定会出现数据冲突。只能单一层级绑定。

4 wex5  3.6

掉进很多次wex5的坑,没有一种框架是完美的。虽然响应不是很快,那要是拋弃了baas呢???

看来wex5还是一个不错的快速开发前端框架。至于大家吐槽的app问题,不行就整原生吧---如果你有能力的话。

目前稳定版本是3.6.不知官方是否还在重点维护。

四  总结

1  4个框架,配合使用。

2   配套教学视频同步制作,欢迎指出,批评。本人小白,言多勿怪。

原文地址:https://www.cnblogs.com/fangziffff123/p/8598285.html

时间: 2024-10-09 21:52:30

wex5 初级项目实战入门 01 框架与思路的相关文章

angularJs项目实战!01:模块划分和目录组织

近日来我有幸主导了一个典型的web app开发.该项目从产品层次来说是个典型的CRUD应用,故而我毫不犹豫地采用了grunt + boilerplate + angularjs + bootstrap + D3 + requirejs 的架构来实现它.angularjs早在去年6月份我就有所接触,将它应用在实验室项目的个别页面中,11月份在新浪的时候也将其推荐给了所在云事业部项目组.项目组老大程辉等人都是很有技术敏感性的人,大胆地采纳了我的建议,将之应用于原本使用dojo开发的项目前端模块上.然

Asp.NET Core2.0 项目实战入门视频课程_完整版

END OR START? 看到这个标题,你开不开心,激不激动呢? 没错,.net core的入门课程已经完毕了.52ABP.School项目从11月19日,第一章视频的试录制,到今天完整版出炉,离不开各位的帮助和加油. 课程概述 52ABP大学例子程序演示如何使用Entity Framework(EF) Core 2.0 和 Visual Studio 2017 创建一个 ASP.NET Core 2.0 MVC web 应用. 例子是一个大学的网站.它包括了学生入学,创建课程.教师管理等功能

SpringBoot搭建聚合项目-实战记录01

工具:Spring Tool Suite 4 项目搭建 1.首先建立工作集 : Configure Working Sets -> New.. ->设置名称(如project) -> finish 2.在工作集中创建父项目project-parent : new maven project -> 勾选"simple project" -> Next 填入组id项目id 以及最重要的选择打包方式为pom!!! 点击Finish完成, 这样一个聚合项目工作集的

全套软件测试项目实战

软件测试项目实战-web项目实战-RF测试框架课程如下: web项目实战: 1.web项目测试备战 2.产品需求与设计评审 3.测试计划 4.测试用例架构搭建 5.web测试用例设计方法 6.功能测试用例设计方法 7.性能测试用例设计方法 8.安全测试用例设计方法 9.兼容性测试用例设计方法 10.界面设计用例方法 11.web测试用例的评审方法 12.搭建测试环境 13.粗测上 14.粗测下 15.功能测试执行上 16.功能测试执行中 17.功能测试执行下 18.系统测试-产品经理 19.系统

Asp.Net MVC4.0 从入门到精通与项目实战 (Petapoco框架、二维码自定义、Bootstrap视图)视频教程

Asp.Net MVC4.0 从入门到精通与项目实战 (Petapoco框架.二维码自定义.Bootstrap视图)视频教程下载    联系QQ:1026270010 Asp.Net MVC 简介      MVC模式是“Model-View-Controller”的缩写,中文翻译为“模式-视图-控制器”.MVC模式是于20世纪70年代在smaltalk80的GUI设计中被提出的.它包括3个部分:模型(Model).视图(View)和控制器(Controller).MVC模式至今已被广泛使用,A

大数据系统学习零基础入门到精通加项目实战2017最新全套视频教程

38套大数据,云计算,架构,数据分析师,Hadoop,Spark,Storm,Kafka,人工智能,机器学习,深度学习,项目实战视频教程 视频课程包含: 38套大数据和人工智能精品高级课包含:大数据,云计算,架构,数据挖掘实战,实时推荐系统实战,电视收视率项目实战,实时流统计项目实战,离线电商分析项目实战,Spark大型项目实战用户分析,智能客户系统项目实战,Linux基础,Hadoop,Spark,Storm,Docker,Mapreduce,Kafka,Flume,OpenStack,Hiv

物联网开发入门+项目实战视频博学全套

物联网开发入门+项目实战视频博学全套物联网网络编程项目实战视频课程以目前在物联网中比较热门的技术平台为依据,实操为主,理论讲解为辅;引导学员...适用人群对物联网通讯感兴趣的技术人员或在校工科类学生:具备一点C语言基础.课程简介物联网网络编程项目实战视频课程以目前在物联网中比较热门的技术平台为依据,实操为主,理论讲解为辅:引导学员去进行一些简单项目的开发和练习,尽可能通俗的讲解物联网所涉及到的协议.课程大致目录:第1阶段 学前准备01 C语言及程序设计快速入门02 嵌入式C语言高级---语法概述

移动端自动化测试Appium 从入门到项目实战Python版

移动端自动化测试Appium 从入门到项目实战Python版 说到APP自动化测试,Appium可是说是非常流行了, 不仅支持多语言.多平台的优势,同时支持Andriod.iOS.H5的自动化测试:本课程会从初级的Appium框架讲起,涉及业界常见的po模型.关键字模型.服务自动化.持续集成等实战讲解,让你快速上手移动端自动化测试工作 appium做app自动化测试,环境搭建是比较麻烦的.也是很多初学者在学习app自动化之时,花很多时间都难跨越的坎. 但没有成功的环境,就没有办法继续后续的使用.

基于J2EE平台下SSH2+JBPM4.4+ExtJs4.1 框架整合&项目实战

基于J2EE平台下SSH2+JBPM4.4+ExtJs4.1 框架整合&项目实战 推荐给大家一套企业实战项目开发的教程. 课程包含了以下主要的技术面:前端采用Extjs4.x:后台使用目前中小型开发较为常用的SSH2作为框架,囊括了JBPM4.4工作流引擎. 课程经由基础学习向高阶跨进,一步一步介绍了前后台的关系,以及前后台的整合.JBPM的整合等等,都是属于目前较为重要的技术点. 咨询QQ:1609173918 课程大纲: 第1讲:课程概要_Extjs入门: 第2讲:Grid与Store的应用