The document discusses NoSQL databases and emphasizes the offline-first approach for mobile applications, highlighting benefits such as improved user experience and reduced resource consumption. It covers concepts related to databases like Apache CouchDB, IBM Cloudant, and PouchDB, detailing operations like document creation, synchronization, and querying. Additionally, it introduces practical examples and frameworks for developing offline-capable web and mobile applications.

1. NoSQL on the move
Glynn Bird
ROME 18-19 MARCH 2016

2. NoSQL…

3. Relational Databases
• Defined Schema
• Tables/Columns/Rows
• Constraints/Stored Procedures/Triggers
• Indexes/Views
• Structured Query Language (SQL)

4. NoSQL Databases
• Any database that isn't a RDBMS!
• Types include:
• Document stores
• Key/Value stores
• Graph databases
• Often schemaless
• Often without SQL

5. …On the Move

6. 6

7. 7

8. 8

9. Image Credit: Joan Touzet (@wohali), ASF Member, CouchDB PMC Member
9

10. Frameworks
10

11. Image Credit: Device landscape by Jeremy Keith, on Flickr
11
Not just mobile first…

12. Image Credit: NASA New Horizons
12
Offline First
Offline-First

13. Offline, online and somewhere in-between
13

14. The Eight Fallacies of Distributed Computing
1. The network is reliable
2. Latency is zero
3. Bandwidth is infinite
4. The network is secure
5. Topology doesn't change
6. There is one administrator
7. Transport cost is zero
8. The network is homogeneous
14
Text Credit: The Eight Fallacies of Distributed Computing by Peter Deutsch | Image Credit: Pneumatic Central by Sleestak, on Flickr

15. 15
Offline-first is the only way
to achieve a true, 100%
always-on user experience.*
*assuming the device is reliable

16. Benefits of Offline First
16
• Better, faster user experience, both offline and online
• Allow your users to work offline or with limited connectivity
• Potentially saves battery life and bandwidth usage

17. Offline Patterns & Anti-Patterns
• Don't return an error for no reason
• Do let users view cached/saved data
• Do synchronize data when connected
• Consider letting your users decide when to sync
• Think about the UX of users seeing stale data
17

18. Difficulties of Offline First
18
Image credit http://www.sneakerheadvc.com/wp-content/uploads/2012/02/Apple_iSync1.png

19. Introducing CouchDB & IBM Cloudant

20. Apache CouchDB
• JSON document store
• HTTP API
• Replication
• Free, open-source
20

21. Apache CouchDB – built to replicate
• MVCC for document versioning
• Replication
• One-way or Two-way
• One-shot or continuous
21

22. Apache CouchDB – built to replicate
22
2.0
multi-node
clustering
Cloudant
Geo
Cloudant
Query
(Mango)
Cloudant
Search
(Lucene)
Dashboard

23. IBM Cloudant – built for scale
23

24. IBM Cloudant
• Globally distributed data layer for
web and mobile applications
• Run as-a-service
• MongoDB-style queries
• Advanced geospatial capabilities
• Full text search indexing
24

25. Mobile Apps - PouchDB

26. PouchDB
• A database in your web browser
• Can synchronize with any
database that implements the
CouchDB Replication Protocol
• Makes create, read, update and
delete operations extremely quickly
• Free, open-source
26

27. Getting started with PouchDB
27
<script src="https://cdn.jsdelivr.net/pouchdb/5.1.0/pouchdb.min.js"></script>
<script type="javascript">
var db = new PouchDB("smart-meter");
</script>

28. Adding documents - callbacks
28
db.post({
date: "2014-11-12T23:27:03.794Z",
kilowatt_hours: 14
}, function(err, data) {
console.log(err,data);
});

29. Adding documents - bring your own id
29
var db = new PouchDB("smart-meter");
var obj = {
_id: "abc123",
timestamp: "2014-11-12T23:27:03.794Z",
kilowatt_hours: 14
};
db.put(obj, callback);
https://github.com/bradley-holt/offline-first/blob/master/pouchdb/04-create-document-put.js

30. Getting a document
30
db.get("abc123", callback);
// calls back with
// {
// _id: "abc123",
// _rev: "1-27695d5f483ac267d03ad0e3cb54bd2c",
// timestamp: "2014-11-12T23:27:03.794Z",
// kilowatt_hours: 14
// }

31. Getting multiple documents
31
db.allDocs({include_docs:true}, callback);
// calls back with
// {
// "offset": 0,
// "total_rows": 24,
// "rows": [{...},{...}]
// }

32. Querying
32
• Primary Index
• MapReduce
• PouchDB-find plugin
• PouchDB-quick search plugin

