The Web Platform Podcast

Nolan Lawson a PM at Microsoft Edge joins us today to talk about PouchDB a popular open source project he’s a maintainer of. PouchDB is an open-source JavaScript database inspired by Apache CouchDB that is designed to run well within the browser. In this episode we get into what PouchDB is good at and what type of projects would benefit from using PouchDB for their persistence layer (turns out, many!). PouchDB is framework agnostic but plays very well with many popular frameworks and libraries. Nolan gets into the performance of PouchDB and also what storage mechanisms it supports which include IndexedDB, WebSQL, LevelDB and many more. The episode takes a very unexpected turn leaving Justin, Danny and Leon wrapping up with some of their own PouchDB experiences. Resources https://pouchdb.com nolan lawson blog The cost of small modules IndexedDB, WebSQL, LocalStorage – what blocks the DOM? PouchDB custom builds PouchDB: a better build system with Rollup PouchDB map/reduce pouchdb-find PouchDB replication A

This week we are joined with special guests Jan Miksovsky and Rob Bearman from Component Kitchen to talk about their work on the Web Component Gold Standard. The Gold Standard is an open source project which outlines best practices for creating Web Components. The Gold Standard presents developers with a checklist they can use to ensure their Web Components are of exceptional high quality matching that of native elements. The episode goes into where the requirement for the Gold Standard came from and why it is such an invaluable resource for Web Component developers. This includes discussion on why code reuse on the web is so difficult and how Web Components and the Gold Standard can help. We also talk about the future of the Gold Standard and how the community can help make it even better. Resources Gold Standard: https://github.com/webcomponents/gold-standard/wiki Around the Web in Two Minutes Friday: webcomponents.js V1 polyfills got merged into master! https://github.com/webcomponents/webcomponentsjs

Tooling is an ever important topic in the world of web development. In this episode, Danny explains to Justin and Leon the upcoming features in Angular CLI, a tool that makes it easy to create an application that already works, right out of the box. Resources https://cli.angular.io/ https://github.com/angular/angular-cli https://github.com/angular/angular-cli/wiki   Panel Danny Blue (@dee_bloo) Leon Revill (@RevillWeb) Justin Ribeiro (@justinribeiro)    

Web Components Remote Conference is a two day conference all about Web Components. Kito Mann (@kito99) will be delivering a very interesting talk “Beautiful Web Apps with Polymer and TypeScript”. This episode covers why Web Components are important, what challenges people face and some very interesting use cases for Web Components you probably never thought of. Resources https://github.com/Draccoz/twc (newer) http://www.typescriptlang.org/ http://virtua.tech http://knowesis.io/web/webcomponents https://github.com/google/uniflow-polymer https://github.com/Polymer/polymer/tree/2.0-typescript https://github.com/nippur72/PolymerTS (what Kito has been using) Web Components Remote Conference - https://wcremoteconf.com/ Guests Kito Mann (@kito99) Panel Danny Blue (@dee_bloo) Amal Hussein () Justin Ribeiro (@justinribeiro)    

Web Components Remote Conference is a two day conference all about Web Components. Jordan Last (@lastmjs) will be delivering a very interesting talk “Universal Web Components” which takes the idea of Web Components for GUIs, throws it out the window and then uses Web Components to control a drone instead! With the Custom Elements and Shadow DOM specifications settled on V1 and greater browser support than ever now is the perfect time to be investing in Web Components. This episode covers why Web Components are important, what challenges people face and some very interesting use cases for Web Components you probably never thought of. Resources Jsdom - https://github.com/tmpvar/jsdom AFrame - https://aframe.io/ Web Components Remote Conference - https://wcremoteconf.com/ Guests Jordan Last (@lastmjs) Panel Danny Blue (@dee_bloo) Leon Revill (@RevillWeb) Justin Ribeiro (@justinribeiro)    

