JSJ 269 Reusable React and JavaScript Components with Cory House
JavaScript Jabber11 Heinä 2017

JSJ 269 Reusable React and JavaScript Components with Cory House

JSJ 269 Reusable React and JavaScript Components with Cory HouseOn today’s episode of JavaScript Jabber, we have panelists Joe Eames, Aimee Knight, Charles Max Wood, and playing the part of both host and guest, Cory House. Encourage your team to investigate reusable components, whether that’d be React, Angular, Vue, or Ember. Tune in![00:01:35] – OverviewWe can finally write reusable components that it is really lightweight. It doesn’t take much framework-specific code to get things done.Around 3 years ago, the idea of web component standard was all front-end developers could share our components with each other whether someone is in Angular or React. Web components continue to be an interesting standard but people continue to reach for JavaScript libraries instead – React, Angular, Vue. [00:04:50] – Browser support issueThe story in JavaScript libraries is easier. You have more power, more flexibility, more choices, and get superior performance, in certain cases, by choosing a JavaScript library over the standard right now. If you try to use the web components standard, you have to Polyfill-in some features so you can run things across browser. You also won’t get JavaScript features like intelligently splitting bundles and lazy load different components.Whether you’re in Angular or React, you have this model of putting your data in your curly braces. That setup is non-existent in standardized web components. You have to play the game of putting and pulling data into and out the DOM using DOM selectors. You actually take a step backward in developer ergonomics when you choose to leverage the platform instead. [00:07:50] – Polymer The reason that Polymer is useful is it adds some goodness on top of web components. One of those things is that it makes it easier to bind in data and not having to do things like writing a DOM query to be able to get your hands on this div and put this text inside of it. With Polymer, you can do something that feels more like Angular, where you can put in your curly braces and just bind in some data into that place. Polymer ends up adding some nice syntactic sugar on top of the web components standard just to make it easier to create web components. Polymer is also used to bundle in Polyfill for the features across browser. [00:14:20] – Standards are deadNo. The standard itself has been embraced at different levels by different libraries. What you can see for the near future is popular libraries leveraging pieces of the web components platform to do things in a standard-spaced way. Effectively, Angular, Vue, Aurelia, are going to be abstractions over the web components standard. Arguably the most popular way to do components today is React. But React completely ignores the web components standard. When you look at React, you can’t see what piece of the web components standard would fundamentally make React a better component library.Cory can’t seem to run to anybody that is actually using the standard in production to build real applications. People continue to reach for the popular JavaScript libraries that we so often hear about.[00:17:05] – Libraries making reusable componentsThere is a risk that it would have been a waste for people writing components on Angular, for React, for Vue. But it’s not necessarily safer writing on the web component standard when you have so few people leveraging that standard. There’s always the risk that that standard may shift as well.As an example, Cory’s team created approximately 100 reusable components in React. If they end up moving to a hot new library, the components are really just functions that take parameters and contain HTML. There is little there[00:21:20] – Why opt for reusable componentsReusable components are inherently useful in a situation where you’re going to be doing something more than once. If you think about any work that you do as a software developer, we’d like to think that we’re coming in and creating new things but often it is groundhogs day. There are all sorts of opportunities for reuse.As a company, we want to encapsulate our forms in reusable components so it’s literally impossible for our software developers to do something that goes against our standard. That’s the power of reusable components. [00:31:20] – Rigid component vs. flexible component As component developers, if we try to create a reusable component in a vacuum, bad things happen. If you’re going to do a reusable component, start by solving a specific problem on a given application. If we think that a component’s going to be useful in multiple places, we put it in a folder called reusable right there in our application source folder.We try to follow that rule of three as well. If we’ve taken that component and used it in 3 places, that’s a good sign that we should extract it out, put it in our NPM package, that way, everybody has this centralized component to utilize. At that point, it has been tested. It’s been through the fire. People have used it in the real world in a few places so we can be confident that the API is truly flexible enough.Be as rigid as you can upfront. Once you add features, it’s really hard to take features away. But it’s quite easy to add features later. If you start with something rigid, it’s easier to understand. It’s easier to maintain and you can always add a few more switches later.[00:36:00] – Reusable componentsThe reason that we can’t reuse code is every time a new project comes up, people are spending up their own ideas rather than leveraging standards that should have been put in place previously.We’ve had the technical ability to do this for a long time. We just haven’t been around long enough for consolidation to happen, for standardization to happen. You look at how quickly things are changing in our industry. For instance, a couple of years ago, everybody had pretty much decided that two-way binding was the way to build web applications. And then, React came along and shook that up. So today, you have different ways of thinking about that issue.[00:42:45] – Component development on teamsAimee’s team has component development and they’re using Angular 1.6. All of our base components are sitting in a seed application. We just go in when we want to create a new property and we just extend all of those components with specific functionalities that we need.[00:47:45] – Mobile to web crossoverCory’s team is creating React components but it’s not leveraged on a mobile application. But people use React Native components on the web. And in fact, if you use create-react-app today, you can do that right now. It’s wired up to work in React Native components. In that way, you can literally have these same components running on your Native mobile apps as you do on your web application.[00:50:00] – ChallengeCory’s challenge for everybody listening is sit down with your team and have a quick conversation about whether you think components make sense. Look back at the last few months of development and say, "if we have a reusable component library, what would be in it? How often have we found ourselves copying and pasting code between different projects? How much benefit would we get out of this story?"Once you’ve realized the benefits of the component model, both in the way that makes you think about your application, in a way that it helps you move faster and faster over time, I really think you won’t go back to the old model. I’d encourage people to investigate reusable components, whether that’d be React, Angular, Vue or Ember.PicksCory HouseJoe EamesAimee KnightCharles Max WoodJSJ 269 Reusable React and JavaScript Components with Cory HouseOn today’s episode of JavaScript Jabber, we have panelists Joe Eames, Aimee Knight, Charles Max Wood, and playing the part of both host and guest, Cory House. Encourage your team to investigate reusable components, whether that’d be React, Angular, Vue, or Ember. Tune in![00:01:35] – OverviewWe can finally write reusable components that it is really lightweight. It doesn’t take much framework-specific code to get things done.Around 3 years ago, the idea of web component standard was all front-end developers could share our components with each other whether someone is in Angular or React. Web components continue to be an interesting standard but people continue to reach for JavaScript libraries instead – React, Angular, Vue. [00:04:50] – Browser support issueThe story in JavaScript libraries is easier. You have more power, more flexibility, more choices, and get superior performance, in certain cases, by choosing a JavaScript library over the standard right now. If you try to use the web components standard, you have to Polyfill-in some features so you can run things across browser. You also won’t get JavaScript features like intelligently splitting bundles and lazy load differ

