Vue.js+express建站

网站基本架构：

基本的CS架构，开发时使用本地服务器，数据库使用云服务器的数据库，方便共享数据，上线时可配置服务器到云服务器。

技术栈：

Vue.js:

前端开发框架：响应式数据绑定和组件化开发（单页应用，用户管理系统）

响应式实现页面数据和代码数据的自动同步更新，使开发可以简化为操作业务数据，跟视图层分离
组件化开发将页面不同功能的模块独立开发，使开发更加条理清晰和独立

后端渲染：seo优化页面（网站主页，内容展示页）

后端直接将数据写入html文件，然后将文件发送到前端，前端不用渲染数据，直接展示

node.js

javascript运行环境，是js代码可以运行于浏览器之外，即可编写服务器等功能

node.js 运用大量异步调用回调，即非同步执行代码，代码非顺序执行，node使用npm管理包，即依赖的各种功能均可直接使用npm安装

express：

基于node.js后端框架，负责路由，业务逻辑，数据库操作，页面和数据响应

即架构中的业务层，对前端的请求进行响应，需要数据库的拉取数据库内容，需要判断处理的返回处理结果，请求页面文件的返回html文件

学习链接：

node.js入门教程
 vue入门教程
 vue2.0官方教程
 express官方教程

时间： 2024-08-27 18:41:12

Vue.js+express建站的相关文章

外贸建站JS控制随机显示内容代码分享

外贸建站JS控制随机显示内容代码分享 <script> $(function(){ $('li[id^=p_]').each(function(){ var this_id = $(this).attr("id"); var id_arr = this_id.split('_'); if(id_arr[1]>9){ $(this).hide(); } }) }) function tryLuck(){ var num=30; var p_list=new Array(

外贸建站之常用JS邮箱地址验证代码分享

外贸建站之常用JS邮箱地址验证代码分享 <script> function fpa_keyword_sub(){ var mail = $("#email_fpa").val(); if(! mail.match(/^(?:[a-zA-Z0-9]+[_\-\+\.]?)*[a-zA-Z0-9]+@(?:([a-zA-Z0-9]+[_\-]?)*[a-zA-Z0-9]+\.)+([a-zA-Z]{2,})+$/)){ alert("Email error!"

外贸建站之网站导航栏菜单高亮JS实现代码分享

外贸建站之网站导航栏菜单高亮JS实现代码分享,今天客户要给CAN Clip加一个菜单高亮的效果,原本打算用PHP代码实现,但是感觉过于复杂,JS有更好的解决方案, 这里把我们开发的代码分享给大家. 1 var urlstr = location.href; 2 var urlstatus=false; 3 var urlnum = 1; 4 $("#navbar a").each(function () { 5 if ((urlstr + '/').indexOf($(this).at

外贸建站之自适应网站电脑手机网站不同JS效果区分写法代码分享

外贸建站之自适应网站电脑手机网站不同JS效果区分写法代码分享,今天给客户要求把网站Can Clip搞成自适应的,要求电脑跟手机上菜单展开采用不同的效果, 相信很多程序员都有遇到过这种情况,这里把我们的解决方案分享给大家. 1 if($(window).width()>768){ 2 3 //电脑PC端JS代码 4 5 } 对,没错,只需要给电脑端显示的代码用上这个,就可以了,大家可以根据自己的需要修改不同的宽度,我们在Porsche Piwis III项目中,将PC跟手机端显示的区分宽度设置的

外贸建站之导航栏NAV菜单监听JS处理代码

外贸建站之导航栏NAV菜单监听JS处理代码 1 var persistclose=1 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session 2 var startX = 30 //set x offset of bar in pixels 3 var startY = 5 //set y offset of bar in pixels 4 var ve

如何用Express.js & Vue.js 创建一个用比特币支付的在线商店!

# 如何用Express.js & Vue.js 创建一个用比特币支付的在线商店! 如果你想创建一个在线商店,并用比特币等加密货币来支付,那么这里提供了一个很好的解决方案.Express.js是一个轻量级 MVC架构的Web开发框架,适用于Web服务器端开发.Vue.js是一个渐进式的前端开发框架,你可以自由选择需要的模块集成了你的项目中.Mixin Payment是一个开源的,基于Mixin Network开发的加密货币支付方案. ## 准备工作: 先安装以下依赖包!- Go lang 1

【前端】Vue.js经典开源项目汇总

Vue.js经典开源项目汇总原文链接:http://www.cnblogs.com/huyong/p/6517949.html Vue是什么? Vue.js(读音 /vju?/, 类似于 view) 是一套构建用户界面的渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合.另一方面,Vue 完全有能力驱动采用单文件组件和 Vue 生态系统支持的库开发的复杂单页应用. Vue.js 的目标是通过

Vue.js经典开源项目汇总

vue.js学习笔记(二)：如何加载本地json文件

在项目开发的过程中,因为无法和后台的数据做交互,所以我们可以自建一个假数据文件(如data.json)到项目文件夹中,这样我们就可以模仿后台的数据进行开发.但是,如何在一个vue.js 项目中引入本地的json文件呢,下面就将步骤贴出来.(此时项目是由webpack打包而成). 整个项目是由webpack打包而成,具体步骤上网查找.具体项目结构如下: 1:我们找到bulid>dev-server.js,然后打开 2:在里面加入这段代码. var app = express() var appDa