Static Web Applications have evolved quite a bit over the past few years. They are now longer just a flat file with scripts added. Now they are fully functional application stacks. This might sound strange to some but the truth is out there. Listen to Brian Douglas (@BdougieYo) from Netlify chat about their structure and vision for Static Apps known as JAMStack. Resources JAMStack - https://jamstack.org/ https://www.quora.com/What-is-the-concept-behind-JAMstack https://vimeo.com/163522126 Static site CMS - https://snipcart.com/blog/jamstack-clients-static-site-cms Netlify - https://www.netlify.com/ Prerender.io - https://prerender.io/ Top Static Generators - http://www.staticgen.com/ JAMStack Radio - Launch Darkly - https://launchdarkly.com/ GItShifter.io - DraftJS - https://facebook.github.io/draft-js/ JAM Stack Radio - https://www.heavybit.com/library/podcasts/jamstack-radio/ep-5-graphql-at-github/ Guests Brian Douglas (@bdougieYO) Panel Amal Hussein (@nomadtechie) Erik Isaksen (@eisaksen)

WebComponents.org have long been a great resource for learning and understanding web components. Recently, Google along with several other developers have worked hard to make the site a place not only to consume information on web components, but to share your own components as well consume others. Resources WebComponents - https://webcomponents.org Web Components Remote Conference - https://wcremoteconf.com Guests Taylor Savage (@TaylorTheSavage) Sam Li (@samdotli) Panel Danny Blue (@dee_bloo) Leon Revill (@RevillWeb)

Justin Searls chats with us on testing Asynchronous JavaScript as well as best practices for Continuous Integration, Unit testing vs. Integration testing, and tools we can use to help us understand how to test code. Resources Test Double - https://testdouble.com Talks & articles by Justin: http://blog.testdouble.com/posts/2016-06-05-happier-tdd-with-testdouble-js.html http://blog.testdouble.com/posts/2015-11-16-how-to-stop-hating-your-tests.html http://blog.testdouble.com/posts/2016-09-16-surgical-refactors-with-suture.html http://blog.testdouble.com/posts/2016-12-01-a-creativity-talk.html Justin on JSJ - https://devchat.tv/js-jabber/226-jsj-test-doubles-with-justin-searls Supertest - https://github.com/visionmedia/supertest Pretender - https://github.com/pretenderjs/pretender Sinon - http://sinonjs.org/ Testim - https://www.testim.io/ Cabybara - http://teamcapybara.github.io/capybara/ TestDouble's alternative to Sinon - http://blog.testdouble.com/posts/2016-03-13-testdouble-vs-sinon.html Testem

Danny, Erik, & Mark discuss their experiences and current challenges in testing code across their applications and services. Resources Panic - https://github.com/gundb/panic-server Aphyr, Kyle Kingsbury, testing network partitions - https://aphyr.com/posts/281-call-me-maybe-carly-rae-jepsen-and-the-perils-of-network-partitions Lighthouse Github - https://github.com/GoogleChrome/lighthouse Chrome Plugin - https://chrome.google.com/webstore/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk?hl=en Jeff Posnick at PWA Conference - https://developers.google.com/web/shows/pwa-devsummit/amsterdam-2016/to-the-lighthouse-progressive-web-app-summit-2016 Benchmarkjs - https://benchmarkjs.com/ Mocha - https://mochajs.org/ Tape - https://github.com/substack/tape Qunit - https://qunitjs.com/ Jasmine - https://jasmine.github.io/ Sinon - http://sinonjs.org/ Enzyme - https://github.com/airbnb/enzyme Chai - http://chaijs.com/ Selenium - http://www.seleniumhq.org/projects/webdriver/ PTSD (tech talk) - https://youtu.

Corey Speisman (@cdspeis) & Ben Wilson (@benwilson512) talk with the panel about the Facebook API Query Language known as GraphQL and it’s various implementations including the FOSS Github project - Absinthe. Resources GraphQL - http://graphql.org/ Github API - https://developer.github.com/early-access/graphql/ Draft RFC Specification - https://facebook.github.io/graphql/ Using Node.js & GraphQL - https://blog.risingstack.com/graphql-overview-getting-started-with-graphql-and-nodejs/ Learn GraphQL - https://learngraphql.com/ JamStack Radio Podcast - https://www.heavybit.com/library/podcasts/jamstack-radio/ep-5-graphql-at-github/ Reactive GraphQL - http://info.meteor.com/blog/reactive-graphql Absinthe GraphQL - http://absinthe-graphql.org/ Facebook GraphQL Github - https://github.com/graphql Contentful - https://www.contentful.com Jsonapi - http://jsonapi.org/ ExCheck -  https://github.com/parroty/excheck Graph IQL - https://github.com/graphql/graphiql GraphQL Swapi - http://graphql-swapi.parseapp.co

