位置: 编程技术 - 正文
推荐整理分享零基础搭建Node.js、Express、Ejs、Mongodb服务器及应用开发入门(零基础搭建直播室与云直播平台),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:零基础搭建量化投资系统以Python为工具,零基础搭建个人博客网站,零基础搭建个人博客网站,零基础搭建直播室与云直播平台,零基础搭建量化投资系统,零基础搭建量化投资系统以Python为工具,零基础搭建量化投资系统 pdf,零基础搭建量化投资系统,内容如对您有帮助,希望把文章链接给更多的朋友!
本文改自非鱼的《【翻译】前端开发人员入门指南,从零开始搭建Node.js, Express, Jade, Mongodb服务器》,之所以把Jade换成Ejs,是因为我觉得ejs更符合WEB编程人员的习惯,更确切说应该是更符合PHP、ASP程序员的使用习惯。好了,废话不多说,直接开始教程。
第1部分 ? 分钟安装
如果你真的是从零开始学,那就花点时间先把环境搭建起来吧。这不难,我用的是Win8,所以这看上去跟那些用Mac和Ubuntu或者其它*nix系统的教程有点区别,不过大致是一样的。
第1步 ? 安装Node.JS
这很容易,进入Node.js官方网站,点击绿色的大Install按钮,它会自动检测你的系统并给你一个正确的安装文件的下载。(如果没有,点击Download按钮选择你需要的下载)。运行安装程序,这样就好了。你已经装上了Node.js,和NPM(Node包管理器)可以让你很容易的安装各种有用的包到Node里。
第2步 ? 安装Express
现在我们已经让Node跑起来了,我们还需要一些东西让我们能够实际创建一个可用的站点。下面我们需要安装Express,这是一个把Node从一个原始的应用变成一个更像我们平时使用的Web服务器的框架。我们需要从Express开始,因为我们需要它提供的scaffolding功能。我们输入这么个命令:这样Express就被正确的安装到我们的Node里了,并且已经设为全局可用的。你会在命令行窗口看到一堆输出,大部分是http 和GET请求,这是正常的。Express应该已经装好并可用了。
第3步 ? 创建一个Express项目
我们准备使用Express和Ejs,但是不是用来做CSS预处理的。我们会手写一些CSS。我们要用Ejs或者其它的模板引擎来处理Node和Express的数据。如果你会HTML的话,Ejs并不难。只要记住你需要集中精神,否则事情可能很容易出错。
现在在同一个命令行窗口中输入:回车,你会看到这样一堆东西:
第4步 ? 编辑依赖项
好了,我们现在有一些基本项目结构,但是还没完。你会注意到express的安装过程在你的nodetest1目录里创建了一个叫package.json的文件,用文本编辑器打开这个文件,它应该是长这样的。这是一个标准的JSON格式文件,表明了我们的应用和它的依赖。我们需要添加一点东西。比如对mongodb和Monk的调用。把dependencies部分改成这样:
第5步 ? 安装依赖
现在我们定义好了项目的依赖项。*号会告诉NPM“安装最新版本”。回到命令行窗口,进入nodetest1目录,输入:它会输出一堆东西。这是因为它直接读取我们修改过的JSON文件,识别其中的依赖项,并安装必须的文件。当NPM安装完成以后,你应该有了一个node_modules目录,其中包含我们的项目所需要的所有依赖文件。
现在我们有了一个完整功能的App,并且可以运行了。我们试试看吧!确保你的当前目录是nodetest1目录,输入:回车后你会看到:太棒了。打开浏览器,输入 JS WebServer,带有Express引擎和Ejs HTML模板引擎。不是很难啊,对吧?
第2部分 ? 好了,我们来写“Hello, World!”吧
打开你常用的文本编辑器或者其它IDE,我个人喜欢用Sublime Text。打开你的nodetest1目录下的app.js,这个文件就是你的App的核心了。你应该会看到这样的内容:这个只是定义了一堆JavaScript变量并指向了一些包和依赖,node函数,和routes。Routes(路由)相当于MVC中Models和Controllers的集合,它负责转发请求并且也包含一些处理逻辑。Express已经为我们创建好了所有这些东西,我们现在先忽略user route,开始写最顶层的route(由routesindex.js控制)。
在上面的这个文件的最后写上:这一句至关重要。它实例化了Express并赋值给我们的app变量。接下来的内容都要使用这个变量来配置一堆Express的参数。继续输入:这里设置了端口,寻找views的目录,用什么模板引擎来处理这些views,和一些其它的东西。还要注意最后一行,它告诉Express把public/目录下的静态文件作为顶层目录的文件来托管。比如你的图片目录存放在c:nodenodetest1publicimages里,但是实际访问地址是 server并且启动它。这样就差不多了。
(以上内容在新的express生成的模板里是完整的,不需要自己写进去)
现在,我们写点有用的。我们不会直接在我们的index页面里写“Hello World!”,我们借这个机会学习一下如何使用route路由,同时学习一下Ejs引擎是如何工作的。在上面的app.js文件的app.get()这一段的后面添加一行:
app.get('/helloworld', routes.helloworld);如果这时候你在命令行窗口按ctrl+C结束app.js进程再重启,然后用浏览器访问 app.js重新启动它。提示:当你修改一个ejs模板文件的时候,你不需要重启服务器。但是当你改了一个js文件的时候,比如app.js或者一个路由js文件,就必须要重启服务器才能看到效果了。
服务器启动后,注服务器打开 ? 创建数据库并读取数据
第1步 ? 安装Mongodb
我们先关掉文本编辑器,回到命令行窗口。先用浏览器,打开 *R2+版本。下载后是个zip文件,解压到c:mongo或者c:program filesmongo或者随便什么地方,这不重要。我们把数据保存在我们的nodetest1目录里。
第2步 ? 运行Mongod和mongo
在我们的nodetest1目录里创建一个子目录data,然后在命令行窗口中进入你的mongodb目录的bin目录里,输入:你会看到mongo服务器启动了,第一次启动需要一点时间,因为它需要预分配一些硬盘空间和一些其它的任务。当它提示”[initandlisten] waiting for connections on port ″的时候,就搞定了。没有什么别的需要做的了,服务器已经在运行了。现在你需要另外打开一个命令行窗口,进入mongo目录的bin目录中,输入你会看到一些类似这种提示:这时候如果你看一下mongod的窗口,你会看到提示一个连接已接入。我们接下来会使用这个命令行的客户端去手工处理一下我们的数据库,不过这对我们的Web站点并不是必须的。
第3步 ? 创建一个数据库
不用担心上面的连接到test的提示。那只是当你没有指定数据库时mongo默认的一个数据库,它甚至不会创建这个名叫test的数据库,除非你增加一条记录进去。我们创建一个自己的数据库吧。在mongo的命令行窗口中,输入:除非我们插入一些数据进去,否则它也不会创建这个数据库。
第4步 ? 添加一些数据
我最喜欢的MongoDB的特性就是它使用JSON作为数据结构,这就意味着我对此非常的熟悉。如果你不熟悉JSON,先去读点相关资料吧,这超出了本教程的范围。
我们添加一些数据到collection中。在这个教程里,我们只有一个简单的数据库,留侯 username和email两个字段。我们的数据看起来是这个样子的:你可以创建你自己的_id字段的值,不过我觉得最好还是让mongo来做这件事。它会为每一条记录创建一个唯一的值。我们看看它是怎么工作的。在mongo的窗口中,输入:重要提示:db就是我们上面创建的nodetest1数据库,usercollection就是我们的collection,相当于一张数据表。注意我们不需要提前创建这个collection,它会在第一次使用的时候自动创建。好了,按下回车。如果一切顺利,你会看到……什么也没有。这可不太好,输入:如果你好奇的话,pretty方法会格式化输出内容,添加换行缩进。它应该会显示:当然,你得到ObjectID应该是不一样的,mongo会自动生成一个。如果你以前使用过JSON接口的服务,现在是不是会觉得,哇,在web里调用这个应该很简单吧!嗯,你说对了。
提示:作为正式服务,你应该不希望所有的数据都存在最顶层。关于mongodb数据结构的设计,多看看Google吧。
现在我们有了一条数据,我们多添加点吧。在mongo窗口中输入:注意,我们通过一个数据一次传递了多条数据到collection。多简单!再使用上面的find命令你会看到这三条数据。
现在我们来整合前面搭建的web服务器和数据库。
第5步 ? 把mongo连接到node
现在我们来建立一个页面,把数据库里的记录显示成一个漂亮的表格。这是我们准备生成的HTML内容:我知道这不太科学,不过你理解就好。我们只是为了建立一个简单的数据库读写程序,不是为了建立一个完整的网站。首先,我们往app.js(我们的程序的心脏和灵魂)里添加一点内容,这样才能接连上mongodb。打开c:nodenodetest1app.js,在顶部你会看到:在它下面添加:这几行会告诉app我们需要连接MongoDB,我们用Monk来负责这个连接,我们数据库位置是localhost:/nodetest1。注意是mongodb的默认端口,如果因为某些原因你修改了端口,记录这里也要跟着改。现在看文件的底部:下面添加一行:这一行告诉app当用户访问/userlist路径的时候,我们需要把db变量传递到userlist路由。但是我们现在还没有userlist路由,现在就去创建一个吧。
第6步 ? 读取mongo中的数据并显示
用你的编辑器打开c:nodenodetest1routesidnex.js,里面有index和hello world两个route,现在我们来添加第三个:好吧,事情变得有点复杂了。这里首先定义了一个function,接收我们传过来的db变量,然后调用一个跟前面两个route一样的page render。我们告诉它需要读取usercollection,做一个查找,返回的数据保存在docs变量中。一旦我们读取到了内容,就调用render来渲染userlist模板页面,把获取到的docs变量作为模板引擎中的userlist变量传递进去。
接下来建立我们的Ejs模板。在views目录下打开index.ejs,另存为userlist.ejs,然后把它的HTML修改成这样:保存文件,重启node服务器。希望你还记得怎么重启。打开浏览器,访问 post to /adduser”的错误。我们来修正它。
第2步 ? 创建你的数据库处理函数
跟以前一样,我们修改app.js,然后是route文件,然后是ejs模板。不过,这里不需要ejs模板,因为我们post以后会跳转。在app.js的app.get()这一段的后面添加一行:注意这里是app.post,不是app.get了。来设置route吧。回到routes/index.js,创建我们的数据库插入函数。这个比较大,所以我建议你写好注释。显然在真正的项目里你还需要做很多验证,比如用户名和email不允许重复,email地址必须符合一定的格式规则。不过现在我们先不管这些。你可以看到,当插入数据库完成时,我们让用户跳转回userlist页面,他们应该在那里看到新插入的数据。
这是最好的方式吗?
第3步 ? 连接数据库,写入数据
确保你的mongod在运行!然后重启你的node服务器。用浏览器打开 views,读数据,写入数据有了完整的概念。这是你用来开发任何其它完整的Web网站所需要的一切知识点!不管你怎么想,我觉得这真挺酷的。
第5部分 ? 下一步
现在开始,你拥有无限的可能。你可以看看Mongoose, 另一个处理MongoDB数据库的Node包。它比Monk更大一些,功能也更丰富。你还可以看看Stylus,一个Express的CSS引擎。你可以Google一下Node Express Mongo Tutorial,看看接下来的内容。好好学习,天天向上。
我希望这篇教程能够有所帮助,我写这个是因为当我开始学习的时候我真的很需要这样的东西,但是又真的找不到。如果你已经看到了这里,非常感谢!
nodejs中操作mysql数据库示例 引言:继前面的NodeJS的Hello,World!我们还可以看到其他强大之处,NodeJS现在社区的火热,以及大批工程师对它的支持之下,现在已经陆续的引出了大量的
Node.js中调用mysql存储过程示例 例子仅在windows下测试通过,没有放在linux下测试。如有问题,可以电邮给我~1、安装node.js、mysql,此处略(自行搜索吧)…;2、创建一个名为test的数据
Node.js实现批量去除BOM文件头 之前的同事写了一个工具,但有bug,就是在替换文件后原文件的格式变成utf8BOM了,这种带BOM的XML在Mac下可能读取不出来,所以就需要写个工具处理一下
标签: 零基础搭建直播室与云直播平台
本文链接地址:https://www.jiuchutong.com/biancheng/374206.html 转载请保留说明!友情链接: 武汉网站建设