Angular Air

Latest Episodes:

63 ngAir- How Service Workers Will Change The Way You Think About Web Apps Apr 21, 2016

Show notes

How Service Workers will change the way you think about web apps Panelists: Ari Lerner, Olivier Combe, Gleb Bahmatov Guests: Minko GechevShow notes: What Gleb and Minko have been up to lately What is Service Worker? Any relation to Web Worker?Are there other types of workers? Do they all rest on Sundays? Differences with appCache What is the current browsers support? Can you use polyfills? How can they be used? You can find how existing websites use them right now by opening chrome://serviceworker-internals/and clicking on script urls Smartcache and offline support Image or video transcodingon the fly Background data sync andpush messages Instant application restartfrom last known HTML (bottle-service) Transpiling code(babel-service) Even running server-sideJavaScript server in the browser (express-service) What are Progressive Web Apps? angular/progressive What will mobile look like in 5 years when serviceworkers are fully supported? When should we use service workers? When shouldn’t we use service workers?Tips &Picks Minko Gechev https://github.com/angular/progressive https://github.com/ngrx https://www.packtpub.com/web-development/switching-angular-2 Gleb Bahmutov The status of ServiceWorkers api implementation indifferent browsers: https://jakearchibald.github.io/isserviceworkerready/ Mozilla’s book of service workers demos and features https://serviceworke.rs/ WebWorkers + ServiceWorkers presentation video https://youtu.be/4axZ3D75Llg Olivier Combe Mix It: https://www.mix-it.fr/ Ng conf planning looks awesome o/ --- Support this podcast: https://podcasters.spotify.com/pod/show/angularair/support

62 ngAir - Using Web Workers for High Performance Angular 2 Web App Apr 13, 2016

Show notes