Vivaldi is a new browser that focuses on user customization and experience. In this episode, designer Atle Mo (@subtlepattern) and developer / designer Henrik Helmers (@helmers) chat with us about what this might mean for web developers and what technologies Vivaldi leverages to achieve its approach to be “Feature rich, powerful, secure and fun” . Resources Vivaldi - https://vivaldi.com/ Vivaldi Forum - https://forum.vivaldi.net/ Submit Vivaldi Bugs - https://vivaldi.com/bugreport/ Vivaldi on Reddit - https://www.reddit.com/r/vivaldibrowser/ Guests Atle Mo (@subtlepattern) Henrik Helmers (@helmers) Panel Justin Ribeiro (@justinribeiro) Erik Isaksen (@eisaksen) 

Chris Coyier (@chriscoyier) returns to the show to chat about his most recent publication ‘Practical SVG’. Chris walks us through the ins and outs of working with SVG (Scalable Vector Graphics). Chris is most known for on the web for masterminding codepen.io (an in-browser social code application), creating & maintaining css-tricks.com, and podcasting on ShopTalk Show & CodePen Radio. Resources Practical SVG - https://abookapart.com/products/practical-svg About the Practical SVG book - https://css-tricks.com/wrote-book-practical-svg/ ShopTalk Show - http://shoptalkshow.com/ CodePen Radio - https://blog.codepen.io/radio/ CodePen - http://codepen.io/ The Web Platform Podcast 27 - http://thewebplatformpodcast.com/27-building-codepen The Web Platform Podcast 58 - http://thewebplatformpodcast.com/58-scalable-vector-graphics GruntIcon - https://github.com/filamentgroup/grunticon IcoMoon - https://icomoon.io/ SVGO - https://github.com/svg/svgo SVG Reference Cheat Sheet - https://developer.mozilla.org/en

Cornel Stefanache (@_cstefanache, @isMonkeyUser) talks about Monkeyuser.com,, laughter, and finding happiness at work & home. Resources Monkeyuser - http://www.monkeyuser.com/ Xkcd - http://xkcd.com/ What If? (Randall Munroe) - http://what-if.xkcd.com/ ReadTheSource (RTS) - https://www.youtube.com/readthesource

Erik Isaksen(@eisaksen) & Mark Nadal (@marknadal) talk about trends in web development as an industry. They discuss technology communities and how they got involved. Mark grills Erik on how technology has changed over the years & what patterns he’s seen across his career. Mark predicts the future of web technology…machine learning on AST’s. Do not resist, the future is already written. Resources Web Components Remote Conf - https://wcremoteconf.com GunDB - http://gun.js.org/ Brett Victor - http://worrydream.com/ Non Zero - https://en.wikipedia.org/wiki/Nonzero:_The_Logic_of_Human_Destiny Esprima AST visualizer - http://resources.jointjs.com/demos/javascript-ast

Tal Ater (@TalAter), creator of Annyang, a powerful speech recognition library for the web, has now created UpUp, an Offline First library using the power of Service Workers.  UpUp is an incredible asset for web developers wanting to build Progressive Web Applications (PWA’s) Resources UpUp - https://www.talater.com/upup/ UpUp (Github) - https://github.com/TalAter/UpUp Are Service Workers Ready? - https://jakearchibald.github.io/isserviceworkerready/ Offline First Slack Channel  - http://offlinefirst.org/chat/ Tal’s new book - https://pwabook.com cache.adderall(⚡) - https://www.talater.com/adderall/ The Changelog 183 : The Offline First Revolution and Speech Recognition with Tal Ater - https://changelog.com/podcast/183 Jeremy Keith’s Service Worker link collection - https://adactio.com/links/tags/serviceworkers

A summary of the second Polymer Summit, a two day Web Component conference focused on Polymer. Chris Lorenzo (@chiefcll) & John Riviello (@johnriv), spoke on day 2 of the Summit on Comcast’s Polymer experiences. They share their thoughts with us on the event and much more. Resources The Polymer Summit 2016 - https://www.polymer-project.org/summit Talks - https://www.polymer-project.org/summit/schedule Codelabs - https://codelabs.developers.google.com/polymer-summit-2016 Polymer in Practice at Comcast w/ Chris & John - https://www.youtube.com/watch?v=dZo7Tqr2lqI&list=PLNYkxOF6rcICc687SxHQRuo9TVNOJelSZ&index=29 John’s Lynda.com course - https://www.lynda.com/CSS-tutorials/CSS-Sass-Converting-Existing-Site/434463-2.html