Become a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

Jaksot(735)

079 Lo-Dash with John-David Dalton

079 Lo-Dash with John-David Dalton

The gang talks to Lo-Dash maintainer John-David Dalton about open source software, performant Javascript, Lo-Dash and UnderscoreSpecial Guest: John-David Dalton. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

11 Loka 20131h 4min

078 Working From Home

078 Working From Home

Joe Eames and Charles Max Wood talk about the advantages and challenges of working from home. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

4 Loka 201358min

077 JSJ Monocle with Alex MacCaw

077 JSJ Monocle with Alex MacCaw

PanelAlex MacCaw (twitter github blog) Joe Eames (twitter github blog) Jamison Dance (twitter github blog) AJ O’Neal (twitter github blog) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) Discussion 01:13 - Going Rogue Video 02:12 - Alex MacCaw Introduction029 JSJ Bower.js with Alex MacCaw and Jacob Thornton JavaScript Web Applications: jQuery Developers' Guide to Moving State to the Client by Alex MacCaw The Little Book on CoffeeScript: The JavaScript Developer's Guide to Building Better Web Apps by Alex MacCaw 02:44 - MonocleAlternative for Hacker News 03:39 - SpeedAlex MacCaw: Time to first tweet sinatra MVC Framework Synchronicity 10:48 - SEOGoogle Webmaster Tools The Google Webmaster Video on Single-page Apps / SEO Alex MacCaw: SEO in JS Web Apps 14:01 - The Social Aspect of Monocle/Community 17:09 - Caching 17:47 - Google Website Optimizer 18:26 - Responsiveness 21:00 - Client-side & Server-side 25:11 - Testing for PerformancePageSpeed Insights 28:39 - The Design Processsinatra sequel 31:44 - Sourcing.ioSourcing.io Signup 34:15 - InspirationPicksMicroFormat Tool (AJ) Google Markup Helper (AJ) Gmail Markup Schemas (AJ) OUYA (AJ) TowerFall (AJ) Final Fantasy 7 (emulator) Final Fantasy 7 (PC) (AJ) Sunlounger (Joe) Pebble Watch (Joe) ng-conf (Joe) Book Yourself Solid: The Fastest, Easiest, and Most Reliable System for Getting More Clients Than You Can Handle Even if You Hate Marketing and Selling by Michael Port (Chuck) Coder (Alex) List of Ig Nobel Prize winners (Alex) Next Week Working From Home Transcript ALEX:  The rain in Spain falls mainly on the plain.[Hosting and bandwidth provided by the Blue Box Group. Check them out at BlueBox.net.] [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.] [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the frontend of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google Closure Compiler. Check it out at JetBrains.com/WebStorm.]CHUCK:  Hey everybody and welcome to episode 77 of the JavaScript Jabber show. This week on our panel, we have Joe Eames.JOE:  Hey there.CHUCK:  Jamison Dance.JAMISON:  Hey friends.CHUCK:  AJ O’Neal.AJ:  It'sa mia, it'sa AJ.CHUCK:  I’m Charles Max Wood from DevChat.TV. And before I introduce our guest, I just want to make a quick announcement. Tomorrow as we’re recording this, so when you get this episode it will be last Friday, is my Freedom Day. It’s the day I got laid off from my last full-time job and went freelance. So in honor of that, I’m putting together a video. I’ve called it ‘Going Rogue’. Yes, I know that there’s a political thing around that, whatever. Anyway, I called it ‘Going Rogue’. You can get it at GoingRogueVideo.com.It’s basically the first year of me going freelance. I’ve just talked through how it all went. The mistakes I made, the things I learned, the things I did right, and just gave general advice to anyone who’s looking to go freelance. Or if you’re interested in some of the challenges that come with that, it’s a video that I’m putting together to kind of explain that. Like I said, it’s free. You can get it at GoingRogueVideo.com. Yeah, I’m pretty excited about it. I’m also excited about Freedom Day.Anyway, we also have a special guest today, and that’s Alex MacCaw.ALEX:  How do you do? Thank you for having me.CHUCK:  You’ve been on the show before, but it’s been almost a year. Do you want to introduce yourself again?ALEX:  Well, I’m mostly a JavaScript programmer.Special Guest: Alex MacCaw. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