Using Web Workers for High Performance Angular 2 Web Apps Panelists: Olivier Combe, PatrickJS, Dmitry Guest: Jason Teplitz Who are you? What are web workers? What is the support level in different browsers? Web worker polyfills? What types of tasks in general are web workers good for? How will web workers be integrated into Angular 2? Do you think that we will get to a point where a majority of your app is run in web workers by default? How can you make your code work when you use third party libraries not meant for that? How web workers handle internal file imports, and loading additional files possible with system.js? (currently it is loading additional files several times, and this slowdowns application start time, sample: check network tab here: http://www.syntaxsuccess.com/angular-2-samples/components/web-workers/web-worker-demo.html ) Will it improve or should we bundle web workers code? What are the downsides of using web workers? Web workers are bringing real multithread concurrency with performance gains and know for C++Java mental overheads? What JS devs should knew about it (patterns, access to shared resources) Message queue like patterns or approaches? What is web workers restrictions? (working with DOM, etc.) Cool implementations of using web workers... What is the best way to use web workers with Angular 1? How does this work on the server side with node.js? How was your experience as a junior working with the Angular Team? Tips & Picks Jeff Whelpley Ng-conf schedule https://www.ng-conf.org/#/schedule Tony Robbins Ted Talk “Why We Do What We Do” https://youtu.be/Cpc-t-Uwv1I Olivier 5 things Angular http://5thingsangular.github.io/ Ui router for ng2 https://github.com/angular-ui/ui-router Dmitry https://github.com/angular/angular-electron https://www.npmjs.com/package/webworker-threads http://www.syntaxsuccess.com/angular-2-samples/components/web-workers/web-worker-demo.html Jason Rust https://www.rust-lang.org/ --- Support this podcast: https://podcasters.spotify.com/pod/show/angularair/support

60 ngAir- Angular Universal Mar 31, 2016

Show notes

Angular Universal Intros for new people History: Jeff’s story with GetHuman, Jeff and Patrick join forces, Getting Universal project going Why Server Rendering? SEO Performance Browser support Preview (i.e. Facebook, etc.) Cache Why Universal? Why not just use service workers? 2 modes of server rendering Can you use it to generate static websites? (Olivier) Pre-rendering vs re-rendering Diff between “universal” and “server rendering” Abstracting out your environment How does it work? (not preboot) Angular 2 Core Rendering Engine (NativeScript, WebWorker, etc.) Universal bootstrap process Preboot What is left before release? Production-ready Documentation Critical 3rd party services Multi-app support Performance Future Non-node.js back ends Crazy caching Partial page rendering and streaming Ng-conf 20 minutes Focused on patterns (i.e. how to deal with common challenges when building universal app) Tips & Picks PatrickJS Ng-Conf ng-conf.com AngularConnect angularconnect.com Jeff Whelpley Original design doc - https://docs.google.com/document/d/1q6g9UlmEZDXgrkY88AJZ6MUrUxcnwhBGS0EXbVlYicY/edit#heading=h.19ijfd7mxdt4 GetHuman - https://gethuman.com Wassim Patrick video readthesource universal - https://www.youtube.com/watch?v=qOjtFjXoebY Ari Fullstackreact.com (product plug) http://www.serverless.com (‘cause it’s cool) Olivier Ui router 1.0.0 alpha 1 All my libs are “unpublish” proof --- Support this podcast: https://podcasters.spotify.com/pod/show/angularair/support

59 ngAir - Angular 2 testing using Protractor 2C Karma and more with Julie Ralph Mar 25, 2016

Show notes

Angular 2 testing using Protractor, Karma and more withJulie Ralph Panelists: PatrickJS, Ed Conolly Guests: Julie RalphOutline Background Testing landscape Firstquestion...Jasmine or Mocha? j/k Seriously, though, give us a layout of the testinglandscape. What are the major tools/libraries involved in testing an Angular 2web app? When do you use Karma vs Protractor How has the landscape evolved over theyears? What is new with the latest Karma and Protractor? New world of JavaScript How doyou deal with the build process and testing? Webpackor System offer advantages for testing? Are thereare special features in Karma or Protractor for Angular 2? Testing as a discipline How doyou get developers to actually write tests? Why don’tdevelopers write tests? How doyou maintain discipline over time? Generalguidelines for testing to follow? Anythoughts or experiences with BDD / CucumberJS and protractor? Testing strategy When doyou use unit tests vs integration tests vs e2e (and server vs browser) MockedAPIs vs Real APIs, should my protractor tests really be e2e? Other frameworks What doyou think of AVA? https://github.com/sindresorhus/ava Future What doesthe future hold for testing?Tips & Picks PatrickJS Zone.js0.6.x https://github.com/angular/zone.js/ How toTest RxJS http://staltz.com/how-to-debug-rxjs-code.html Chaos Monkey http://techblog.netflix.com/2012/07/chaos-monkey-released-into-wild.html Gremlins.jshttps://github.com/marmelab/gremlins.js Jeff Whelpley StraightOutta Compton With latest TypeScript, you may not need Webpack https://medium.com/@vivainio/with-latest-typescript-you-may-not-need-webpack-417d2ef0e773#.2z0xbjndi Ng2 testseed https://github.com/juliemr/ng2-test-seed Web Workers and Service Works by Gleb https://www.youtube.com/watch?v=4axZ3D75Llg&list=UU_DH6Z_K_3JRgOdDnwHLrLw Ed Instanttest feedback in your IDE - http://wallabyjs.com/ ConfigurableAPI responses - https://github.com/wongatech/angular-multimocks AngularConnectScholarships / CFP Julie Angularmaterial is alpha: https://github.com/angular/material2 Niftyproject website from Seattle Times: http://projects.seattletimes.com/2016/elwha/ Juliepromises to update ng2-test-seed today :) --- Support this podcast: https://podcasters.spotify.com/pod/show/angularair/support

58 ngAir - Using React Native With Angular 2 Mar 17, 2016

Show notes

Using React Native with Angular 2 Panelists:Ari Lerner, Michael Cox Guests:Mark Laval#main-content Whoare you? Whatmotivated you to create this project? Howdoes it work? Whereis the line between ReactNative and Angular 2? Howmuch code can you re-use with other Angular 2 apps? Areyou able to leverage all the ReactNative tooling? Arethere any advantages to using this solution over: ReactNativewith React NativeScriptwith Angular 2 Hybridapps Nativeapps Whatdo you think about Angular 2? Arethere any patterns in Angular 2 that are well suited to React Native (ex.Redux, reactive, etc.) Hasanyone else started using your project yet? Whatissues have you or do you see with your approach? Whatadvice would you give someone who wants to get started working with RN andAngular 2? Whatdoes the future hold? Links: https://github.com/angular/react-native-renderer https://github.com/mlaval/poc-angular-react-nativeTips &Picks AriLerner Fullstackreact.com JeffWhelpley AngularSurvey https://angular.io/survey ChangeDetection Explained https://www.youtube.com/watch?v=CUxD91DWkGM MichaelCox NodeDash Button https://github.com/hortinstein/node-dash-button RealmFor React Native https://realm.io/docs/react-native/latest/ MarcLaval POCof React Native with Angular 2 https://github.com/mlaval/poc-angular-react-native ReactNative Scheduling by Andy Street: https://www.facebook.com/notes/andy-street/react-native-scheduling/10153916310914590 --- Support this podcast: https://podcasters.spotify.com/pod/show/angularair/support

57 ngAir - Why Ionic 2 Is Going To Rock Your World Mar 10, 2016

Show notes

Why Ionic 2 is going to rock your world Panelists: Olivier Combe, PatrickJS, Josh Moont (fromAngularConnect) Guests: Adam Bradley, Brandy Carney, Tim Lancina, Mike Hartington#main-content Intro Ionic 2 Beta How is it going? Any numbers you can give us for adoption rates so far? https://www.npmjs.com/package/ionic-angular Just switched from ionic-framework npm to ionic-angular https://www.npmjs.com/package/ionic Any notable apps published with Ionic 2? Navigation Create own router How does it work on the web? Work with deep linking? Work with UI Router or Component Router in the future? Jeff note: mention working with universal Cool stuff Ionic team has been working on: Ionic Creator Started off with subset of functionality. How has it gottenbetter over the past 4 months? Works much better Cleaned up a lot of bugs Added more components and customizations Way better now than 4 months ago and more polished,stabilized Who is the target audience for this? Two target, drastically different Developers to speed up boilerplate code dev and focus oncoding hard stuff Designers/Marketers: Starting up an app to create aclickable prototype to hand off to devs In the future, can you create simple apps and publishwithout opening an editor? Ionic Playground Really awesome, but when will it be available for 2.0? Recent changes and Roadmap Agnosticism Initiative Why change name of package from ionic-framework toionic-angular? Will there bean ionic-react? Have you looked at Touchstone? Angular 1 bindings? How does Web Workers and Serverside Rendering fit in? Why change webpack to browserify? Has build complexity with webpack caused problems? What other types of issues have people run into? Ionic Market - brandy How is the adoption? Over 70k unique sessions/mo Ionic View - Tim What is the diff with TestFlight? Do you plan on supporting Windows Phone? What is the status of CodePush-like deployments? How does that work? Will Apple potentially crack down on this eventually? Themes / SASS Sweet spot for Ionic apps? Apps that require heavy use of the camera? Memory intensive apps? How do you compare yourself with NativeScript? (Olivier) Tips& Picks Jeff Whelpley (not a troll FYI, lots of Ionic love in this podcast) ReactNative Radio episode 6 - React Native vs Hybrid https://devchat.tv/react-native-radio/06-developing-with-react-native-vs-hybrid Josh Moont AngularConnect - just announced our workshops including anIonic workshop with Sani Yusuf called Building Mobile Apps With Ionic 2 - see www.angularconnect.comfor more info Olivier Combe Upgrading Your Application to Angular 2 with ng-upgrade: http://blog.rangle.io/upgrade-your-application-to-angular-2-with-ng-upgrade/ Universal Windows App + Angular 2 : https://github.com/preboot/angular2-universal-windows-app Angular 2 RC milestone: https://github.com/angular/angular/milestones Brandy Windows phone support https://github.com/driftyco/ionic/blob/2.0/CHANGELOG.md#windows-mode Mike ionicworldwide.herokuapp.com Adam Help contribute to Ionic Timionic-native --- Support this podcast: https://podcasters.spotify.com/pod/show/angularair/support

56 ngAir - Is NativeScript The Holy Grail For Mobile Development? Mar 02, 2016

Show notes

Is NativeScript the holy grail for mobile development? Sponsors: Auth0, Thoughtram Panel: Olivier Combe, Nathan Walker, Ari Lerner Guest: TJ VanToll, Jen Looper#main-content Intros What is NativeScript? What problem is it trying to solve? What makes NativeScript unique? Accessing all APIs through JavaScript How does NativeScript integrate with Angular 2? Discuss setting up a cookbook for {N} + ng2 similar to whatangular team recently published: https://angular.io/docs/ts/latest/cookbook/ Any story of sharing code between the web and mobile? NativeScript for the Web https://github.com/NativeScript/NativeScript/issues/1612 Comparisons NativeScript vs Ionic? Can you turn an Ionic app into a NativeScript app? NativeScript vs React Native How does it differ from something like fusetools.com orflutter.io? What does the future hold? (Angular 🤘) How does Telerik make money? (Telerik Platform,NativeScript UI) Tips& Picks Olivier NG NL 2016 - A speaker’s point of view: http://blog.holimetrix.com/2016/03/01/ng-nl-2016-a-speakers-point-of-view/ Angular 2 unit testing recipes - by Gerard Sans: https://medium.com/google-developer-experts/angular-2-unit-testing-with-jasmine-defe20421584#.20pxvy13m Nathan Walker [Bleeding edge master branches from each {N} project](http://nativescript.rocks/) [{N} plugins](http://plugins.nativescript.rocks/) [nativescript-angular](https://github.com/NativeScript/nativescript-angular) [nativescript-ezaudio - low-latency audio processing, trythe demo, good example of {N} performance](https://github.com/NathanWalker/nativescript-ezaudio) [The War on Drugs iTunes](https://itunes.apple.com/us/album/lost-in-the-dream/id765568650) [The War on Drugs Spotify](https://player.spotify.com/album/14xxjLlbGy8ACm4MorBjD5) [City and Colour on iTunes]: (https://itunes.apple.com/us/artist/city-and-colour/id81842534) [City and Colour on Spotify](https://player.spotify.com/artist/74gcBzlQza1bSfob90yRhR) Jeff Whelpley [John Oliver on Donald Drumpf](https://www.youtube.com/watch?v=DnpO_RTSNmQ) [Angular 1 to 2 cookbooks](https://angular.io/docs/ts/latest/cookbook/a1-a2-quick-reference.html) TJ VanToll [The 5th Wave](http://www.amazon.com/5th-Wave-First-Book/dp/0142425834/) [FiveThirtyEight Elections Podcast](https://itunes.apple.com/us/podcast/fivethirtyeight-elections/id1077418457?mt=2) Jen Looper Plugins for all the things! http://plugins.telerik.com(hybrid mobile and NativeScript) My game crush right now: https://itunes.apple.com/us/app/neko-atsume-kitty-collector/id923917775?mt=8 Shotbot for managing iOS screenshots: http://shotbot.io/by the same folks who did makeappicon.com Productivity tools: Wunderlist and https://keep.google.com/u/0/for notes --- Support this podcast: https://podcasters.spotify.com/pod/show/angularair/support

55 ngAir - Full-stack Reactive Programming Using Angular 2 Meteor Feb 25, 2016

Show notes

Full-stack Reactive Programming using Angular 2 + Meteor Panelists: Dmitriy Shekhovtsov Guest: Uri Goldshtein#main-content● Intro ○ Who is Uri? ○ What is Meteor? ● Meteor view layer ○ Will Blaze eventually go away in favor of React andAngular? ○ Is React or Angular getting more traction in the Meteorcommunity? ○ What about Angular makes it a good fit as a view layerfor Meteor? ● Server rendering ○ How does server rendering work with Angular 1 Meteor? ○ Have you looked into integrating Angular Universal? ● What is the Future of Meteor? ● How does Angular Meteor compare to: ○ Firebase ○ RelayWrap Up● Upcoming shows: ○ March 1st - NativeScript ○ March 8th - Ionic 2 ○ March 15th - React NativeTips & Picks ● Dmitri ○ http://neo4j.com/blog/open-cypher-sql-for-graphs/ ● Jeff Whelpley ○ new sponsors: Auth0 and Thoughtram ○ AngularConnect.com ● Uri ○ GraphQL http://info.meteor.com/blog/reactive-graphql ○ Guthrie Govan https://www.youtube.com/watch?v=aA8fzsE7tWU ○ Bags http://www.coteetciel.com/en-IL/isar-backpack-raw-canvas-icelandic-ash-laptop-bag --- Support this podcast: https://podcasters.spotify.com/pod/show/angularair/support

53 ngAir - Angular 2 Reactive Redux with Victor Savkin and Dan Abramov Feb 12, 2016

Show notes

53 ngAir - Angular 2 Reactive Redux with Victor Savkin and Dan Abramov What is state? Is there a difference between UI state and persisted state? What problems do people run into with state? Why is it hard to manage state? How to keep the state on the client in sync with the state on the server? What are the popular patterns for managing state? What is used in Angular 1? Difference between the core ideas and implementations What does unidirectional mean? What is Redux? Benefits of redux and similar patterns Is redux for sync state updates only and is making an HTTP request considered a non-pure inside a reducer function? What is ngrx? How is the reactive version of redux different than traditional Redux? What are your feelings on setting change detection strategy to OnPush? How would one go about debugging the state changes in Angular2? Other general questions Thoughts on cycle.js? There is a pattern in Redux if you have the same object in multiple places, you use _id in everything but one. How would this work with ngrx or another reactive approach? (custom pipe and helpers?) Rob/Victor: I was starting to think about an Angular 2 decorator that does something similar to the React Redux connect() function but then Rob said it was a bad idea because it will mess with precompilation. What is the deal? Predictions for the future What approach will Angular 2 developers adopt? Will a reactive version of redux gain any traction in the React world? Tips & Picks Jeff Whelpley Links: Tips: Picks: Our new sponsor, [Auth0](https://auth0.com/) Victor Savkin Links: [Managing State in Angular 2 Apps.] ( http://victorsavkin.com/post/137821436516/managing-state-in- angular-2-applications) Tips: AceJump a great plugin for WebStorm. Picks: Kurt Vonnegut "Mother Night", Brad Mehldau "10 Years Solo Live", Woody Allen "Manhattan Murder Mystery" Gleb Bahmutov Links: [Rob Warmald’s talks] (http://www.roblog.io/angular2/talks/2015/11/29/angular2-data-talks.html) - Angular 2 data flow with nice examples Tips: Everything in your application could be a source of events: button clicks, mouse movements, messages from the server, timer, etc. Dan Abramov Tips: No boilerplates Picks: [Redux Saga](https://github.com/yelouafi/redux-saga) [aphrodite](https://github.com/Khan/aphrodite) Patrick Stapleton Picks: [What’s new in Webpack 2] (https://gist.github.com/sokra/27b24881210b56bbaff7) Angular Air is a video podcast all about Angular hosted by Jeff Whelpley. Please visit the Angular Air website (http://angularair.com) to see upcoming and past episodes. Also be sure to follow Angular Air on Twitter and Google+ to stay up to date with future episodes. Also, all episodes are on the YouTube channel as well. AngularClass Learn AngularJS, Angular 2, and Modern Web Development form the best. Looking for corporate Angular training, want to host us, or Angular consulting? twitter: @AngularClass email: info@angularclass.com chat: Join AngularClass Chat --- Support this podcast: https://podcasters.spotify.com/pod/show/angularair/support

52 ngAir - The Internet of Things (and Angular) Feb 12, 2016

Show notes

IoT Hangout URL: https://hangouts.google.com/call/hlfajots7uwohxjlpphdk7pkrua First 5-10 mins Intros Guests: Zach Dunn, Atticus White Panelists: PatrickJS, Gleb Bahmutov, Ari Lerner Announcements Upcoming shows: Thursday November 11th - Angular 2 Reactive Redux with Victor Savkin, Dan Abramov and Rob Wormald #topics Intro What is IoT? Atticus: The “Things” in Internet of Things Smart devices (“dumb” hardware embedded with “smart” electronics, ie: Hue Lights) Information providing devices (sensors, ie: motion sensor) Service that ties it all together Atticus: How IoT fits into the JS ecosystem. A comparison of the event driven characteristics found in both Javascript and the IoT environment. IoT support in the open source community. Zach: How we think about IoT application development: Personify rooms and devices, enable them to answer questions. Environment data (i.e. sensors, occupants) result in frequent I/O for apps. Lot of states to track. Atticus: Some IoT labs worked on Grocery list automation: Barcode scanner + rPi + Node Motion sensor night light: Motion sensor + Arduino + rPi + Node + Hue lights How do you decide on what to build next? How do you guys use Angular? Zach: Highly task/location-centric apps running on dedicated devices. Interesting side effect is more freedom to use new DOM safely. IoT and security IoT allows access to sometimes devices inside our homes and businesses. Adding more libraries and frameworks on top adds to the security headache. What precautions do we as developers should take? Good practices? How to test it? Where do you see IoT going in the future? What’s next? Final 10 Minutes Links: https://tessel.io https://developer.nest.com http://johnny-five.io http://dweet.io Tips & Picks Ari Picks: Go to Death Valley. It’s beautiful Tips: http://perfect.org is cool Patrick Stapleton Picks: [Reactive Redux AngularAir] (https://plus.google.com/events/cf3aue086abasnlah35lgr373fs) Jeff Whelpley Picks: http://onehungrymind.com/build-better-angular-2-application- redux-ngrx/ Atticus White Links: https://github.com/rwaldron/johnny-five https://github.com/samyk/skyjack Tips: Picks:[Johnny Five - JS Robotics & IoT programming framework] (https://github.com/rwaldron/johnny-five) [SkyJack - Drone autonomously seeks out other drones, taking them over, creating an army of zombie drones under your control] (https://github.com/samyk/skyjack) Zach Dunn Links: Search engine for sensors, based on geolocation: [Thingful] (https://thingful.net/) Simple messaging for devices (think Twitter, but for sensor data) [dweet.io](https://dweet.io/) Tips:Picks: Hardware development board, powered by NPM https://tessel.io/ Angular Air is a video podcast all about Angular hosted by Jeff Whelpley. Please visit the Angular Air website (http://angularair.com) to see upcoming and past episodes. Also be sure to follow Angular Air on Twitter and Google+ to stay up to date with future episodes. Also, all episodes are on the YouTube channel as well. AngularClass Learn AngularJS, Angular 2, and Modern Web Development form the best. Looking for corporate Angular training, want to host us, or Angular consulting? twitter: @AngularClass email: info@angularclass.com chat: Join AngularClass Chat --- Support this podcast: https://podcasters.spotify.com/pod/show/angularair/support

Our TOPPODCAST Picks

Follow Us

Stay Connected

Related Podcasts

Links

Stay Connected