300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > node.js搭建个人博客系统

node.js搭建个人博客系统

时间:2019-03-08 21:19:53

相关推荐

node.js搭建个人博客系统

node.js+腾讯云搭建个人博客系统

最好要有的预备知识:

前端开发知识

htmlcssJavaScript,尤其重要

nodejs相关知识:异步编程回调函数*阻塞&非阻塞

一、开发环境的配置以及开发工具

配置node环境:

/nodejs/nodejs-install-setup.html

可以参考菜鸟教程的文档。

开发工具

这里用webstorm进行开发,安装过程请自行百度。

建议用sublime和webstorm一起使用会更好。两个工具编辑代码的时候各有各的优点。

二、web工程的建立

打开webstorm,File目录下new->project,选择Node.js Express App

点击新建之后,这里添加node所在位置,根据自己的电脑进行配置。

也可以在项目建立成功后点击右上角的

进行修改

目录

点击运行即可运行程序。

三、程序运行与调试

①打开浏览器,输入‘localhost:3000’,回车,webstorm默认的端口的是3000,也可以在www的文件里面进行修改,

特别的,当端口为80时,即可通过‘localhost’进行访问。

这时就可以在浏览器里面看到express了,表明node运行成功。

四、安装ejs,放置前端代码

到这里学习前端的同学可能比较好奇自己的html代码放在什么地方?

我们来看一下node工程的目录。

①bin目录里面www文件是整个程序的入口,这比较像用codeblocks的同学可能知道.cbp文件

当我们双击这个文件的时候打开的是一个工程,这个工程的所有.h文件都能按照之前组织好的顺序打开,我们的www文件就是充当了这样的角色。

②node_modules文件,这个文件用来存放从远端拉取的各个模块,一会用ejs举一个栗子。

③module文件是我们自己写的模块。大家如果感兴趣可以找一些资料来学习一下。

④view目录用来放置前端的页面的。

但是webstorm默认的不是ejs文件,我们为什么要用ejs?

这里我的经验是便于前后端代码结合,不破坏代码的结构而将后端的数据在前端进行渲染。

接下来安装ejs模块

打开cmd,切换之工程的根目录下,输入

npm install ejs

安装之后在app.js文件里面进行配置

在view目录下新建error.ejs用于出错是的跳转,再新建其他的文件将自己的html代码放进去。

其中前端的css js文件则放在public文件目录下

这样放置不需要对html的路径进行修改,css js文件就可直接外联。

最后打开routers文件的inde.js写上路由就可以在浏览器进行访问了。

这里引入express模块。并建立router。

这段意思是当浏览器得到‘user/login’请求时,返回login页面,当然,前提是你已经建立了login.ejs。

这时就可以在浏览器里面访问‘localhost:3000/user/login’,进行访问login页面了。

至此开发环境算是搭建完成,祝你成功!

接下来就是开发与发布,我们将项目发布在腾讯云上。

云服务器的购买以及域名的解析,在之前的文章“在腾讯云上搭建个人静态博客”里面有提到,对于学生实名认证后会有很大优惠。

与在本地的电脑上一样,先配置nodejs环境。这里一个小技巧,可以利用git来托管我们的代码,这样在电脑本地进行开发,在服务器上直接拉取代码就可以运行了。

在电脑以及云服务器上都安装git bash

需要注意,git bash也可以运行nodejs的命令。

关于git的使用可以百度教程,很多优秀的博文讲的都很详细。

注:

在云服务器上不需要安装编译软件,配置node环境后,打开命令行,切换至项目的根目录下,输入

npm start

或者

node ./bin/www

将项目跑起来。

使用git运行npm也是一样,在项目的根目录下右键->git bash here,输入以上命令也可运行工程。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。