Jeremy Keith (@adactio), web guru & co-founder of ClearLeft, talks with us about the potential pitfalls and hopes on Progressive Enhancement with Web Components. Resources Extensible Web Components (2016) - https://adactio.com/journal/11052 Responsible Web Components (2014) - https://adactio.com/journal/7967 Adam Onishi’s article - http://adamonishi.com/2016/08/web-components-and-progressive-enhancement/ Eric Bidelman on Web Components in PWA (specifically on JavaScript class extension as Progressive Enhancement) - https://www.youtube.com/watch?v=pBCDdeqzUlY&feature=youtu.be&t=6m34s Polymer Shop Demo - https://shop.polymer-project.org/ Polymon - https://polymon.polymer-project.org/ Gold Standard - https://github.com/webcomponents/gold-standard/wiki The Extensible Web Manifesto - https://extensiblewebmanifesto.org/ Alex Russell’s response to Keith - https://infrequently.org/2014/09/uncomfortably-excited/ Sturgeon’s Law - https://en.wikipedia.org/wiki/Sturgeon%27s_law Soledad’s Lightning Talk -

Paul Bakaus (@pbakaus), Google Engineer, has recently been leading the AMP Project which is an open source initiative to optimize content for mobile devices using the web. AMP is heavily supported by several global news & media groups and has the SEO community in an uproar. Paul takes us through the core concepts of project and the reasoning behind it. Additionally, AMP leverages many newer technologies such as Service Workers, ES2015, and Custom Elements (One of the four Web Component pillars) making it an exciting project for developers to contribute to. Resources AMP by example - https://ampbyexample.com/ How does it work? - https://www.ampproject.org/learn/how-amp-works/ AMP on Github - https://github.com/ampproject AMP HTML - https://github.com/ampproject/amphtml Creating your first AMP page - https://www.ampproject.org/docs/get_started/create.html AMP Validator General info - https://github.com/ampproject/amphtml/blob/master/validator/README.md Guide - https://www.ampproject.org/docs/guides/val

Summary Harry Roberts (@CSSWizardry) talks with us about scaling CSS in code and across large teams. We also discuss the CSS in the Web Platform standards, the history of CSS, refactoring code, as well as projects like Houdini which aims ‘to jointly develop features that explain the “magic” of Styling and Layout on the web.’ Resources Harry’s website - http://csswizardry.com/ Github - https://github.com/csswizardry The 3 I’s of refactoring - http://csswizardry.com/2016/08/refactoring-css-the-three-i-s/ Mixins better for performance - http://csswizardry.com/2016/02/mixins-better-for-performance/ Houdini W3C Drafts Wiki  - https://github.com/w3c/css-houdini-drafts/wiki What is Houdini? - https://www.smashingmagazine.com/2016/03/houdini-maybe-the-most-exciting-development-in-css-youve-never-heard-of/ Jen Simmons on Feature Queries in CSS - https://hacks.mozilla.org/2016/08/using-feature-queries-in-css/ CSS Triggers - https://csstriggers.com/ The languages that were almost CSS - https://eager.io/blog/the-la

Summary It’s been awhile since we have chatted about Elm Lang. Richard Feldman (@rtfeldman), Developer at No Red Ink, returns to the podcast with Conner Ruhl (@connerruhl), Developer Operations at Carfax, in his podcast debut. The two Elm fanatics chat about their experiences with Elm and how it’s made their productivity exponentially better. Resources Elm - http://elm-lang.org/ Richards Github - https://github.com/rtfeldman Elm in Action - https://www.manning.com/books/elm-in-action?a_aid=elm_in_action&a_bid=b15edc5c JSAir: Typed Functional Programming in JS - http://audio.javascriptair.com/e/034-jsair-typed-functional-programming-in-javascript-with-alfonso-garcia-caro-richard-feldman-phil-freeman-and-jordan-walke/ JSJ 175: https://devchat.tv/js-jabber/175-jsj-elm-with-evan-czaplicki-and-richard-feldman JSJ 229: https://devchat.tv/js-jabber/229-jsj-elm-with-richard-feldman