33. Querying a Database with PouchDB Find
• Based on Cloudant Query (Mango)
• MongoDB-style query language
33
Image Credit: Mango with section on a white background by bangdoll, on Flickr
db.find({
selector: {
name: 'Mario'
debut: { '$gt': 1990 }
},
fields: ['_id', 'lastname'],
sort: ['lastname']
})...

34. Replicating a PouchDB Database
34
var db = new PouchDB("smart-meter");
var remoteDb = new PouchDB("https://bradley-holt.cloudant.com/smart-meter");
db.replicateTo(remoteDb);
https://github.com/bradley-holt/offline-first/blob/master/pouchdb/08-replicate-database.js

35. Bidirectionally Replicating a PouchDB Database
35
db.sync(remoteDb).on("change", function(info) {
// Replication has written a new document
console.log(info);
}).on("complete", function(info) {
// Replication has completed or been cancelled
console.log(info);
});
https://github.com/bradley-holt/offline-first/blob/master/pouchdb/09-replicate-database-bidirectional.js

36. Listening for Database Changes
36
var changes = remoteDb.changes({
since: "now"
}).on("change", function(change) {
// A document has changed
console.log(change);
}).on("complete", function(info) {
// changes() was canceled
console.log(info);
});
https://github.com/bradley-holt/offline-first/blob/master/pouchdb/11-database-changes.js

37. PouchDB Framework Adapters
37

38. Web Apps Going Offline

39. HTML5 Offline Application Cache
• Enables fully-functional offline
web apps
• Stores files and assets for
offline browsing
• Makes page loads very fast,
even when online
39

40. Cache Manifest File
40
<html manifest="example.appcache">
…
</html>
CACHE MANIFEST
# v1 - 2015-01-08
index.html
logo.png
app.css
app.js

41. Service Workers (Beta)
41
Client-side scripting framework for
• programmable cache
• sync
• push messaging
• geo-fencing
• background tasks
https://jakearchibald.github.io/isserviceworkerready/

42. Hybrid or Responsive Mobile Web
Apps

43. Hybrid Mobile Web Apps
• Native mobile web apps built with
HTML5, CSS and JavaScript
• Good for:
• Fully-featured, cross-platform native apps
• High-fidelity prototypes
43

44. Responsive Mobile Web Apps
• HTML5, CSS and JavaScript mobile
web apps
• Responsive design
• Enhanced to enable offline usage
44

45. Native iOS & Android Apps

46. Cloudant Sync
• Library for iOS and Android
• Provides local storage and query API
• Optional sync to Cloudant
• Open-source and free to use

47. Cloudant Sync
• Stores data using SQLite
• TouchDB provides MVCC
• Replication to Cloudant over HTTPS
• Cloudant Query API

48. Pro Forma
• Define fields you want to collect
• Renders form saving data to
PouchDB
• Replicates data to Cloudant
• Demo
https://glynnbird.github.io/proforma/
48

49. MD
• Offline word processor
• Saves Markdown documents to
PouchDB
• Replicates data to Cloudant
• Demo
http://mddoc.mybluemix.net/
49

50. Gutenberg
• Offline e-book reader
• Replicates book list from server
• Each book is a Cloudant database
• Demo
http://glynnbird.github.io/gutenberg/
50

51. www.glynnbird.com
• My home page
• Cloudant database of articles
• Replicated to PouchDB
• Appcache for offline first
• http://www.glynnbird.com/
51

52. Volt
• Password vault in a Chrome
extension
• Data stored in encrypted in PouchDB
• Optional back to CouchDB/Cloudant
• https://github.com/glynnbird/volt
52

53. Location Tracker
• Stores data locally in PouchDB
• Front end built with AngularJS
• Authentication logic built with Node.js
• User interface built with Leaflet
• Replicates location data to Cloudant
• More info:
https://cloudant.com/location-tracker/
53

54. Glynn Bird
Developer Advocate, Cloud Data Services
glynn.bird@uk.ibm.com
@glynn_bird
github.com/glynnbird

55. Image Credits
55
• Joan Touzet (@wohali), ASF Member, CouchDB PMC Member
<https://twitter.com/wohali/status/595689720933445632>
• Device landscape by Jeremy Keith, on Flickr
<https://www.flickr.com/photos/adactio/6153481666>
• NASA New Horizons
<https://www.nasa.gov/sites/default/files/thumbnails/image/nh-surface.jpg>
• Pneumatic Central by Sleestak, on Flickr
<https://www.flickr.com/photos/dlanod/235990854>
• Mango with section on a white background by bangdoll, on Flickr
<https://www.flickr.com/photos/bangdoll/5665235102>
• Grunge Warning Sign - Do Not Read This Sign by Nicolas Raymond, on Flickr
<https://www.flickr.com/photos/80497449@N04/7417352980>