27 Syys 201350min

076 JSJ Meteor.js with Marcus Phillips and Fred Zirdung

076 JSJ Meteor.js with Marcus Phillips and Fred Zirdung

PanelMarcus Phillips (twitter github) Fred Zirdung (twitter github) Jamison Dance (twitter github blog) Joe Eames (twitter github blog) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) Discussion 01:30 - Marcus Phillips and Fred Zirdung IntroductionHack Reactor 03:31 - Experience with Meteor 05:45 - Intro to MeteorClient-side Environment Tethered Queries minimongo 09:56 - Websockets 11:29 - Deployment Support 14:51 - The Cloud 16:43 - Meteor and Server-side JavaScript EnginesMeteor Devshop 7 - LIVE 19:48 - Meteor and Windows 22:43 - Package Management System 23:49 - Building Meteor Apps 29:04 - Meteor Methods 33:02 - Open-Source Meteor Apps 34:15 - Hack ReactorEducation Training Developers Removing Complexity Picksng-conf (Joe) Ben Kamens: “Shipping Beats Perfection” Explained (Jamison) Evan Goer: Writing for Developers — Some Rational Techniques (Jamison) BOXEN (Chuck) Book Yourself Solid Illustrated: The Fastest, Easiest, and Most Reliable System for Getting More Clients Than You Can Handle Even if You Hate Marketing and Selling by Michael Port (Chuck) meteor / packages / deps / deps.js (Marcus) Underscoreboard (Marcus) actionHero.js (Fred) Satellite (Fred) Tilden (Fred) rethink-livedata (Marcus) Next Week Monacle with Alex MacCaw Transcript JAMISON:  Speaking of single and [working] 30 hours a week after your job, is Merrick there?  [Hosting and bandwidth provided by the Blue Box Group. Check them out at BlueBox.net.] [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.] [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the frontend of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google Closure Compiler. Check it out at JetBrains.com/WebStorm.]CHUCK:  Hey everybody and welcome to episode 76 of the JavaScript Jabber show. This week on our panel, we have Jamison Dance.JAMISON:  Hello friends.CHUCK:  Joe Eames.JOE:  Hey there.CHUCK:  I’m Charles Max Wood from DevChat.TV. We’ve also got two special guests and that is Fred Zirdung.FRED:  Hello.CHUCK:  Did I totally butcher that?FRED:  Yeah, you got it right.CHUCK:  Okay. And Marcus Phillips.MARCUS:  Hi everybody.CHUCK:  Since you guys haven't been on the show before, do you want to introduce yourself? We’ll have Marcus go first.MARCUS:  Sure. I'm Marcus Phillips. I'm a JavaScript enthusiast. I've been in it for a long time. Really excited about framework architecture and lately, all about teaching what I've learned over the course of time that I've been working in the Bay Area and working on the frontend of Twitter and things like that. Nowadays, I teach at Hack Reactor full time which is an immersive school for learning to become a developer over a period of three months.JAMISON:  Cool.CHUCK:  And which technologies do you teach at Hack Reactor?MARCUS:  We use JavaScript as our teaching language. Fundamentally, what we’re trying to do is teach people software engineering principles. So, JavaScript just turns out to be one of the most useful languages we can use to do that. But from there, we kind of want to give people practical skills that they can use immediately on the job. So, we definitely drive the entire curriculum out of GitHub repos and teach them some practical things like Backbone and Node and deployment strategies. So yeah, we kind of cover the gambit from frontend to backend with a focus on JavaScript in particular.CHUCK:  Awesome. That sounds really cool.JOE:  Yeah, it does.MARCUS:  It’s a lot of fun.CHUCK:  Fred,Special Guests: Fred Zirdung and Marcus Phillips. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

