Travel feeds

  • View
    392

  • Download
    0

Embed Size (px)

Text of Travel feeds

Travel FeedsCurating RSS Feeds with AngularJS & FirebaseYet Another Feed Reader!It all started with a novel AngularJS RSS feed reader bydavidandsuzi.com - thanks, David Chang!With Travel Feeds, I took this application furthertowards multiple feedsadding Firebase as a persistence layerng-app.de/travel-feeds/by Eckard Ritter, eckard.ritter@googlemail.com

Aggregating Multiple FeedsModel: [{feed},{feed2},...]Feed JSON:{id: my_feed, url: http//:...title: Title of My Feed}

Organizing Feed SourcesTag Lists:

Feed Selection and SearchAngularJS makes it simple:Selecting a feed: ng-clickSearching a selected feed: simple AngularJS data bindingHow to save these 100+ feeds?Server? Ok.

Client only?

(100+ RSS sources = 500+ items!)

Firebase vs. Server SideData storage: no server side programming, just static hosting (no application server needed)Searching a specific feed: instant search easier with AngularJS+Firebase, no AJAX Search across all feeds: instant search plus instant update much easierUser interaction: extremely simple with Simple Login (Facebook, Google )Firebase Data Storage

AngularJS & Firebase Instant Search

Full Text Search Across All FeedsJust add these few lines this 1 line of code ...

and search full text across all feeds.Amazing!AngularJS & Firebase goodnesses combined.

Adding Content for Full Text SearchFeed content is written to its JSON object:

Updating Full Text Search ItemsMethod: update sources..searchif user is logged inwhenever a new feed is selectedclick on a new feed for parsing and display fires update of Firebase with the previous feed!

Firebase Simple LoginFirebase Simple Login is a library that allows authentication using only client-side code. Easily authenticate users via email and password or through a number of third-party providers such as Facebook, Twitter, GitHub, and Google.

Security Rules

Simple Login Settings

Simple Login Integration

Monitoring AuthenticationWriting to sources in our Firebase requires Facebook login.

Full text update on selecting a new feed takes only place with logged-in users

ResourcesSlides for JSFest, as of September 9, 2014:http://goo.gl/M64McHTravel Feeds: ng-app.de/travel-feeds/Links to related resources: ng-app.deAs an ng-app: ng-app.de/apps/travel-feeds/Last, not least: firebase.com/docs/