Skip to content

Files

Latest commit

sohilpandyasohilpandya
end of day 2
Sep 7, 2016
9f3bc7f · Sep 7, 2016

History

History
82 lines (69 loc) · 2.4 KB

day-2.md

File metadata and controls

82 lines (69 loc) · 2.4 KB

Content for the Workshop - HERE

Day 2

09.00 am

Today is all about

  • Promises
  • fetch()
  • IndexedDB
  • Service Workers: caching, live data

Working with Promises

  • Why Promises?
    • Asynchronicity
    • Readability

Promise Lab

  • cd into the promise-lab and then run
 python -m SimpleHTTPServer 8000
  • or use Web Server for Chrome extension
  • Go to promise-lab README.md
  • Open progressive-web-app-ilt-codelabs.pdf and follow along 1.5
  • Please use incognito from the beginning

problem/solutions

  • exercise02.js line 61 needs to have a return in front of getCountryInfo() otherwise the function will return undefined.

Fetch API

  • modern replacement for XMLHTTPRequest
  • works well with PWA
  • Promise based
  • can be used with service workers
  • Supports Cross Origins Resource Sharing (CORS) OHH YEAHH!!!!

Impromptu Talk - Performance Talk

TIPS/HINTS
WebpageTest addy osmani critical https://csstriggers.com https://github.com/GoogleChrome/flipjs chrome://inspect/#devices - very useful port forwarding TIPS/HINTS

Fetch API Lab

  • cd into the fetch-api-lab and then run
 python -m SimpleHTTPServer 8000
  • or use Web Server for Chrome extension
  • Go to fetch-api-lab README.md
  • Open progressive-web-app-ilt-codelabs.pdf and follow along 1.6
  • Please use incognito from the beginning

problem/solutions

  • 7 Head Request add console.log(response.headers.get('Content-Type')); to readResponseAsText function to be able to view specifics within the header.
    • The reason response.headers does not return anything is because we are running on localhost and not sending any headers on here. duh..;.

Caching File with the service Workers (view presentation)

Cache API Lab

  • cd into the cache-api-lab and then run
 python -m SimpleHTTPServer 8000
  • or use Web Server for Chrome extension
  • Go to cache-api-lab README.md
  • Open progressive-web-app-ilt-codelabs.pdf and follow along 1.7
  • Please use incognito from the beginning

IndexedDB (view persentation)

Indexed DB Lab

  • cd into the indexed-db-lab and then run
 python -m SimpleHTTPServer 8000
  • or use Web Server for Chrome extension
  • Go to indexed-db-lab README.md
  • Open progressive-web-app-ilt-codelabs.pdf and follow along 1.7
  • Please use incognito from the beginning