开始使用MEVN技术栈开发03 使用express创建后端项目

2024-01-02 13:13:34

开始使用MEVN技术栈开发03 使用express创建后端项目

使用Express创建后端项目

In this chapter, we begin setting up the backend of our app with Node.js and Express. First, we will install Node.js. Go to nodejs.org (fig. 1) and download the appropriate version for your Operating System.

在本章中,我们将开始使用 Node.js 和 Express 设置应用程序的后台。首先,我们将安装 Node.js。请访问 nodejs.org(图 1),下载适合您操作系统的版本。

注意:这里我采用的是nvm来管理版本,请跟着我使用如下命令,或者你安装对应的nodejs的版本

nvm use 20

Installation should be straightforward. Once Node.js has been installed, go to your Terminal and run:
安装应该很简单。Node.js 安装完成后,进入终端并运行

node -v

This shows the version of Node that you installed e.g. v14.16.0 (at time of this book ’ s writing).
这将显示您安装的 Node 版本,例如 v14.16.0(本书编写时)。

In Terminal, in a location of your choice, create a folder called ‘ moviereviews’ e.g.:
在终端中,在你选择的位置创建一个名为 "moviereviews "的文件夹,例如:

mkdir movie-reviews
cd movie-reviews

In the movie-reviews folder, create a folder called ‘ backend ’ :
在 movie-reviews 文件夹中创建一个名为 "backend "的文件夹:

mkdir backend
cd backend

In the backend folder, create a package.json file in the folder by running:
在后台文件夹中运行 package.json 命令,在该文件夹中创建 package.json 文件:

npm init

This will prompt a series of questions about our project (e.g. project name, author, version) to create package.json for us. You can of course manually create package.json on your own. But npm init saves us a bit of time when creating package.json files. For now, press enter for the first three questions, in the ‘ entry point ’ question write Index.js, and press enter for the rest of the questions. At the end, package.json (with the contents something like the below) will be generated for us.
这会提示一系列有关项目的问题(如项目名称、作者、版本),从而为我们创建 package.json。当然,你也可以自己手动创建 package.json。但在创建 package.json 文件时,npm init 会为我们节省一些时间。现在,按回车键回答前三个问题,在 "入口点 "问题中写入 Index.js,然后按回车键回答其余问题。最后,我们将生成 package.json(内容如下)。

这个时候,会弹出一些提示,让你输入东西,你一直按Enter键就行了。

接着,我们执行命令:

code .

这个命令能够打开你本机安装的vscode,如果你没有安装,那么建议你先安装再执行这个命令,因为我们要用vscode来编辑代码。

打开代码以后,可以发现一个叫做package.json的文件,该文件就是我们的项目依赖管理文件,文件的内容如下:

{
  "name": "backend",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

package.json contains metadata about our Node project like the name, version and its authors.
package.json 包含 Node 项目的元数据,如名称、版本和作者。

Next, install a few dependencies by running:
接下来,运行以下命令安装一些依赖项:

npm install express cors mongodb dotenv

注意:这里我更推荐使用yarn,因为npm在国内的某些环境下,即使配置了国内源,加载包也可能耗时较久,而yarn则一般都能够快速的进行安装。如果你跟着我使用yarn,则我们执行以下命令:

npm install -g yarn
yarn add express cors mongodb dotenv

As mentioned, Express is a framework that acts as a light layer atop the Node.js web server making it easier to develop Node.js web applications. It simplifies the APIs of Node.js, adds helpful features, helps organizes our application’ s functionality with middleware and routing and many others.
如前所述,Express 是一个框架,它作为 Node.js Web 服务器上的一个轻层,使开发 Node.js Web 应用程序变得更加容易。它简化了 Node.js 的应用程序接口,增加了有用的功能,通过中间件和路由等方式帮助我们组织应用程序的功能。

CORS stands for Cross-Origin Resource Sharing. By default, modern browsers don ’ t allow frontend clients to talk to REST APIs. They block requests sent from clients to the server as a security mechanism to make sure that client-side browser JavaScript code can only talk to their own allowed server and not to some other servers which can potentially run malicious code. To circumvent this security mechanism, we can enable CORS checking, a mechanism that uses additional HTTP headers to tell browsers to give a web application running at one origin, access to selected resources from a different origin.
CORS 是跨源资源共享(Cross-Origin Resource Sharing)的缩写。默认情况下,现代浏览器不允许前端客户端与 REST API 对话。作为一种安全机制,浏览器会阻止从客户端发送到服务器的请求,以确保客户端浏览器的 JavaScript 代码只能与自己允许的服务器进行对话,而不能与其他可能运行恶意代码的服务器进行对话。为了规避这种安全机制,我们可以启用 CORS 检查,这种机制使用额外的 HTTP 标头告诉浏览器,让运行在一个源的网络应用程序访问来自不同源的选定资源。

The cors package we are installing provides an Express middleware that can enable CORS with different options so we can make the right connections on the network.
我们安装的 cors 软件包提供了一个 Express 中间件,它可以通过不同的选项启用 CORS,这样我们就可以在网络上建立正确的连接。

The mongodb dependency allows us to interact with our MongoDB database.
mongodb 依赖项允许我们与 MongoDB 数据库交互。

The dotenv dependency loads environmental variables from the process.env file instead of setting environment variables on our development machine which simplifies development. We will understand this better when we create the process.env file later.
dotenv 依赖项从 process.env 文件加载环境变量,而不是在我们的开发机器上设置环境变量,这简化了开发过程。稍后创建 process.env 文件时,我们会更好地理解这一点。

When installation of the above dependencies is finished, you will notice that a new property dependencies has been added to package.json.
完成上述依赖项的安装后,您会发现 package.json 中新增了依赖项属性。

此时,package.json中的内容如下:

{
  "name": "backend",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "cors": "^2.8.5",
    "dotenv": "^16.3.1",
    "express": "^4.18.2",
    "mongodb": "^6.3.0"
  }
}

