-
Notifications
You must be signed in to change notification settings - Fork 27
/
developer.html
109 lines (98 loc) · 6.88 KB
/
developer.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script src="html5.js"></script><!-- this is the javascript allowing html5 to run in older browsers -->
<title>UNHOSTED - Freedom from web 2.0's monopoly platforms</title>
<link rel="stylesheet" href="css/uncompressed/reset.css" />
<link rel="stylesheet" href="css/uncompressed/text.css" />
<link rel="stylesheet" href="css/uncompressed/960.css" />
<link rel="stylesheet" href="css/uncompressed/960.css" />
<link rel="stylesheet" href="general.css" />
<link rel="stylesheet" href="css/uncompressed/layout.css" />
</head>
<body>
<div class="preload"></div>
<div class="preload2"></div>
<div class="clear"></div>
<div style="margin:3em auto; width:50em">
<h1>How to develop unhosted web apps</h1>
<p>
Previously we would present "do it with Unhosted" as a sort of platform that includes a client and a server. Now, we say 'unhosted web apps' are web apps that live in the browser and
do not have their own server-side part. That is, if server-side functionality is needed, for instance for communication or persistence, then this is considered part of the app's environment,
and not of the app itself. We have a few other tips and tricks on this page, and want to
evolve this page to a general summary of the developer resources and tools that are relevant when you are developing your unhosted web app.
</p>
</div>
<section id="maincontent" class="container_12" style="width:50em;left-margin:10em auto">
<a href="/">back</a>
</section>
<section id="maincontent" class="container_12" style="width:50em;margin:10em auto;background:#303030;border-radius:1em">
<div style="margin:3em;padding:3em">
<h2>RemoteStorageJs</h2>
Our main tool here for storing user data from an unhosted web app is the 'remote storage' standard.
It allows a user to connect a compatible storage server with a compatible unhosted web app. So your app stores data to a remote storage server
that is <strong>owned by the user, not by the app developer</strong>. So this is a big paradigm shift!
To create apps that allow users to connect their remote storage, we recommend you use <a href="http://remotestorage.io/">RemoteStorageJs</a>.
It's the equivalent of iCloud for unhosted web apps. It is still in developer preview, but already provides the following modules:
<ul>
<li><strong>Contacts</strong> - for accessing a user's addressbook in the cloud</li>
<li><strong>Documents</strong> - same for their documents</li>
<li><strong>Tasks</strong> - for all types of productivity management</li>
<li><strong>Calendar</strong> - one calendar across all unhosted web apps</li>
<li><strong>Money</strong> - this module grew out of <a href="http://opentabs.net">Opentabs</a> and <a href="http://webcredits.org">WebCredits</a></li>
<li><strong>Root</strong> - "access all areas", useful for account migrations</li>
</ul>
</p></div></section>
<section id="maincontent" class="container_12" style="width:50em;margin:10em auto;background:#303030;border-radius:1em">
<div style="margin:3em;padding:3em">
<h2>The Unhosted Unconference</h2>
<h4>Weekend of 7-9 September 2012, near Prague (CZ)</h4>
<p>
If you're near Prague this September, then don't miss <a href="http://2012.unhosted.org/">The Unhosted Unconference</a>. It's an unorganized get-together in a village in the hills of Central Bohemia which was named after it. The wifi is flaky and the Pilsener beer is very cheap. ClubMate will be transported from Berlin by train for the occasion. The rest is up to you.
</p></div></section>
<section id="maincontent" class="container_12" style="width:50em;margin:10em auto;background:#303030;border-radius:1em">
<div style="margin:3em;padding:3em">
<h2>Firefox as your phone</h2>
<p>
People developing iPhone apps are one big competitor and talent drain of the open web.
Solution: We have to make the web as good as Apple's proprietary platform.
With <a href="http://blog.mozilla.org/blog/2012/07/02/firefox-mobile-os/" target="_blank">Firefox OS</a>, Mozilla strikes back
in defense of the open web and launches its own smartphone and tablet platform.
Entirely open. Entirely based on html and javascript. Firefox OS is based on Boot2Gecko, which is basically Firefox mobile on a very
stripped-down Android extract, and <a href="https://wiki.mozilla.org/WebAPI">WebAPI</a>,
an endeavour to expose all device functionality to javascript as simple DOM interfaces.
</p></div></section>
<section id="maincontent" class="container_12" style="width:50em;margin:10em auto;background:#303030;border-radius:1em">
<div style="margin:3em;padding:3em">
<h2>WebIntents</h2>
<p>
<a href="http://webintents.org">WebIntents</a> provide a way to communicate with other unhosted web apps that are installed on the same device, as well as with hosted web apps which might be open in the browser, and also possibly some native device functionality.
</p></div></section>
<section id="maincontent" class="container_12" style="width:50em;margin:10em auto;background:#303030;border-radius:1em">
<div style="margin:3em;padding:3em">
<h2>PouchDB</h2>
<p>
<a href="http://pouchdb.com">PouchDB</a> is the browser database that syncs. Go check it out, it's awesome!
</p></div></section>
<section id="maincontent" class="container_12" style="width:50em;margin:10em auto;background:#303030;border-radius:1em">
<div style="margin:3em;padding:3em">
<h2>WebP2P</h2>
<p>
<a href="http://webp2p.org">WebP2P</a> is a discussion forum for exploring how to use WebRTC to build peer-to-peer applications on the web.
</p></div></section>
<section id="maincontent" class="container_12" style="width:50em;margin:10em auto;background:#303030;border-radius:1em">
<div style="margin:3em;padding:3em">
<h2>5apps news</h2>
<p>
The equivalent of Hacker News, but focused on technologies that will boost your unhosted web app with awesomeness. Follow <a href="https://5apps.com/news">5apps news</a> for your daily dosis.
</p></div></section>
<section id="maincontent" class="container_12" style="width:50em;margin:10em auto;background:#303030;border-radius:1em">
<div style="margin:3em;padding:3em">
<h2>5apps for packaging and deployment</h2>
<p>
There are a lot of rapidly changing formats and technologies to package a html5-based app for distribution to an app store and onto a device. <a href="https://5apps.com/">5apps</a> is a very handy tool that takes your mind off the various manifest files and allows you to focus on just the app itself. To deploy, simply type 'git push 5apps master' from your repo. The rest is automatic.
</p></div></section>
<div class="clear"></div>
</body>
</html>