20 Syys 201350min

075 JSJ Maintainable JavaScript with Nicholas Zakas

075 JSJ Maintainable JavaScript with Nicholas Zakas

PanelNicholas C. Zakas (twitter github blog) Joe Eames (twitter github blog) AJ O’Neal (twitter github blog) Jamison Dance (twitter github blog) Merrick Christensen (twitter github) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) Discussion 01:24 - Nicholas Zakas IntroductionBox Maintainable JavaScript by Nicholas C. Zakas High Performance JavaScript (Build Faster Web Application Interfaces) by Nicholas C. Zakas Yahoo 02:19 - What Makes Maintainable JavaScript?Code Layout Clever Solutions (“Chicken Blood Solutions”) 04:39 - FormattingThinking, Fast and Slow by Daniel Kahneman Broken Window Theory 07:33 - Architectureaura Nicholas Zakas: The Scalable JavaScript Application Architecture Feature Encapsulation 14:11 - 'High Performance Javascript' and the balance between short-term and long-term knowledge 19:17 - Important conventions for a team to followStyles Mini Design Patterns Readability 26:14 - Tools & TechniquesStyle Guide 28:31 - Breaking the continuous integration build 31:14 - LintingJSLint 32:35 - Developing skills for architecting thingsExperience Personal Trait of Curiosity Component-based and Systems-based software engineers 37:52 - Architecture and MaintainabilityTestability Backbone.js 43:28 - Creating common conventions that will apply across projectsPicksDomo (Joe) Pluralsight (Joe) Game Dev Tycoon (Joe) The Star Wars (Joe) Foundation Actionscript 3.0 Animation: Making Things Move! by Keith Peters (Merrick) ng-conf (Merrick) Kveikur by Sigur Rós (Merrick) makemeasandwich (AJ) Sleep (AJ) Jekyll Themes (Jamison) Growing Object-Oriented Software, Guided by Tests by Steve Freeman (Jamison) A Canticle For Leibowitz by Walter M. Miller Jr. (Jamison) DevChat.tv (Chuck) Thinking, Fast and Slow by Daniel Kahneman (Nicholas) StePhest Colbchella '013 - Time to Dance (Nicholas) Evolution of Music - Pentatonix (Nicholas) Next Week Meteor.js with Marcus Phillips and Fred Zirdung Transcript[Hosting and bandwidth provided by the Blue Box Group. Check them out at BlueBox.net.] [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.] [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the frontend of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google Closure Compiler. Check it out at JetBrains.com/WebStorm.]CHUCK:  Hey everybody and welcome to episode 75 of the JavaScript Jabber show. This week on our panel, we have Joe Eames.JOE:  Hey, everyone.CHUCK:  AJ O’Neal.AJ:  I can hit unmute. I'm here.CHUCK:  Jamison Dance.JAMISON:  Hello, friends.CHUCK:  Merrick Christensen.MERRICK:  Hey, guys.CHUCK:  I’m Charles Max Wood from DevChat.TV. This week, we have a special guest, that’s Nicholas Zakas.NICHOLAS:  Yup, you got it.CHUCK:  So, since you haven’t been on the show before, do you want to introduce yourself?NICHOLAS:  Sure. I'm a software engineer that is working for Box currently. I think a lot of people probably know me from the books that I've written, mostly on the topic of JavaScript and the talks that I've given also on that topic. And a lot of that relates back to my work when I was at Yahoo. I was there for about five years and was the lead on the Yahoo homepage redesign. And a lot of what I do is really just try to solve problems in real life and then share what I did with everybody else in whatever way I think is most appropriate - writing or speaking or coming on podcasts.CHUCK:  Yes, you're being modest. You have a book,Special Guest: Nicholas C. Zakas. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

