前端做整站是开发,例如:前端是用了vue创建初始化项目,后端我们不会php、java等,我们只能用node去创建去做后端代码,本文就给大家讲解最基础的从零开始创建一个项目的后端环境。

  一般来说前后端代码肯定是分离的,但是也有不分离的情况例如jsp代码,本文讲解前后端分离的情况。

前后端项目分离,这样后端的项目创建就不需要在前端的代码里,相当于是两个独立的工程。

一:首先全局安装Node的express 框架

当然安装过的就不需要在执行这个步骤了。

cnpm i -g express-generator

安装完之后通过

express --version

来查看版本,注意这里只能提供这种方式去查看版本号不能通过 -v 查看版本号。

 

2、进入我们的后端项目文件夹生成一个默认的后端 node wxpress项目

express server

3、这时候目录下面会默认生成一个sever 的目录,进入目录,然后执行

npm install

4、如何启动项目呢,其实可以看 package.json

控制台执行

 node ./bin/www

在浏览器 执行

 localhost:

一般来说 Node 的项目的端口号都是 3000

起来之后看到这个就代表好了

项目起来之后

后端项目一般都是用的是 jade 的引擎去写的,如果不舒服可以换成 html 的,

首先先安装 ejs

 cnpm i ejs —save

然后修改app.js,新增

var ejs = require('ejs’);

app.engine('.html',ejs.__express);

修改

app.set('view engine', ‘jade’);

app.set('view engine', 'html');

这样就可在 views 下面新建 html 的页面了,每次做完修改都需要重新启动

Node ./bin/www

other、这里介绍另一种启动方式

1、利用 pm2 启动,首先在 node 的项目按照

cnpm install pm2 --save

2、安装完之后进入项目根目录

执行

pm2 start bin/www

这个是进程式的管理,并且这种方法启动项目后,控制台还可以继续做其他的操作。

3、关闭项目

// 关闭的话,关闭所有
pm2 stop all
// 关闭某一个
pm2 stop bin/www 跟启动的方法相对应

 

前后端不分离项目

  如果我们想吧这个项目放到 例如 vue-cli 构建的项目中,直接在 项目根目录下去创建项目就行,让 server 文件夹和 sec build 在一个目录下就可以

合并的话,只需要吧 server 里面的 package.json 文件里面的

"dependencies": {
"body-parser": "~1.18.2",
"cookie-parser": "~1.4.3",
"debug": "~2.6.9",
"ejs": "^2.5.7",
"express": "~4.15.5",
"jade": "~1.11.0",
"mongoose": "^4.13.9",
"morgan": "~1.9.0",
"serve-favicon": "~2.4.5"
}

这些项目依赖复制到 vue 的 package.json里面去就可以了,然后在初始化一下就行。

启动的话 方法不变,vue的启动还是以前的,server的启动也不变,进入 server > bin 执行 node www 就可以了

项目目录介绍:

bin/www 是项目的启动目录

public 是放一些静态资源的地方

routes 是项目的路由

views 是项目的 页面代码

app.js 项目的配置

 

 

利用node、express初始化项目的更多相关文章

  1. 利用node,跑项目。

    (前提是已经安装了node) 一.简单介绍  Vue开发|文件目录结构部署 目录结构 ├── index.html 入口页面 ├── build 构建脚本目录 │ ├── build-server.j ...

  2. 搭建简单的node+express+mongodb项目

    安装 首先要确保已经安装了 Node.js,接下来创建一个目录,然后进入此目录并将其作为当前工作目录. mkdir myapp cd myapp 通过 npm init 命令为应用创建一个 packa ...

  3. node express新项目默认主文件app.js

    var express = require('express'); var path = require('path'); var favicon = require('serve-favicon') ...

  4. 使用node初始化项目

    初始化项目 在建项目的时候经常会建很多文件夹和文件,今天使用node初始化项目自动生成这些内容. 执行步骤 执行命令 node init 初始化项目生成package.json 设置配置文件 var ...

  5. node+express+mysql 实现登陆注册

    基于 node.express.mysql 实现的登录注册. 1.`首先在终端中 安装 node .` 2.`通过npm install express -g 命令全局安装 express`. 3.` ...

  6. 如何利用express新建项目(上)

    如何利用express新建项目(上) 摘要 这篇文章将讲解了如何快速利用express新建项目 一.express4.x的安装 1. npm install -g express 2. npm ins ...

  7. Node.js Express+Mongodb 项目实战

    Node.js Express+Mongodb 项目实战 这是一个简单的商品管理系统的小项目,包含的功能还算挺全的,项目涵盖了登录.注册,图片上传以及对商品进行增.删.查.改等操作,对于新手来说是个很 ...

  8. 如何搭建node - express 项目

    基于博主也是个菜鸟,亲身体验后步骤如下: 首先,我们需要安装node.js,  https://www.runoob.com/nodejs/nodejs-install-setup.html 安装完成 ...

  9. 一:项目简介(node express vue elementui axios)

    一:项目基本构造 ** 项目一共有 16 个页面,是一个电商网销项目,自己在网上的某网上找的一个要做的网站的设计图: 页面主要包括:  登录页 -- 注册页 -- 首页 -- 产品列表页 -- 产品详 ...

随机推荐

  1. libcloud代码研究(一)——基本架构

    libcloud是apache下整合多种云服务接口的项目.最近,在研究libcloud代码的同时,将阿里云存储(Ali OSS)和百度云存储用libcloud storage driver规范进行封装 ...

  2. [cf 599A]Patrick and Shopping

    傻逼题,但是我还是wa了一发. #include <iostream> using namespace std; int main() { long long a,b,c,Ans=0x7f ...

  3. PatentTips - Power management implementation in an optical link

    BACKGROUND INFORMATION Embodiments of the present invention are directed to optical links and, more ...

  4. cogs 167. [USACO Mar07] 月度花费

    167. [USACO Mar07] 月度花费 ★★   输入文件:expense.in   输出文件:expense.out   简单对比时间限制:1 s   内存限制:128 MB Farmer ...

  5. [转]十五天精通WCF——第九天 高级玩法之自定义Behavior

    终于我又看完了二期爱情保卫战,太酸爽了,推荐链接:http://www.iqiyi.com/a_19rrgublqh.html?vfm=2008_aldbd,不多说,谁看谁入迷,下面言归正传, 看看这 ...

  6. nyoj 95

     #include<stdio.h> #include<queue> #include<algorithm> using namespace std; stru ...

  7. 使用Fiddler进行抓包

    参考:http://blog.csdn.net/gld824125233/article/details/52588275 1.手机跟电脑需要使用同一个局域网  如果是台式机需要将手机的mac地址让运 ...

  8. Pycharm之Terminal使用

    相当于doc命令,即工程所在目录shift+右键命令窗口打开的doc 1.清屏  ------   cls 清除屏幕上的所有显示,光标置于屏幕左上角.

  9. ExtJS学习笔记3:载入、提交和验证表单

    载入数据 1.比較好用的设置form数据的方法: formPanel.getForm().setValues([{id: 'FirstName', value: 'Joe'}]); 当中id值为for ...

  10. Lucene 4.0 TieredMergePolicy

    默认的merge policy. findMerges: 先将全部段依照扣除删除文档之后的字节数(bytesize * (1.0 - delRatio))降序排,对当中size() > 2.5G ...