介绍
Node.js 和 Angular 是目前非常流行的前端开发技术，它们分别用于后端和前端开发，但是它们的结合可以实现全栈开发。本文将介绍如何搭建属于你自己的 Node.js + Angular 开发环境，让你能够快速地开始全栈开发。
步骤
1. 安装 Node.js
首先，你需要在自己的电脑上安装 Node.js。你可以从 Node.js 官网下载最新版本的 Node.js，并按照安装向导进行安装。
2. 安装 Angular CLI
Angular CLI 是一个命令行工具，它可以帮助你快速创建 Angular 应用。你可以通过 npm 安装 Angular CLI，具体命令如下：
npm install -g @angular/cli
3. 创建一个 Angular 应用
接下来，你可以使用 Angular CLI 创建一个 Angular 应用。你可以在命令行中输入以下命令：
ng new my-app
这将创建一个名为 my-app 的 Angular 应用。
4. 运行 Angular 应用
你可以使用以下命令在开发模式下运行 Angular 应用：
cd my-app ng serve --open
这将启动一个本地服务器，并在浏览器中打开应用。
5. 创建 Node.js 应用
现在，你可以创建一个 Node.js 应用。你可以在命令行中输入以下命令：
mkdir my-node-app cd my-node-app npm init
这将创建一个名为 my-node-app 的文件夹，并在其中创建一个新的 Node.js 应用。
6. 安装 Express
Express 是一个流行的 Node.js 框架，它可以帮助你构建 Web 应用。你可以通过 npm 安装 Express，具体命令如下：
npm install express --save
7. 创建一个 Express 应用
你可以在 my-node-app 文件夹中创建一个名为 app.js 的文件，并输入以下代码：
-- -------------------- ---- ------- ----- ------- - ------------------- ----- --- - ---------- ------------ -------- ----- ---- - --------------- --------- --- ---------------- -------- -- - -------------------- --- --------- -- ---- -------- ---
这将创建一个基本的 Express 应用，它将在访问根路径时返回“Hello World!”。
8. 运行 Node.js 应用
你可以在 my-node-app 文件夹中运行以下命令来启动 Node.js 应用：
node app.js
这将启动 Node.js 应用，并监听端口 3000。
9. 将 Angular 应用连接到 Node.js 应用
现在，你已经创建了一个 Angular 应用和一个 Node.js 应用。你可以将它们连接起来，使它们能够共同工作。
首先，你需要在 Angular 应用中安装一个 HTTP 客户端。你可以在命令行中输入以下命令：
cd my-app npm install @angular/common@latest --save
接下来，你可以在 Angular 应用中创建一个名为 api.service.ts 的文件，并输入以下代码：
-- -------------------- ---- -------
------ - ---------- - ---- ----------------
------ - ---------- - ---- -----------------------
-------------
------ ----- ---------- -
------------------- ----- ----------- --
------ --------------- -
------ ----------------------------------
-
-这将创建一个 ApiService，它使用 HttpClient 发送 HTTP 请求来获取“Hello World!”消息。
然后，你需要在 Node.js 应用中创建一个名为 api.js 的文件，并输入以下代码：
const express = require('express');
const router = express.Router();
router.get('/hello-world', function (req, res) {
res.send('Hello World!');
});
module.exports = router;这将创建一个基本的 Express 路由，它将在访问 /api/hello-world 时返回“Hello World!”。
最后，你需要在 Node.js 应用中修改 app.js 文件，以便将 api.js 路由添加到应用中：
-- -------------------- ---- ------- ----- ------- - ------------------- ----- --- - ---------- ----- --- - ----------------- --------------- ----- ---------------- -------- -- - -------------------- --- --------- -- ---- -------- ---
现在，你可以重新启动 Node.js 应用，并在 Angular 应用中调用 ApiService 的 getHelloWorld 方法来获取“Hello World!”消息。
结论
通过本文的介绍，你已经学会了如何搭建属于你自己的 Node.js + Angular 开发环境。你可以在此基础上继续学习和探索，以便更好地开发全栈应用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/675647ae3af3f99efe59ffa7