13 Syys 201357min

074 JSJ Grunt with Ben Alman

074 JSJ Grunt with Ben Alman

PanelBen Alman (twitter github blog) AJ O’Neal (twitter github blog) Jamison Dance (twitter github blog) Ryan Florence (twitter github blog) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) Discussion 01:34 - Ben Alman IntroductionBocoup 02:54 - “Cowboy”Cowboy Coder 06:53 - The Birth of GruntEnder make rake jake 14:34 - Installing Globally & PluginsJSHint grunt-cli lodash async 20:43 - Managing the project and releasing new versions 22:32 - What is Grunt? What does it do?jQuery libsass SASS stylus 26:39 - Processes & Building Featuresnode-task guard grunt-contrib-watch node-prolog 35:29 - The Node Community and reluctance towards Grunt 41:35 - Why the separation of task loading and configuration? 46:18 - Contributions and Contributing to Grunt 55:18 - What Ben would have done differently building GruntEase of Upgrade PicksWeb Components (Ryan) Eliminate Sarcasm (Ryan) Bee and PuppyCat (Jamison) MONOPRICE (AJ) AJ O'Neal: Moving to GruntJS (AJ) The Best Map Ever Made of America’s Racial Segregation (Chuck) Clean Off Your Desk (Chuck) Polygon (Ben) My Brother, My Brother and Me (Ben) Echofon (Ben) Bocoup (Ben) Next Week Maintainable JavaScript with Nicholas Zakas Transcript RYAN:  We’re potty training my son right now. So, I was up like eight times cleaning poo off of everything.[Hosting and bandwidth provided by the Blue Box Group. Check them out at BlueBox.net.] [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.] [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the frontend of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google Closure Compiler. Check it out at JetBrains.com/WebStorm.]CHUCK:  Hey everybody and welcome to episode 74 of the JavaScript Jabber Show. This week on our panel, we have AJ O’Neal.AJ:  I’m eating beef jerky.CHUCK:  Jamison Dance.JAMISON:  Hello.CHUCK:  We have a special guest. I guess you’re a guest in filling in for Merrick and Joe and that’s Ryan Florence.RYAN:  Hey, how’s it going? I don’t know if I can fill two shoes, but I will try.CHUCK:  Well, you have two feet, right?RYAN:  Okay. Well, that’s four shoes.CHUCK:  [Chuckles] I’m Charles Max Wood from DevChat.TV. We also have another special guest and that is Ben Alman.BEN:  Yo! What’s up, everyone?CHUCK:  So, do you want to introduce your self, Ben, since you haven’t been on the show before?BEN:  I’m Ben Alman. Oh, okay.[Laughter]AJ:  That’s not conceited.RYAN:  That’s really all he needs.BEN:  That’s it. The show’s over, roll credits. So yeah, I’m Ben. You can find me online as @cowboy on Twitter or GitHub and I’m at BenAlman.com. And if you Google me, I have finally got enough SEO juice to beat the other Ben Alman who’s the Orthopedic Surgeon for sick children in Canada. So screw you, guy who helps sick kids.[Laughter]BEN:  No, it’s cool. It’s cool, right? But for a while, I was like, “Damn this guy.” But I can’t do anything because he helps sick children. So there’s another Benjamin Alman out there doing things for society and me, I just code. So, I work at Bocoup. We’re at Bocoup.com. Our logo is a rooster, Bob the Rooster, and we make a lot of cool web and open web and open source stuff. And so, I do training there. I teach people JavaScript and jQuery. But I also work on open source tools. I spend a lot of my time, actually, behind the scenes in Node writing JavaScript, experimenting, R&D, writing tools, et cetera.CHUCK:  Awesome. So,Special Guests: Ben Alman and Ryan Florence. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

