-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathpricing.html
More file actions
458 lines (453 loc) · 15.8 KB
/
pricing.html
File metadata and controls
458 lines (453 loc) · 15.8 KB
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
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no" />
<meta name="theme-color" content="#2196F3">
<title>Reactive Maps - Appbase.io</title>
<link href="website/dist/css/vendor.min.css" type="text/css" rel="stylesheet">
<link href="website/dist/css/style.min.css" type="text/css" rel="stylesheet">
</head>
<body id="home" class="pricing-page">
<!-- top section START -->
<section id="top" class="container-fluid">
<!-- Navigation START -->
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">
<img src="website/assets/images/reactive-logo.png" alt="Icon" />
</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="manual/">Manual <span class="sr-only">(current)</span></a></li>
<li><a href="playground/">Playground</a></li>
<li><a href="examples/">Examples</a></li>
<li><a href="https://github.com/appbaseio/reactivemaps">Github</a></li>
</ul>
</div>
</div>
</nav>
<!-- Navigation END -->
<div class="container">
<div class="row">
<div class="col-xs-12 text-center">
<div class="landing-content landing-section">
<h1 class="website-title m-b-2">Reactive Maps</h1>
<div class="description bottom-line">
is open source and free
</div>
</div>
</div>
</div>
<div class="row text-center landing-section">
<div class="star-frame">
<iframe src="https://ghbtns.com/github-btn.html?user=appbaseio&repo=reactivemaps&type=star&count=true&size=large" frameBorder="0" scrolling="0" width="140px" height="30px"></iframe>
<p>Licensed as Apache 2.0</p>
</div>
</div>
<div class="row text-center landing-section last-section poweredby-section">
<span>ReactiveMaps is powered by</span> <span><img class="img-responsive" src="website/assets/images/PB_Appbase_White-01.png" alt=""></span>
</div>
</div>
</section>
<!-- top section END -->
<!-- features section START -->
<section id="features" class="container-fluid">
<div class="container">
<div class="row text-center">
<!-- feature START -->
<div class="col-xs-12 col-sm-4 feature">
<div class="img-container">
<img src="website/assets/images/pricing/RM_Pricing_Icon.svg" class="img-responsive" alt="Icon" />
</div>
<div>
<h3 class="title">
Complete Search GUI
</h3>
<p class="description">
Integrate with Angular, React, jQuery, Node.js or with any server side app
</p>
</div>
</div>
<!-- feature END -->
<!-- feature START -->
<div class="col-xs-12 col-sm-4 feature">
<div class="img-container">
<img src="website/assets/images/pricing/RM_Pricing_Icon_2.svg" class="img-responsive" alt="Icon" />
</div>
<div>
<h3 class="title">
100% Managed
</h3>
<p class="description">
Whether you are a getting things done startup user or an enterprise user building a solid foundation, we have got you covered.
</p>
</div>
</div>
<!-- feature END -->
<!-- feature START -->
<div class="col-xs-12 col-sm-4 feature">
<div class="img-container">
<img src="website/assets/images/pricing/RM_Pricing_Icon_3.svg" class="img-responsive" alt="Icon" />
</div>
<div>
<h3 class="title">
Keep it real support
</h3>
<p class="description">
Whether you are a getting things done startup user or an enterprise user building a solid foundation, we have got you covered.
</p>
</div>
</div>
<!-- feature END -->
<!-- feature START -->
<div class="col-xs-12 col-sm-4 feature">
<div class="img-container">
<img src="website/assets/images/pricing/RM_Pricing_Icon_4.svg" class="img-responsive" alt="Icon" />
</div>
<div>
<h3 class="title">
RESTful Indexing
</h3>
<p class="description">
Whether you are a getting things done startup user or an enterprise user building a solid foundation, we have got you covered.
</p>
</div>
</div>
<!-- feature END -->
<!-- feature START -->
<div class="col-xs-12 col-sm-4 feature">
<div class="img-container">
<img src="website/assets/images/pricing/RM_Pricing_Icon_5.svg" class="img-responsive" alt="Icon" />
</div>
<div>
<h3 class="title">
Open-source
</h3>
<p class="description">
Whether you are a getting things done startup user or an enterprise user building a solid foundation, we have got you covered.
</p>
</div>
</div>
<!-- feature END -->
<!-- feature START -->
<div class="col-xs-12 col-sm-4 feature">
<div class="img-container">
<img src="website/assets/images/pricing/RM_Pricing_Icon_6.svg" class="img-responsive" alt="Icon" />
</div>
<div>
<h3 class="title">
Extensible Tooling
</h3>
<p class="description">
Whether you are a getting things done startup user or an enterprise user building a solid foundation, we have got you covered.
</p>
</div>
</div>
<!-- feature END -->
</div>
</div>
</section>
<!-- features section END -->
<!-- cards-container START -->
<section class="container-fluid" id="cards-container">
<div class="row">
<div class="pricing-top col-xs-12">
<div class="container">
<div class="row">
<h2 class="col-xs-12 title">Pricing Plans</h2>
</div>
<div class="row">
<div class="toggleButton">
<button class="btn left monthly">
Monthly
</button>
<button class="btn right annually active">
Annually
</button>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- cards Start -->
<section class="container" id="cards">
<div class="row cards-container">
<!-- bootstrap card start -->
<div class="col-xs-12 col-sm-4 single-card-container" id="bootstrap-card">
<div class="price-card">
<div class="title">
<span><span class="unit">$</span><span class="plan-price" data-ng-bind="bootstrap">19</span></span>
<span class="superscript">
BOOTSTRAP
</span>
<span class="subscript">
per app / month
</span>
</div>
<ul class="description">
<li>
<div class="text-container">
<div class="figure">1,000,000</div>
<div class="summary">Actions</div>
</div>
</li>
<li>
<div class="text-container">
<div class="figure">100,000</div>
<div class="summary">Records</div>
</div>
</li>
<li>
<div class="text-container">
<div class="big-description">
E-mails and chat
</div>
</div>
</li>
<li class="subscribe-li">
<div class="button text-center">
<button class="theme-btn get-started">
<span >Get started</span>
</button>
</div>
</li>
</ul>
</div>
</div>
<!-- bootstrap card end -->
<!-- growth card start -->
<div class="col-xs-12 col-sm-4 single-card-container" id="growth-card">
<div class="price-card">
<div class="title">
<span><span class="unit">$</span><span class="plan-price" data-ng-bind="growth">59</span></span>
<span class="superscript">
GROWTH
</span>
<span class="subscript">
per app / month
</span>
</div>
<ul class="description">
<li>
<div class="text-container">
<div class="figure">10,000,000</div>
<div class="summary">Actions</div>
<div class="small-fonts">
$5 per additional 1M actions
</div>
</div>
</li>
<li>
<div class="text-container">
<div class="figure">1,000,000</div>
<div class="summary">Records</div>
<div class="small-fonts">
$5 per additional 100k records
</div>
</div>
</li>
<li>
<div class="text-container">
<div class="big-description list-bottom-gap">
1:1 architecture reviews
</div>
<div class="big-description">
E-mails and chat
</div>
</div>
</li>
<li class="subscribe-li">
<div class="button text-center p-6">
<button class="theme-btn get-started">
<span data-ng-if="plan !== 'growth'">Get started</span>
</button>
</div>
</li>
</ul>
</div>
</div>
<!-- growth card end -->
<!-- dedicated card start -->
<div class="col-xs-12 col-sm-4 single-card-container" id="dedicated-card">
<div class="price-card">
<div class="title">
<span><span class="unit">$</span><span class="plan-price" data-ng-bind="growth">299</span></span>
<span class="superscript">
DEDICATED
</span>
<span class="subscript">
per app / month
</span>
</div>
<ul class="description">
<li>
<div class="text-container">
<div class="figure">10,000,000</div>
<div class="summary">Actions</div>
<div class="small-fonts">
$5 per additional 1M actions
</div>
</div>
</li>
<li>
<div class="text-container">
<div class="figure">1,000,000</div>
<div class="summary">Records</div>
<div class="small-fonts">
$5 per additional 100k records
</div>
</div>
</li>
<li>
<div class="text-container">
<div class="big-description list-bottom-gap">
1:1 architecture reviews
</div>
<div class="big-description">
E-mails and chat
</div>
</div>
</li>
<li class="subscribe-li">
<div class="button text-center p-6">
<button class="theme-btn get-started">
<span data-ng-if="plan !== 'growth'">Get started</span>
</button>
</div>
</li>
</ul>
</div>
</div>
<!-- growth card end -->
</div>
</section>
<!-- cards END -->
<!-- pricing-plan section START -->
<section id="pricing-plan" class="container-fluid">
<div class="container">
<div class="row text-center">
<h2 class="col-xs-12 title">One of our team members will design the UI according to your tastes.</h2>
<div class="col-xs-12">
<a href="#" class="btn theme-btn">
$50/hour for all plan members
</a>
</div>
</div>
</div>
</section>
<!-- pricing-plan section END -->
<!-- faq START -->
<section id="faq-container" class="container-fluid">
<div id="feature-body">
<div class="col-xs-12 text-center">
<h2 class="btitle">Frequently Asked Questions</h2>
</div>
<div class="row faq" id="faq">
<div class="col-xs-12 col-md-4">
<h2>Data Streams</h2>
<ul>
<li class="active">
<div class="title">What are "Reactive Apps"?</div>
<div class="answer">
<p>Reactive Apps are modern web (or native) apps that are designed to responsive to a user's data needs. They often involve building recommendation systems, analytics dashboards, personalized feeds, geolocation based services, search, integrating backend APIs.</p>
<p>
</div>
</li>
<li>
<div class="title">What goes into building a reactive app?</div>
<div class="answer">
<p>1. Backend layer - The key component in a reactive app is a realtime backend layer, which can run continuous database queries.</p>
<p>2. Rich frontend - The frontend layer then reactively renders query results to the user.</p>
<p>3. Middleware(s) - The middleware layer ties different API integrations, webhook calls, and acts as a transmitting source to another reactive app.</p>
</div>
</li>
<li>
<div class="title">Can't this be done with Socket.IO?</div>
<div class="answer">
<p>Socket.IO is a websockets library for creating realtime channels. It's great for building chat like apps (which are reactive) but can't be extended well to data rich apps that involve search, personalized feeds, geolocation queries and realtime data analytics.</p>
</div>
</li>
</ul>
</div>
<div class="col-xs-12 col-md-4">
<h2>How Reactive Maps Works</h2>
<ul>
<li class="active">
<div class="title">How does appbase.io work?</div>
<div class="answer">
<p>appbase.io is a hosted API for the backend layer in reactive apps. It supports 100+ different queries ranging from geolocation to exact terms to fuzzy search.</p>
</div>
</li>
<li>
<div class="title">How performant is Appbase?</div>
<div class="answer">
<p>Appbase.io deploys multi-tenant ElasticSearch clusters, with up to 100,000 writes per second per cluster. You can check our uptime status at
<a href="http://statuspage.appbase.io" target="_blank">statuspage.appbase.io</a>.
</p>
</div>
</li>
</ul>
</div>
<div class="col-xs-12 col-md-4">
<h2>Payments</h2>
<ul>
<li class="active">
<div class="title">How does the free plan work?</div>
<div class="answer">
<p>The free plan requires no credit card upfront, and lasts until you are ready to launch. You will be able to try out every feature that Appbase.io offers, however you can make up to 100,000 API calls (aka Actions) every month.</p>
<p>Appbase.io dashboard has an analytics view where you can track your app's usage. If you exceed the API usage at any point, we will automatically upgrade your usage tier and you will have up to a week to make up your mind. If you continue using the free plan, we will still <3 you.</p>
</div>
</li>
<li>
<div class="title">How does the pricing work?</div>
<div class="answer">
<p>The pricing is based on two factors primarily: API usage and storage (in GB).</p>
<p>
<b>API usage:</b> A single document read / query request counts as 1 API call. A stream update with a change of 1 document also counts as 1 API call. An indexing request also counts as 1 API call. The free plan comes up with 100K API calls every month.
</p>
<p>
<b>Storage:</b> The primary storage is charged in GBs. The free plan comes with 100 MB, sufficient for hobby projects.
</p>
</div>
</li>
<li>
<div class="title">How do you charge overuse?</div>
<div class="answer">
<p>The overuse gets charged in the next month's billing cycle on a prorata basis. The prorata rate is calculated based on the overusage of the maximum of the two metrics: API calls, and Storage.</p>
<p>For instance, if you are on the "Hacker Plan" and make 1.1M API calls with 1.5GB storage, you would be charged an additional $25 (based on storage overusage) in the next month's billing cycle.</p>
</div>
</li>
</ul>
</div>
</div>
</div>
</section>
<!-- faq END -->
<footer class="container-fluid">
<div class="row">
<div class="col-xs-12">
<ul class="nav navbar-nav navbar-left">
<li><a href="manual/">Read the Manual</a></li>
<li><a href="playground/" target="_blank">Component Playground</a></li>
</ul>
<a href="https://appbase.io" class="pull-right footer-link" target="_blank">
Made with <i class="fa fa-heart"></i> by appbase.io
</a>
</div>
</div>
</footer>
<!-- Scripts-->
<script src="website/dist/js/vendor.min.js"></script>
<script src="website/assets/js/app.js"></script>
</body>
</html>