使用 JSON-SERVER、GitHub 和 Heroku 部署虚假后端服务器和数据库。1. 创建虚假服务器。2. 创建数据库。3. 创建服务器。4. 创建管道。

2025-06-10

使用 JSON-SERVER、GitHub 和 Heroku 部署虚假后端服务器和数据库。

1.创建虚假服务器。

2.创建数据库

3.创建服务器

4.创建管道。

在本文中,我们将创建并托管一个虚假服务器,我们可以将其作为普通后端服务器来处理,并使用 HTTP 请求执行所有 CRUD 操作。

1.创建虚假服务器。

您可以在此处下载最终结果,或者跟随我一起进行。

  • 创建一个文件夹并将其命名为fake-server
  • 打开终端并初始化 npm,并创建入口点server.js
npm init 
Enter fullscreen mode Exit fullscreen mode
npm i json-server
Enter fullscreen mode Exit fullscreen mode
  • start在 中添加脚本package.json

包.json

{
  "name": "fake-server",
  "version": "1.0.0",
  "description": "fake server with fake database",
  "main": "server.js",
  "scripts": { // <===
    "start": "node server.js" // <===
  },
  "author": "Youssef Zidan",
  "license": "ISC",
  "dependencies": {
    "json-server": "^0.16.3"
  }
}

Enter fullscreen mode Exit fullscreen mode
  • 创建.gitignore文件并添加node_modules. .gitignore
node_modules
Enter fullscreen mode Exit fullscreen mode
  • 创建server.js文件并粘贴以下内容
const jsonServer = require('json-server');
const server = jsonServer.create();
const router = jsonServer.router('db.json'); // <== Will be created later
const middlewares = jsonServer.defaults();
const port = process.env.PORT || 3200; // <== You can change the port

server.use(middlewares);
server.use(router);

server.listen(port);
Enter fullscreen mode Exit fullscreen mode
  • 初始化 git 并将你的仓库发布到GitHub
git init
git remote add origin https://github.com/<YourName>/<Repo-Name>.git
git add .
git push --set-upstream origin master
Enter fullscreen mode Exit fullscreen mode

从此处下载最终的 Repo

2.创建数据库

  • 创建db.json文件
  • 填写您喜欢的任何数据,我使用Mockaroo,这是一种生成虚拟数据的绝佳且简单的方法。

数据库.json

{
  "users": [
    {
      "id": 1,
      "first_name": "Justina",
      "last_name": "Ginglell",
      "email": "jginglell0@networkadvertising.org",
      "gender": "Female"
    },
    {
      "id": 2,
      "first_name": "Marion",
      "last_name": "Jenman",
      "email": "mjenman1@surveymonkey.com",
      "gender": "Male"
    },
    {
      "id": 3,
      "first_name": "Alfy",
      "last_name": "Begin",
      "email": "abegin2@list-manage.com",
      "gender": "Female"
    },
    {
      "id": 4,
      "first_name": "Karney",
      "last_name": "Zanussii",
      "email": "kzanussii3@hao123.com",
      "gender": "Male"
    },
    {
      "id": 5,
      "first_name": "Reid",
      "last_name": "Schapero",
      "email": "rschapero4@timesonline.co.uk",
      "gender": "Male"
    },
    {
      "id": 6,
      "first_name": "Dorine",
      "last_name": "Braybrookes",
      "email": "dbraybrookes5@gov.uk",
      "gender": "Female"
    },
    {
      "id": 7,
      "first_name": "Sarena",
      "last_name": "Frape",
      "email": "sfrape6@alexa.com",
      "gender": "Female"
    },
    {
      "id": 8,
      "first_name": "Malva",
      "last_name": "Pierse",
      "email": "mpierse7@usda.gov",
      "gender": "Female"
    },
    {
      "id": 9,
      "first_name": "Rania",
      "last_name": "Dablin",
      "email": "rdablin8@state.gov",
      "gender": "Female"
    },
    {
      "id": 10,
      "first_name": "Ingrim",
      "last_name": "Offen",
      "email": "ioffen9@slideshare.net",
      "gender": "Male"
    }
  ]
}

Enter fullscreen mode Exit fullscreen mode
  • 将你的工作推送到 GitHub
git add .
git commit -m "creating the database"
git push
Enter fullscreen mode Exit fullscreen mode

3.创建服务器

  • 在Heroku上创建帐户
  • 在您的计算机上安装Heroku CLI
  • 打开终端并登录,然后按照说明进行操作
heroku login
Enter fullscreen mode Exit fullscreen mode
  • 创建项目
heroku create fake-server-app
Enter fullscreen mode Exit fullscreen mode
  • 将您的应用推送到 Heroku
git push heroku master
Enter fullscreen mode Exit fullscreen mode
  • 打开您创建的应用程序
heroku open
Enter fullscreen mode Exit fullscreen mode

你会看到类似这样的内容:

Heroku 应用

现在,您可以通过任何 HTTP 方法访问和修改资源
GET POST PUT PATCH DELETE OPTIONS

4.创建管道。

管道只是 GitHub 仓库和 Heroku 项目之间的连接。
因此,每当您更新db.json代码并将更改推送到特定分支时,Heroku 都会监听该分支并使用更新后的数据库构建您的应用程序。

  • 在 Heroku 上打开您的仪表板并选择您的应用程序。
    替代文本

  • 导航到Deploytap 并创建管道,将您的 GitHub 与 fake-server repo 连接起来

替代文本

  • 配置自动部署并选择管道的分支

替代文本

现在,无论何时将更改推送到所选分支,数据库都会更新,并且可以通过相同的基本 API 进行访问。


LinkedIn

链接:https://dev.to/youssefzidan/deploying-fake-back-end-server-database-using-json-server-github-and-heroku-1lm4
PREV
使用 Node 构建 HTTP 服务器的最简单方法
NEXT
提高专注力的 4 个步骤 1 — 始终提前规划任务 2 — 杜绝一切干扰和打扰 3 — 保持整洁、简约的工作空间 4 — 将专注工作变成一种习惯 结论