Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jesperorb/json-server-heroku
Deploy json-server to Heroku & Glitch & Azure :up: :free:
https://github.com/jesperorb/json-server-heroku
api-rest api-server azure glitch glitch-com heroku heroku-cli hosting json-server node rest rest-api restful-api
Last synced: about 1 month ago
JSON representation
Deploy json-server to Heroku & Glitch & Azure :up: :free:
- Host: GitHub
- URL: https://github.com/jesperorb/json-server-heroku
- Owner: jesperorb
- Created: 2017-03-07T14:02:59.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2023-02-03T14:19:33.000Z (almost 2 years ago)
- Last Synced: 2024-08-04T01:10:09.901Z (5 months ago)
- Topics: api-rest, api-server, azure, glitch, glitch-com, heroku, heroku-cli, hosting, json-server, node, rest, rest-api, restful-api
- Language: JavaScript
- Homepage:
- Size: 130 KB
- Stars: 503
- Watchers: 17
- Forks: 441
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Deploy `json-server` to `{{ free hosting site }}`
> Instructions how to deploy the full fake REST API [json-server](https://github.com/typicode/json-server) to various free hosting sites. Should only be used in development purpose but can act as a simpler database for smaller applications.
* [**Create your database**](#create-your-database)
* [Deploy to **Heroku**](#deploy-to-heroku)
* [Deploy to **Glitch**](#deploy-to-glitch)
* [Deploy to **Azure**](#deploy-to-azure)
## Create your database
1. Press the green `Use this template`-button in the right corner
2. Give your new repo a name and press the green `Create repository from template`-button
3. Clone your newly created repository to your computer
4 . Change the contents of `db.json` to **your own content** according to the [`json-server example`](https://github.com/typicode/json-server#example) and then `commit` your changes to git locally.
_this example will create `/posts` route , each resource will have `id`, `title` and `content`. `id` will auto increment!_
```json
{
"posts":[
{
"id" : 0,
"title": "First post!",
"content" : "My first content!"
}
]
}
```
---
## Deploy to **Heroku**
Heroku is a free hosting service for hosting small projects. Easy setup and deploy from the command line via _git_.
###### Pros
* Easy setup
* Free
###### Cons
* App has to sleep a couple of hours every day.
* "Powers down" after 30 mins of inactivity. Starts back up when you visit the site but it takes a few extra seconds. Can maybe be solved with [**Kaffeine**](http://kaffeine.herokuapp.com/)
---
### Install Heroku
1 . [Create your database](#create-your-database)
2 . Create an account on
[https://heroku.com](https://heroku.com)
3 . Install the Heroku CLI on your computer:
[https://devcenter.heroku.com/articles/heroku-cli](https://devcenter.heroku.com/articles/heroku-cli)
4 . Connect the Heroku CLI to your account by writing the following command in your terminal and follow the instructions on the command line:
```bash
heroku login
```
5 . Then create a remote heroku project, kinda like creating a git repository on GitHub. This will create a project on Heroku with a random name. If you want to name your app you have to supply your own name like `heroku create project-name`:
```bash
heroku create my-cool-project
```
6 . Push your app to __Heroku__ (you will see a wall of code)
```bash
git push heroku master
```
7 . Visit your newly create app by opening it via heroku:
```bash
heroku open
```
8 . For debugging if something went wrong:
```bash
heroku logs --tail
```
---
#### How it works
Heroku will look for a startup-script, this is by default `npm start` so make sure you have that in your `package.json` (assuming your script is called `server.js`):
```json
"scripts": {
"start" : "node server.js"
}
```
You also have to make changes to the port, you can't hardcode a dev-port. But you can reference herokus port. So the code will have the following:
```js
const port = process.env.PORT || 4000;
```
## Deploy to Glitch
Not tested 100%. Same as with Heroku, will sleep after a while.
1. Register for [Glitch](https://glitch.com/) or go to [Glitch/edit](https://glitch.com/)
2. Click **New Project**
3. Click **Import from GitHub**
4. Paste `https://github.com/jesperorb/json-server-heroku.git` into the URL-input and click OK.
5. Wait for it to setup
6. Press **Share**-button to get your URL to live site. It should be something for example like: `https://fallabe-pie-snake.glitch.me`. And your DB will be at `https://fallabe-pie-snake.glitch.me/posts`
## Deploy to **Azure**
You can also use _Microsoft Azure_ to deploy a smaller app for free to the Azure platform. The service is not as easy as _Heroku_ and you might go insane because the documentation is really really bad at some times and it's hard to troubleshoot.
The **pros** are that on _Azure_ the app **will not be forced to sleep**. It will sleep automatically on inactivity but you can just visit it and it will start up.
## Installation
1 . Create a Microsoft Account that you can use on Azure:
https://azure.microsoft.com/
2 . Install the `azure-cli`:
https://docs.microsoft.com/en-us/cli/azure/install-azure-cli
_This might cause some trouble, you will see. Remember to restart your terminal or maybe your computer if the commands after this does not work_
3 . Login to the service via the command line and follow the instructions:
```bash
az login
```
_You will be prompted to visit a website and paste a confirmation code_
## Create the project
1 . [Create your database](#create-your-database)
2 . Create a resource group for your projects, replace the name to whatever you want just be sure to use the same group name in all commands to come. You only have to create the resource group and service plan once, then you can use the same group and plan for all other apps you create if you like.
```bash
az group create -n NameOfResourceGroup -l northeurope
```
3 . Create a service plan:
```
az appservice plan create -n NameOfServicePlan -g NameOfResourceGroup
```
4 . Create the actual app and supply the service plan and resource group
```bash
az webapp create -n NameOfApp -g NameOfResourceGroup --plan NameOfServicePlan
```
5 . Create deployment details. A git-repo is not created automatically so we have to create it with a command:
```bash
az webapp deployment source config-local-git -n NameOfApp -g NameOfResourceGroup
```
6 . From the command in step 5 you should get a **url** in return. Copy this url and add it as a remote to your local git project, for example:
```bash
git remote add azure https://[email protected]/deploy-testing.git
```
7 . Now you should be able to push your app:
```bash
git push azure master
```
You should be prompted to supply a password, this should be the pass to your account. If not, you can choose a different password at your Dashboard for Azure: **[https://portal.azure.com/](https://portal.azure.com/)**
Choose **App Services** in the sidebar to the left and the choose your app in the list that appears then go to **Deployment Credentials** to change your password for deployment:
https://docs.microsoft.com/en-us/azure/app-service/app-service-deployment-credentials