6 Syys 20131h 14min

073 JSJ React with Pete Hunt and Jordan Walke

073 JSJ React with Pete Hunt and Jordan Walke

PanelPete Hunt (twitter github blog) Jordan Walke (twitter github) Joe Eames (twitter github blog) AJ O’Neal (twitter github blog) Jamison Dance (twitter github blog) Merrick Christensen (twitter github) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) Discussion 01:34 - Pete Hunt IntroductionInstagram Facebook 02:45 - Jordan Walke Introduction 04:15 - ReactReact - GitHub 06:38 - 60 Frames Per Second 09:34 - Data Binding 12:31 - Performance 17:39 - Diffing Algorithm 19:36 - DOM Manipulation 23:06 - Supporting node.js 24:03 - rendr 26:02 - JSX 30:31 - requestAnimationFrame 34:15 - React and Applications 38:12 - React UsersKhan Academy 39:53 - Making it workPicksBen Mabey: Clojure Plain & Simple (Jamison) JSConf 2013 Videos (Jamison) Kittens (Jamison) PBS Idea Channel (AJ) Free Trial SSL (AJ) OSX Wifi Volume Remote Control (AJ) js-git (Merrick) vim-airline (Merrick) MLS LIVE (Joe) Seraphina by Rachel Hartman (Joe) ng-conf (Joe) Hire Chuck (Chuck) GoToMeeting (Chuck) ScreenFlow (Chuck) syriandeveloper (Pete) jsFiddle (Pete) Hotel Tonight (Pete) Green Flash Brewery Beer: Palate Wrecker (Jordan) All Things Vim (Jordan) Next Week Grunt.js with Ben Alman Transcript JAMISON:  Joe is Merrick’s personal assistant.CHUCK:  [Laughter]MERRICK:  No, we’re just in this little room and he had, he was like, “Yeah”JOE:  Want me to freshen up your coffee, sir?[Chuckles]JAMISON:  Feed me some tacos, Joe.[Laughter][Hosting and bandwidth provided by the Blue Box Group. Check them out at BlueBox.net.] [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.] [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the front end of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google Closure Compiler. Check it out atJjetBrains.com/WebStorm.]CHUCK:  Hey everybody and welcome to episode 73 of the JavaScript Jabber Show. This week on our panel, we have Joe Eames.JOE:  Hey there.CHUCK:  AJ O’Neal.AJ:  Live again from Provo.CHUCK:  Jamison Dance.JAMISON:  Hey friends.CHUCK:  Merrick Christensen.MERRICK:  Hey guys.CHUCK:  I’m Charles Max Wood from DevChat.TV and we have two special guests this week. Pete Hunt.PETE:  Hey guys.CHUCK:  And Jordan Walke.JORDAN:  Hi.CHUCK:  Since you guys haven’t been on the show before, do you want to introduce yourselves? We’ll have Pete go first.PETE:  Sure. So my name’s Pete. I work on general React stuff these days. But my day job is building the Instagram web experience. If you go to Instagram.com, we have a bunch of frontend stuff you can play with and a bunch of backend infrastructure that supports all that. That’s what I mostly work on. We’re big users of React at Instagram so I ended up contributing a lot to the React core as well.JAMISON:  So did you come from Instagram or from Facebook and then to work on Instagram?PETE:  Well it was actually a pretty good story just in terms of the integration of the two companies. I was originally at Facebook for a couple of years and we acquired Instagram and they came in and they wanted to build a web presence. Facebook’s core competency is definitely web technologies and Instagram hasn’t historically focused on that. So we were able to take the Facebook web expertise and get Instagram up and running really quickly. I came from the Facebook side but the team is still very much a separate team, their own building, that kind of thing. So that’s my background.CHUCK:  Awesome.JAMISON:  Sweet.CHUCK:  And Jordan?Special Guests: Jordan Walke and Pete Hunt. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

