位置: 编程技术 - 正文
推荐整理分享nodejs教程之制作一个简单的文章发布系统(nodejs制作网站),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:nodejs示例,nodejs实战教程,nodejs实例教程,nodejs使用视频教程,node怎么做,nodejs制作网站,node怎么做,nodejs教程视频,内容如对您有帮助,希望把文章链接给更多的朋友!
前言
我们今天就来做一个简单的新闻发布系统,系统第一阶段不需要太难,主要有以下功能
① 新闻类型管理
② 新闻管理(具有图片上传功能)
③ 新闻浏览
功能虽然不多,但是也涵盖很多基本操作了,程序不过增删查改嘛,外加上传附件,够了。于是开始我们今天的学习吧
准备工作
根据昨天的折腾后,我们已经有了nodeJS与mongoDB环境了,现在直接新建工程文件与数据库文件即可
第一步,打开命令符切换到D盘后输入
于是系统会自动开开心心构建基本环境
很明显,里面很多模块依赖没有,这个时候将昨天的package.json直接考过来:
然后切换到项目目录下:
依赖文件全部搞下来了,然后我们输入
于是,我们的程序高高兴兴的运行起来了,打开网址一看,确实没问题
PS:这里有个问题需要注意,我们下载下来的文件不是UTF-8编码,所以中文可能有乱码,文件编码需要各位自己统一
程序跑起来了就需要数据库相关的配置了
① 首先在mongoDB目录中新建news文件夹
② 为项目新增配置文件settings.js
③ 新建models目录,新建db.js
④ 在桌面新建news.bat程序
以后要启动数据库,只需要运行他即可,如此,我们初步的准备工作基本结束
但是这里有两个比较烦的事情,一个是每次要启动news程序很烦,二个是修改任何东西都需要重启,于是我们这里先解决这两个问题
① 在桌面新建news_app.bat,以后运行他就可以启动程序了
② supervisor为一进程保护程序,我们可以使用他帮我们重启程序,首先按照,然后调整我们的node_app.bat
当然之前需要安装:
这个样子后,修改了文件就不需要手动重启了(需要将news_app放到项目目录下),于是准备工作到此为止
项目结构
第一步结束后,我们就需要思考下项目结构了
① 首页为index这里将列出所有新闻类型以及对于新闻条目
② 各个新闻条目拥有编辑/删除/查看 三个按钮
③ 首页具有增加新闻按钮(增加时候可上传图片)
基本功能如上
于是,我们去掉app里面的路由功能,将路由全部放到index里面
第一步简单如此,因为增加新闻应该有单独的页面,而具体点击增加按钮又会有其他处理,所以内部还得细分各个请求,现在规定如下:
/ 默认页面,该页面显示所有类型以及新闻,并带有删除按钮
/add 进入添加新闻页面
/addNews 添加新闻具体post请求地址(点击按钮时候的响应)
/delete 删除新闻请求
/view 具体新闻查询
于是稍微修改下上述路由:
于是我们需要新建几个模板组织我们的网页,这里我们先不分离头尾只要最简单的页面即可
新增add与view两个模板文件,暂时表现与index.ejs一致,并且修改导航相关
至此项目结构结束
数据操作
整体结构出来后,我们就需要进行数据操作了:
① 增加数据(增加新闻)
② 展示数据(展示新闻)
③ 删除数据(删除新闻)
本来还涉及到类型操作的,但是做着做着给搞没了,暂时不管他吧,因为首次做容易迷糊
增加新闻
这里,我们就不使用表单提交了,我们用ajax......这里顺便引入zepto库,于是我们的页面成了这样
虽然现在还没有请求响应程序,所以数据并不会被处理,另外我们这里的附件也没有(现在附件只允许一个好了),于是再修改下代码,加入图片:
PS:比较麻烦的是图片经过ajax处理有点麻烦,所以我们这里乖乖的换回form操作算了,不然又要搞多久......
这个样子就不需要过多的考虑附件问题,先暂时如此吧,现在先处理请求程序,这里先在public里面新建news文件夹用于存储其图片
model
在models文件夹新增news.js文件,为其构建实体,并赋予新增查询相关操作:
于是,写入数据库的程序就有了,这里我们来试试能不能插入数据库,当然需要修改路由处的程序
PS:路由处当然不能写过多逻辑代码,这个文件以后还得分离
这个时候/addNews里面的逻辑需要改变
查询下,问题不大,现在要解决的就是附件问题了
上传图片
上传图片功能express本身就支持了,express通过bodyParser解析请求体,然后便可通过他上传文件了,其内部使用了formidable
这里将app.js里面的app.use(express.bodyParser())改为:
打开index.js,在前面加一行代码:
修改一下index文件:
这个时候选取文件后点击添加新闻,我们的文件就上传上去了
这个时候,我只需要将文件名记录在数据库即可,文件目录里面就有图片了
数据库中有数据了,我们目录也有文件了,现在只需要将数据读出来了
PS:放假兄弟们催的凶,要出去喝酒了
读取数据
第二步当然是读取数据,首先是首页的数据读取:
结语
好了,文章发布系统的制作就先到这里了,以后我们再慢慢增加功能,慢慢做美化。
node.js使用require()函数加载模块 详细说明均以写在注释之中,这里就不??铝耍?』锇槊亲约合晗缚窗桑??虮鸢勺⑹偷背煽掌?恕?/p>/*在node中,可以使用require()函数来加载模块.*require函数使用
node+express+ejs制作简单页面上手指南 1.建立工程文件夹my_ejs.2.首先利用npminstallexpress和npminstallejs下载这两个家伙.至于要不要设置成全局的,看习惯,我习惯性的下载到本项目中的文件夹中my_ejs
node+express+jade制作简单网站指南 1.建立工程文件夹:my_jade2.下载express和jade包到本地.我个人不喜欢下载成全局的,我喜欢下到工程文件夹中去.3.建立相关的文件夹和文件.index.js:style.cssgys.ja
标签: nodejs制作网站
本文链接地址:https://www.jiuchutong.com/biancheng/374246.html 转载请保留说明!友情链接: 武汉网站建设