You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Sep 4, 2020. It is now read-only.
Copy file name to clipboardExpand all lines: README.md
+16-10Lines changed: 16 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -2,24 +2,30 @@
2
2
3
3
🔌 A simple wrapper for [AngularFire2](https://github.com/angular/angularfire2) to read and write to Firebase while offline, even after a complete refresh.
- Methods mirror AngularFire2 database methods for [`object`](https://github.com/angular/angularfire2/blob/master/docs/2-retrieving-data-as-objects.md#retrieve-data) and [`list`](https://github.com/angular/angularfire2/blob/master/docs/3-retrieving-data-as-lists.md#retrieve-data).
63
+
- Methods mirror AngularFire2 database methods for [`object`](https://github.com/angular/angularfire2/blob/two/docs/2-retrieving-data-as-objects.md#retrieve-data) and [`list`](https://github.com/angular/angularfire2/blob/two/docs/3-retrieving-data-as-lists.md#retrieve-data).
58
64
59
65
### Read Data Offline
60
66
61
-
-[Querying lists](https://github.com/angular/angularfire2/blob/master/docs/4-querying-lists.md) is supported
67
+
-[Querying lists](https://github.com/angular/angularfire2/blob/two/docs/4-querying-lists.md) is supported
Copy file name to clipboardExpand all lines: examples/angular-cli/README.md
+32-25Lines changed: 32 additions & 25 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -2,19 +2,25 @@
2
2
3
3
How to create an app that loads Firebase data and static resources while offline.
4
4
5
+
## <spanstyle="color:red">Important</span>
6
+
7
+
### This is a legacy branch that supports AngularFire2 version 2.x
8
+
9
+
For the latest version of AngularFire2 Offline **switch to the [master branch](https://github.com/adriancarriger/angularfire2-offline/tree/master/examples/angular-cli#angular-cli-offline-tutorial-)**
@@ -52,7 +58,7 @@ Now that you have a new project setup, install [AngularFire2Offline](https://www
52
58
53
59
### 5. Setup @NgModule
54
60
55
-
Open [`/src/app/app.module.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/src/app/app.module.ts), inject the Firebase providers, and specify your Firebase configuration.
61
+
Open [`/src/app/app.module.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/src/app/app.module.ts), inject the Firebase providers, and specify your Firebase configuration.
56
62
This can be found in your project at [the Firebase Console](https://console.firebase.google.com):
57
63
58
64
```ts
@@ -90,7 +96,7 @@ export class AppModule { }
90
96
91
97
### 6. Read an object - [Demo](https://angularfire2-offline.firebaseapp.com/read-object)
92
98
93
-
In [`/src/app/examples/read-object/read-object.component.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/src/app/examples/read-object/read-object.component.ts):
99
+
In [`/src/app/examples/read-object/read-object.component.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/src/app/examples/read-object/read-object.component.ts):
94
100
95
101
```ts
96
102
import { Component, OnInit } from'@angular/core';
@@ -109,15 +115,15 @@ export class ReadObjectComponent {
109
115
}
110
116
```
111
117
112
-
In [`/src/app/examples/read-object/read-object.component.html`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/src/app/examples/read-object/read-object.component.html):
118
+
In [`/src/app/examples/read-object/read-object.component.html`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/src/app/examples/read-object/read-object.component.html):
113
119
114
120
```html
115
121
<h2>{{ (info | async)?.title }}</h2>
116
122
```
117
123
118
124
### 7. Read a list - [Demo](https://angularfire2-offline.firebaseapp.com/read-list)
119
125
120
-
In [`/src/app/examples/read-list/read-list.component.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/src/app/examples/read-list/read-list.component.ts):
126
+
In [`/src/app/examples/read-list/read-list.component.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/src/app/examples/read-list/read-list.component.ts):
121
127
122
128
```ts
123
129
import { Component, OnInit } from'@angular/core';
@@ -136,7 +142,7 @@ export class ReadListComponent {
136
142
}
137
143
```
138
144
139
-
In [`/src/app/examples/read-list/read-list.component.html`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/src/app/examples/read-list/read-list.component.html):
145
+
In [`/src/app/examples/read-list/read-list.component.html`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/src/app/examples/read-list/read-list.component.html):
140
146
141
147
```html
142
148
<ul>
@@ -148,7 +154,7 @@ In [`/src/app/examples/read-list/read-list.component.html`](https://github.com/a
148
154
149
155
### 8. Write an object - [Demo](https://angularfire2-offline.firebaseapp.com/write-object)
150
156
151
-
In [`/src/app/examples/write-object/write-object.component.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/src/app/examples/write-object/write-object.component.ts):
157
+
In [`/src/app/examples/write-object/write-object.component.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/src/app/examples/write-object/write-object.component.ts):
152
158
153
159
```ts
154
160
import { Component, OnInit } from'@angular/core';
@@ -194,7 +200,7 @@ export class WriteObjectComponent {
194
200
}
195
201
```
196
202
197
-
In [`/src/app/examples/write-object/write-object.component.html`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/src/app/examples/write-object/write-object.component.html):
203
+
In [`/src/app/examples/write-object/write-object.component.html`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/src/app/examples/write-object/write-object.component.html):
@@ -207,7 +213,7 @@ In [`/src/app/examples/write-object/write-object.component.html`](https://github
207
213
208
214
### 9. Write a list - [Demo](https://angularfire2-offline.firebaseapp.com/write-list)
209
215
210
-
In [`/src/app/examples/write-list/write-list.component.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/src/app/examples/write-list/write-list.component.ts):
216
+
In [`/src/app/examples/write-list/write-list.component.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/src/app/examples/write-list/write-list.component.ts):
211
217
212
218
```ts
213
219
import { Component, OnInit } from'@angular/core';
@@ -244,7 +250,7 @@ export class WriteListComponent {
244
250
}
245
251
```
246
252
247
-
In [`/src/app/examples/write-list/write-list.component.html`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/src/app/examples/write-list/write-list.component.html):
253
+
In [`/src/app/examples/write-list/write-list.component.html`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/src/app/examples/write-list/write-list.component.html):
248
254
249
255
```html
250
256
@@ -282,7 +288,7 @@ The following steps are based on [this tutorial](https://coryrylan.com/blog/fast
282
288
283
289
### 1. Add a service worker
284
290
285
-
In [`/src/index.html`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/src/index.html#L12-L20) add the following just before the closing `body` tag:
291
+
In [`/src/index.html`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/src/index.html#L12-L20) add the following just before the closing `body` tag:
286
292
287
293
```html
288
294
<script>
@@ -298,11 +304,11 @@ In [`/src/index.html`](https://github.com/adriancarriger/angularfire2-offline/bl
298
304
299
305
### 2. Add `service-worker.js`
300
306
301
-
Create an empty file called `service-worker.js` located at [`/src/service-worker.js`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/src/service-worker.js)
307
+
Create an empty file called `service-worker.js` located at [`/src/service-worker.js`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/src/service-worker.js)
302
308
303
309
### 3. Add assets
304
310
305
-
In [`/angular-cli.json`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/angular-cli.json#L11-L15) add `service-worker.js` to the assets array:
311
+
In [`/angular-cli.json`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/angular-cli.json#L11-L15) add `service-worker.js` to the assets array:
In [`/package.json`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/package.json#L12-L13) add the `sw` and `build:prod` scripts:
329
+
In [`/package.json`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/package.json#L12-L13) add the `sw` and `build:prod` scripts:
324
330
325
331
```json
326
332
"scripts": {
@@ -336,7 +342,7 @@ In [`/package.json`](https://github.com/adriancarriger/angularfire2-offline/blob
336
342
337
343
### 6. Create `sw-precache-config.js`
338
344
339
-
In the root of your project create a file called [`sw-precache-config.js`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/sw-precache-config.js) with the following config:
345
+
In the root of your project create a file called [`sw-precache-config.js`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/sw-precache-config.js) with the following config:
340
346
341
347
```js
342
348
module.exports= {
@@ -350,6 +356,7 @@ module.exports = {
350
356
]
351
357
};
352
358
```
359
+
353
360
You can also add other items to the staticFileGlobs array such as:
In [`/package.json`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/angular-cli/package.json#L14) add the `static-serve` script:
383
+
In [`/package.json`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/angular-cli/package.json#L14) add the `static-serve` script:
377
384
378
385
```json
379
386
"scripts": {
@@ -405,4 +412,4 @@ At [localhost:4200](http://localhost:4200/) you should see your app running.
405
412
406
413
## Further help
407
414
408
-
To get more help on the `angular-cli` use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
415
+
To get more help on the `angular-cli` use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/two/README.md).
Copy file name to clipboardExpand all lines: examples/ionic/README.md
+13-4Lines changed: 13 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -2,6 +2,12 @@
2
2
3
3
How to create an app that loads Firebase data and static resources while offline.
4
4
5
+
## <spanstyle="color:red">Important</span>
6
+
7
+
### This is a legacy branch that supports AngularFire2 version 2.x
8
+
9
+
For the latest version of AngularFire2 Offline **switch to the [master branch](https://github.com/adriancarriger/angularfire2-offline/tree/master/examples/ionic#ionic-offline-tutorial-)**
@@ -11,6 +17,7 @@ How to create an app that loads Firebase data and static resources while offline
11
17
```bash
12
18
npm install -g cordova ionic
13
19
```
20
+
14
21
### 2. Create a new project
15
22
16
23
```bash
@@ -36,7 +43,7 @@ Now that you have a new project setup, install [AngularFire2Offline](https://www
36
43
37
44
### 5. Setup @NgModule
38
45
39
-
Open [`/src/app/app.module.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/ionic/src/app/app.module.ts), inject the Firebase providers, and specify your Firebase configuration.
46
+
Open [`/src/app/app.module.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/ionic/src/app/app.module.ts), inject the Firebase providers, and specify your Firebase configuration.
40
47
This can be found in your project at [the Firebase Console](https://console.firebase.google.com):
41
48
42
49
```ts
@@ -87,7 +94,7 @@ export class AppModule { }
87
94
88
95
### 6. Use in a component
89
96
90
-
In [`/src/pages/home/home.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/ionic/src/pages/home/home.ts):
97
+
In [`/src/pages/home/home.ts`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/ionic/src/pages/home/home.ts):
91
98
92
99
```ts
93
100
import { Component } from'@angular/core';
@@ -112,7 +119,8 @@ export class HomePage {
112
119
}
113
120
}
114
121
```
115
-
In [`/src/pages/home/home.html`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/ionic/src/pages/home/home.html):
122
+
123
+
In [`/src/pages/home/home.html`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/ionic/src/pages/home/home.html):
116
124
117
125
```html
118
126
<ion-header>
@@ -145,7 +153,7 @@ At this point everything should be working, including offline support for your F
145
153
146
154
### 1. Add a service worker
147
155
148
-
In [`/src/index.html`](https://github.com/adriancarriger/angularfire2-offline/blob/master/examples/ionic/src/index.html#L17-L23) find and uncomment the provided service worker script:
156
+
In [`/src/index.html`](https://github.com/adriancarriger/angularfire2-offline/blob/two/examples/ionic/src/index.html#L17-L23) find and uncomment the provided service worker script:
149
157
150
158
```html
151
159
<script>
@@ -162,6 +170,7 @@ In [`/src/index.html`](https://github.com/adriancarriger/angularfire2-offline/bl
162
170
```bash
163
171
ionic serve
164
172
```
173
+
165
174
At [localhost:8100](http://localhost:8100/) you should see your app running.
0 commit comments