好程序员web前端学习教程之Node Js流程

发布时间:2020-08-17 00:50:35 作者:好程序员IT
来源:ITPUB博客 阅读:102

   好程序员 w eb 前端学习教程之 Node Js 流程 1 ,项目前期准备:

 

  以 express 框架为例

 

  npmiexpress-generator-g// 全局安装 express 框架

 

  express-e// 生成 express 应用骨架

 

  npmi// 安装依赖

 

  npmstart// 3000 端口监听

 

  拓展:目前最市面上最流行的 node 框架有:

 

  --Sail.js

 

  Sails.js 就像是 Node.js 平台上的 Rails 框架。这是一个可靠可伸缩的开发框架,面向服务的架构,提供数据驱动的 API 集合。用来开发多玩家游戏、聊天应用和实时面板引用非常方便,也可用于开发企业级 Node.js 应用。

 

  Sails.js 基于 Node.js,Connect,Express Socket.io 构建。

 

  --Koa.js

 

  koa.js 是下一代的 Node.js Web 框架。由 Express 团队设计。旨在提供一个更小型、更富有表现力、更可靠的 Web 应用和 API 的开发基础。

 

  Koa 可以通过生成器摆脱回调,极大地改进错误处理。 Koa 核心不绑定任何中间件,但提供了优雅的一组可以快速和愉悦地编写服务器应用的方法。

 

  2, 项目开始

 

  -- 利用 bootstrap 完成布局 ( 或者使用 bulma 前端 css 框架也很方便 )

 

  -- 把需要复用的小组件放在一个文件夹在 , 这里我新建了一个 commjs 目录

 

  -- 构造函数中加载 DOM 结构 ( 面向对象思想 )

 

  -- 把一切需要重复使用的组件模块化,哪里需要哪里引入,代码复用

 

  3 ,理解 mvc

 

  -- 控制器 Controller

 

  是应用程序中处理用户交互的部分。

 

  通常控制器负责从视图读取数据,控制用户输入,并向模型发送数据。

 

  作用:根据路由中设置的路径不同,调用控制器中对应的方法 ( 函数 )

 

  res.body=> 获取 post 请求中传递的参数

 

  res.query=> 获取 get 请求中的数据

 

  业务逻辑基本都在控制层,调用模型中相对应的函数,把需要传递的数据作为参数传递进去

 

  -- 模型 Model

 

  Model( 模型 ) 是应用程序中用于处理应用程序数据逻辑的部分。

 

  作用:通常模型对象负责在数据库中存取数据。

 

  因为模型中的函数需要在控制器里调用,所以在最后需要导出模型。

 

  模型里 , 涉及到数据库的操作需要依赖 mogoose

 

  模型处理数据会返还一个 promise 对象,成功或者失败通过 Promise.then 调用控制器里传递过来的成功或者失败的函数

 

  再由控制器 res.json 返还到前端

 

  --View( 视图 )

 

  是应用程序中处理数据显示的部分。

 

  通常视图是依据模型数据创建的

 

  4, 前端到后端

 

  作为前端如果我们需要拿到后端的数据,就得发送 ajax 请求,如果涉及到文件操作,就必须用 post 请求

 

  通过不同的 url( app.js 里设置过 ) ,拿到不同的数据

 

  view-Controller-Model ,根据返还的数据渲染页面

 

  这里还是 MVC 模式,所以 MVC 流程必须得熟悉。

 

  5, 功能

 

  登录 :

 

  涉及到数据库的操作,查询的结果是 Promise 对象,

 

  控制器里面的操作还是那么回事 , 前端传递到控制器的参数,一个成功的回调,一个失败的回调

 

  模型里 promise.then() 决定调用成功或者失败的函数,传到控制器回调,控制器 res.json 返还到信息前端

 

  需要保存用户登录信息: npmicookie-session--save

 

  app.js 中配置 cookie-session 中间件

 

  检查是否登录:

 

  前端加载时,发送 ajax 请求,根据响应信息,判断是否登录,渲染登录效果

 

  点击退出时,把 req.session 置为 null

 

  **fromData.append("","") 可以追加请求信息

 

  6, 关于文件上传

 

  -- 涉及到文件上传,在服务器端 ( 路由 ) 中引入

 

  multer 模块 npmimulter--save

 

  -- 配置文件上传, cv 原则,修改保存位置和命名规则即可

 

  -- 路由里,回调函数前加一个文件上传的方法

 

  router.post('',upload,single(' 文件上传表单 name ') fn)

 

  -- 控制器判断是否有文件上传 (res.file)

 

  如果有用变量储存文件路径 =>constfile="/ 路由中配置的保存路径 /"+req.file.filename

 

  7,mvc 意义

 

  MVC 分层有助于管理复杂的应用程序,因为您可以在一个时间内专门关注一个方面。例如,您可以在不依赖业务逻辑的情况下专注于视图设计。同时也让应用程序的测试更加容易。

 

  MVC 分层同时也简化了分组开发。不同的开发人员可同时开发视图、控制器逻辑和业务逻辑。

 

  8 ,总结

 

  Node.js 实现了前后端分离,把 mvc 理解之后,所有的操作都是按部就班,前端请求到后端数据,只用根据请求到的数据来渲染页面,后端控制器里主要负责业务逻辑,模型里面保存的是数据 (mongodb 是非关系型数据库,需要转化成关系型数据库 ) 。控制器联系着显示层和模型,它决定后端返回什么数据,前端能拿到什么数据

 

  本文由 好程序员 web 前端培训学员总结。


推荐阅读:
  1. 好程序员web前端学习路线分享jQuery学习技巧
  2. 好程序员web前端学习路线nodeJs学习过程之认识nodejs

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

js web 学习教程

上一篇:百度CTO王海峰对话王辰院士:大数据与抗疫会摩擦出怎样的火花?

下一篇:《深度学习:21天实战Caffe》

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》