-
Notifications
You must be signed in to change notification settings - Fork 12
/
index.html
141 lines (94 loc) · 5.44 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>REM - REST API</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet" />
<style>
* {color:#473600;font:normal 16px 'Open Sans';}
main {margin:auto;max-width:900px;}
h4,a {color:#a57f00;}
h1 {font-size:24px;}
h3 {font-size:20px;}
a {text-decoration:none;}
a:hover {text-decoration:underline;}
hr {border:0;border-bottom:1px solid #ffd13d;margin:30px 0;}
pre {background:#fcf5e0;border-left:3px solid #ffd13d;padding:10px;}
code {background:#fcf5e0;font-family:monospace;}
</style>
</head>
<body>
<main>
<h1 id="rem-rest-api">REM REST API</h1>
<p><a href="#api">API</a> | <a href="#what-rem-offers">What REM offers</a> | <a href="#why-rem">Why REM</a> | <a href="#how-it-works">How it works</a> | <a href="#about">About</a> | <a href="https://github.com/lhorie/rem">Github</a></p>
<p>A starting point for big dreams.</p>
<p>REM is a REST API for prototyping. It accepts JSON requests, returns JSON responses and persists data between requests like a real API. But your test data is only visible to you. It's <a href="https://en.wikipedia.org/wiki/Cross-origin_resource_sharing">CORS</a> enabled and no API key is required.</p>
<pre><code>var xhr = new XMLHttpRequest()
xhr.open("GET", "http://rem-rest-api.herokuapp.com/api/users", true)
xhr.withCredentials = true
xhr.send()
xhr.onload = function() {
var data = JSON.parse(xhr.responseText)
}</code></pre>
<hr />
<h3 id="api">API</h3>
<h4 id="get-a-list-of-things">Get a list of things</h4>
<pre><code>GET http://rem-rest-api.herokuapp.com/api/[things]</code></pre>
<p>Results:</p>
<pre><code>{
"offset": 0,
"limit": 10,
"total": 36,
"data": [{
"id": "1",
"firstName": "Peter",
"lastName": "Mackenzie",
}, ...]
}</code></pre>
<p>Optional querystring parameters:</p>
<ul>
<li><code>offset</code>: pagination offset. Defaults to <code>0</code></li>
<li><code>limit</code>: pagination size. Defaults to <code>10</code></li>
</ul>
<pre><code>GET http://rem-rest-api.herokuapp.com/api/[things]?offset=1&limit=10</code></pre>
<hr />
<h4 id="get-one-thing">Get one thing</h4>
<pre><code>GET http://rem-rest-api.herokuapp.com/api/[things]/1</code></pre>
<p>Results:</p>
<pre><code>{
"id": "1",
"firstName": "Peter",
"lastName": "Mackenzie"
}</code></pre>
<hr />
<h4 id="create-new-thing">Create new thing</h4>
<pre><code>POST http://rem-rest-api.herokuapp.com/api/[things]
{"firstName": "Lorem", "lastName": "Ipsum"}</code></pre>
<hr />
<h4 id="upsertreplace-thing">Upsert/replace thing</h4>
<pre><code>PUT http://rem-rest-api.herokuapp.com/api/[things]/1
{"id": 1, "firstName": "Lorem", "lastName": "Ipsum"}</code></pre>
<hr />
<h4 id="delete-thing">Delete thing</h4>
<pre><code>DELETE http://rem-rest-api.herokuapp.com/api/[things]/1</code></pre>
<hr />
<h3 id="what-rem-offers">What REM offers</h3>
<p>The <code>/api/users</code> endpoint comes pre-populated with some dummy data. You can also post anything to any endpoint you want (e.g. <code>/api/projects</code>, <code>/api/comments</code>, <code>/api/toys</code>, and so on) to create datasets on the fly. Those start off empty. <code>POST</code> endpoints automatically add an <code>id</code> field to new entities. In the same vein, other endpoints expect the primary key field to be called <code>id</code>, so that request like <code>PUT /api/things/1</code> and <code>DELETE /api/others/2</code> can affect the correct entities. Other than that, there are no schema restrictions.</p>
<p>The server has <a href="https://en.wikipedia.org/wiki/Cross-origin_resource_sharing">CORS</a> enabled for all origins, and no API key is required. You can just make requests from anywhere and be on your way.</p>
<hr />
<h3 id="why-rem">Why REM</h3>
<p>Creating an application these days can often be paralyzing: Ruby or Python? Flask or Express? MySQL or Postgres? What about Redis? Often times, people give up before even starting.</p>
<p>REM is useful if you want to put together a UI but don't want to set up a server and a database to store your data yet (or ever). Maybe you're making a demo, running a workshop, or test-driving a trendy javascript framework. Whatever it is, if you just want to get an idea on screen, this tool is for you.</p>
<hr />
<h3 id="how-it-works">How it works</h3>
<p>The REM API responds as if it had a real database storing your data, but rather than doing that, it saves data in a cookie instead.</p>
<p>This means you can create entities, update them and query them, and the data will persist between requests, just like in a real API. The difference vs a real API is that no one else can see your data, because nothing actually gets saved in the server. Any data you create is only available to you, and only until the end of the browser session.</p>
<p>Note that cookies can only store about 4kb worth of data. If you go over the limit, the server will return an error and clear the cookie. When this happens, all the data will be erased, so you can continue using REM as a data storage mechanism without needing to mess around with the storage cookie.</p>
<hr />
<h3 id="about">About</h3>
<p>REM is ~250 LOC, and has no NPM dependencies.</p>
<p>Licence: MIT</p>
</main>
</body>
</html>