Dependencies contain the dependency packages and their version numbers.
依赖包包含依赖包及其版本号。

For example, we have Express version 4.17.1 (at time of book ’ s writing). Each time we install a package, npm saves it here to keep track of the packages used in our app.
例如,我们的 Express 版本是 4.17.1(本书编写时)。每次安装软件包时,npm 都会将其保存在这里,以便跟踪应用程序中使用的软件包。

npm install installs the specified packages into our app by fetching their latest versions and putting them in a folder called node_modules. Open up the backend folder in a code editor of your choice. In this book, I will be using Visual Studio Code (https://code.visualstudio.com/).
npm install 会获取指定软件包的最新版本,并将其放入名为 node_modules 的文件夹中,从而将其安装到我们的应用程序中。在你选择的代码编辑器中打开后台文件夹。在本书中,我将使用 Visual Studio Code (https://code.visualstudio.com/)。

If you look at your app folder, the node_modules folder will have been created for you. This is where custom dependencies are saved for our project.
如果查看应用程序文件夹,node_modules 文件夹已经为您创建)。这里保存了我们项目的自定义依赖项。

If you open and explore node_modules, you should be able to locate the installed packages. The reason why we see many other packages in node_modules is because our specified packages depend on these other packages and they were thus also installed. The file package-lock.json tracks the versions of all the dependencies of Express.
如果打开并查看 node_modules,就能找到已安装的软件包。我们之所以能在 node_modules 中看到许多其他软件包,是因为我们指定的软件包依赖于这些其他软件包,因此它们也被安装了。package-lock.json 文件会跟踪 Express 所有依赖包的版本。

使用 nodemon 自动重启服务器

Next, we will install a package called nodemon (https://www.npmjs.com/package/nodemon) that automatically detects code changes and restart the Node server so we don ’ t have to manually stop and restart it whenever we make a code change. Install nodemon with the following command:
接下来,我们将安装一个名为 nodemon (https://www.npmjs.com/package/nodemon) 的软件包,它能自动检测代码更改并重启 Node 服务器,这样我们就不必在更改代码时手动停止和重启 Node 服务器了。使用以下命令安装 nodemon:

npm install -g nodemon

And nodemon will be installed globally to our system path.
nodemon 将全局安装到我们的系统路径中。

说明

本文翻译自《Beginning MEVN Stack Development (MongoDB, Express, Vue, Node.js) (Greg Lim, Daniel Correa)》一书,加上了一些自己的理解。特别是代码部分,可能会大量的重写,练习等。

如果想要原版电子书可以留言。

如果涉及到侵权,请联系我删掉。

如果您有想要翻译的英文书籍,请联系我,我可以代为翻译。

如果您想要学习更多的编程知识,可以购买我的视频课,直播课,或者私教课。

如果您有想要开发的软件项目,可以联系我,我可以代为开发。

如果您是学生,有解决不了的编程问题,可以联系我,我可以代为解决。

如果您是程序员,在企业内有解决不了的难题,可以联系我,兴许我可以提供一些建议。

我是张大鹏,“Python私教” 的创始人,全栈工程师,著有zdppy和zdpgo两个跨语言的全栈开发框架,如果您对我的框架感兴趣,可以联系我,需要说明的是,这两个框架不是开源的,需要付费购买,但是可以试用,保证能够提高您的开发效率。

其他… 生活不易,如果您有闲钱,麻烦打赏我一点吧,1块不嫌少,20刚刚好,100不嫌多,1000… 就想想吧~

文章来源:https://blog.csdn.net/qq_37703224/article/details/135337743
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。