30 Elo 201356min

072 JSJ Screencasts

072 JSJ Screencasts

PanelJamison Dance (twitter github blog) Joe Eames (twitter github blog) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) Discussion 01:31 - Screencasting ExperiencePluralsight: AngularJS Fundamentals - Joe Pluralsight: jQuery Advanced Topics - Joe Pluralsight: Testing Clientside JavaScript - Joe Teach Me To Code - Chuck 02:44 - Getting into Screencasting 06:16 - Screencasting and JavaScript JabberSharing Knowledge RailsCasts (Ruby) NSScreencast (iOS) 09:45 - JavaScript ScreencastsEmbercasts egghead.io (Angular) PeepCode YouTube 10:54 - Conference Talks vs Screencasts 14:34 - Blog Posts vs Screencasts 17:58 - Recording Screencasts (Tools)Camtasia ScreenFlow Jing 22:59 - Voiceovers vs Typing and Talking 26:17 - Audio QualityBlue Snowball Blue Yeti Shure SM58 28:53 - Editing SoftwareAdobe Premier Pro Final Cut Pro Video Hive 33:27 - Preparing for ScreencastsLarge Font Closed-Captioning 40:23 - Videos of Yourself with ScreencastsWistia Transcripts PicksRequireBin (Jamison) The International - Dota 2 Championships (Jamison) That Conference (Joe) Seraphina by Rachel Hartman (Joe) ng-conf (Joe) Video Hive (Chuck) LessAccounting (Chuck) Next Week React with Jordan Walke and Pete Hunt Transcript JOE:  Well, you can represent the newbie perspective then.CHUCK:  Yup.JAMISON:  That’s my default job on this podcast.[Laughter]CHUCK:  No, that’s my job, believe me.JOE:  Au contraire, mon frère.[Hosting and bandwidth provided by the Blue Box Group. Check them out at BlueBox.net.] [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.] [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the front end of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google Closure Compiler. Check it out at JetBrains.com/WebStorm.]CHUCK:  Hey everybody and welcome to Episode 72 the JavaScript Jabber show. This week on our panel, we have Jamison Dance.JAMISON:  Hello.CHUCK:  Joe Eames.JOE:  Hey there.CHUCK:  I’m Charles Max Wood from DevChat.TV. And this week, we’re going to be talking about screencasting and sharing what you know through that kind of a visual medium. Before we get going, I’m wondering how much of this have you guys done?JAMISON:  None.JOE:  [Chuckles] I’ve done a fair amount. I’ve got my three courses with Pluralsight that I’ve done. That’s pretty much all the screencasting that I’ve done, is through Pluralsight. But I have to say I’ve definitely done a fair amount, several hundred, maybe a thousand with the screencasting.CHUCK:  Nice.JAMISON:  When you say a thousand hours, do you mean a thousand hours of recorded video or a thousand hours of time put into this?JOE:  Yeah, a thousand hours of time actually spent. So I’ve probably produced ten or fifteen hours of recorded video. Probably about that much and five or six hundred hours of time spent producing that much video, right around that.CHUCK:  Well there you go. If you’ve read outliers, you know you have nine thousand hours to go, right?JOE:  [Chuckles] Yeah. Exactly when I’ll be an expert.CHUCK:  That’s right. I’ve done a fair bit of screencasting as well. In fact, I got into podcasting through screencasting and I ran TeachMeToCode.com for a few years. I’m actually looking at reviving it but it’s just some time that I haven’t been able to commit yet. But yeah, it’s definitely a fun and interesting thing to do to share what you know and get the word out about whatever technologies you’re passionate about. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

23 Elo 201349min

Suosittua kategoriassa Liike-elämä ja talous

sijotuskasti
psykopodiaa-podcast
mimmit-sijoittaa
rss-rahapodi
herrasmieshakkerit
ostan-asuntoja-podcast
hyva-paha-johtaminen
taloudellinen-mielenrauha
rss-lahtijat
sijoituskaverit
rss-rahamania
rss-huomisen-talous
rss-merja-mahkan-rahat
rss-sisalto-kuntoon
rss-lentopaivakirjat
rss-vaikuttavan-opettajan-vierella
rss-neuvottelija-sami-miettinen
kasvun-kipuja
rss-bisnesta-bebeja
rss-paasipodi