CodeWinds - Leading edge web developer news and training | javascript / React.js / Node.js / HTML5 / web development - Jeff Barczewski - 015 Michael Jackson and Ryan Florence explain that React.js really changes how we think about building web and mobile apps

015 Michael Jackson and Ryan Florence explain that React.js really changes how we think about building web and mobile apps

04/08/15 • 76 min

1 Listener

CodeWinds - Leading edge web developer news and training | javascript / React.js / Node.js / HTML5 / web development - Jeff Barczewski

“It’s so rare that something actually comes along that really changes how we think about building stuff” - Michael Jackson

Episode Info
Show Notes and Timeline
Michael Jackson and Ryan Florence React.js training
Links and Resources
Related content
Video

Episode Info

Episode: CW 015
Published: April 8th, 2015
Tags: javascript, reactjs,nodejs,isomorphic
Duration: 1:16:34
Updated: 2015-04-11

Show Notes and Timeline

2:40 - What’s special about React.js?

“For me personally, it changed the way that I code as much as jQuery did back in 2008.” - Michael Jackson

“OMG, This is really going to change the way that I work and how much I enjoy my job on a day to day basis.” - Michael Jackson

5:00 - React.js doesn’t care about how you represent your data, models can be simple objects and arrays

“What excites me about React.js is... it doesn’t care about your data model, you just use plain JavaScript objects... For my models I use: array, Object, Number, ...” - Ryan Florence

“The new paradigm with React.js is we aren’t observing, we aren’t having a bunch of events, we are just throwing data at functions and then they return descriptions of UI” - Ryan Florence

6:40 - Javascript becomes our templating language

“It’s hard to explain until you start doing it how big of a shift this makes in your user interface development, to not worry about your app over time; you’re not mutating the state of objects over time in your UI components” - Ryan Florence

“We get to use the solutions that JavaScript already provides like modules and scope... we don’t have to wait for the framework’s template language to implement a solution for that” - Ryan Florence

8:25 - React.js, Angular, and Ember are pushing the language forward (ES6)
10:56 - Is React.js differnet from other SPA frameworks?
11:30 - React.js could be a good rendering tool for many frameworks
12:10 - Integrating React.js into existing code is easy without a full rewrite
13:30 - React.js be added to mature apps, not just greenfield apps
14:50 - Angular 2.0 and Ember 2.0 look a lot like and sound a lot like React.js. It is influencing so many other frameworks.
15:30 - Who can use React.js? What types of projects?
19:00 - Server side rendering - Isomorphic javascript
22:30 - React.js doesn’t care where you render - client, server, canvas, etc.
24:00 - Is React.js hard to learn?
25:00 - React.js allows you to code yourself out of problems
26:00 - Smaller API’s are easier to learn
28:10 - What brought Michael and Ryan to using React.js?

For me, one of the most awkward parts about #Emberjs is switching back and forth between Handlebars templates and component code. Any ideas?

— Michael Jackson (@mjackson) May 13, 2014

28:45 - Instructure had invested in Ember but were having struggles shipping and learning

“At Instructure, we bet on Ember... we were messing with it for almost a year and kind of weren’t shipping anything...” - Ryan Florence

30:00 - After an hour of using React.js, Ryan wanted to use it everywhere

“After an hour of using React.js, I had my face in my hands and said... I want to use this everywhere” - Ryan Florence

30:45 - A few hours later, Ryan had a router proof of concept up and running

“After two hours I actually had something working, and that probably impressed me the most about React.js” - Ryan Florence

“I was never able to just pick up something as quickly as I was able to pick up React.js and build a router” - Michael Jackson

“Two guys who had no idea what they were doing (with React.js) were able to make something (ReactRouter) that worked and was useful for other people” - Michael Jackson

32:30 - Ryan started throwing his toughest problems at React.js and it handled them great

“Then I just threw all of my toughest problems that I had ever run into as a frontend developer at React.js” - Ryan Florence

33...

“It’s so rare that something actually comes along that really changes how we think about building stuff” - Michael Jackson

Episode Info
Show Notes and Timeline
Michael Jackson and Ryan Florence React.js training
Links and Resources
Related content
Video

Episode Info

Episode: CW 015
Published: April 8th, 2015
Tags: javascript, reactjs,nodejs,isomorphic
Duration: 1:16:34
Updated: 2015-04-11

Show Notes and Timeline

2:40 - What’s special about React.js?

“For me personally, it changed the way that I code as much as jQuery did back in 2008.” - Michael Jackson

“OMG, This is really going to change the way that I work and how much I enjoy my job on a day to day basis.” - Michael Jackson

5:00 - React.js doesn’t care about how you represent your data, models can be simple objects and arrays

“What excites me about React.js is... it doesn’t care about your data model, you just use plain JavaScript objects... For my models I use: array, Object, Number, ...” - Ryan Florence

“The new paradigm with React.js is we aren’t observing, we aren’t having a bunch of events, we are just throwing data at functions and then they return descriptions of UI” - Ryan Florence

6:40 - Javascript becomes our templating language

8:25 - React.js, Angular, and Ember are pushing the language forward (ES6)
10:56 - Is React.js differnet from other SPA frameworks?
11:30 - React.js could be a good rendering tool for many frameworks
12:10 - Integrating React.js into existing code is easy without a full rewrite
13:30 - React.js be added to mature apps, not just greenfield apps
14:50 - Angular 2.0 and Ember 2.0 look a lot like and sound a lot like React.js. It is influencing so many other frameworks.
15:30 - Who can use React.js? What types of projects?
19:00 - Server side rendering - Isomorphic javascript
22:30 - React.js doesn’t care where you render - client, server, canvas, etc.
24:00 - Is React.js hard to learn?
25:00 - React.js allows you to code yourself out of problems
26:00 - Smaller API’s are easier to learn
28:10 - What brought Michael and Ryan to using React.js?

For me, one of the most awkward parts about #Emberjs is switching back and forth between Handlebars templates and component code. Any ideas?

— Michael Jackson (@mjackson) May 13, 2014

28:45 - Instructure had invested in Ember but were having struggles shipping and learning

“At Instructure, we bet on Ember... we were messing with it for almost a year and kind of weren’t shipping anything...” - Ryan Florence

30:00 - After an hour of using React.js, Ryan wanted to use it everywhere

“After an hour of using React.js, I had my face in my hands and said... I want to use this everywhere” - Ryan Florence

30:45 - A few hours later, Ryan had a router proof of concept up and running

“After two hours I actually had something working, and that probably impressed me the most about React.js” - Ryan Florence

“I was never able to just pick up something as quickly as I was able to pick up React.js and build a router” - Michael Jackson

“Two guys who had no idea what they were doing (with React.js) were able to make something (ReactRouter) that worked and was useful for other people” - Michael Jackson

32:30 - Ryan started throwing his toughest problems at React.js and it handled them great

“Then I just threw all of my toughest problems that I had ever run into as a frontend developer at React.js” - Ryan Florence

33...

Previous Episode

014 Successful launch and I'm back, CodeWinds content plans for 2015, provide your input

Episode Info
Transcript
Links

Episode Info

Episode: CW 014
Published: April 6th, 2015
Tags: javascript, reactjs,nodejs
Duration: 8:55

Transcript

Summary

Today I will fill you in on the large project that I was working on, its launch, and my CodeWinds focus and content planning for the coming year.

The links and show notes for this podcast are available http://codewinds.com/14 as in episode 14.

Backstory

First, I want to start with an apology, I left you, my community, hanging without any explanation for too long. So I wanted to give you a little of the back story and update you on where CodeWinds is going.

When I launched CodeWinds in 2013, my goal was to bring you the latest web developer news and training which I would deliver through my blog, podcast, and video courses. Well just after I started working on content, a local enterprise reached out with an ultra important need to rapidly build a scalable resilient platform for a large client. I didn’t even know the specifics of their client until the launch a year later. Well this enterprise was MasterCard. Our client turned out to be none other than Apple, and we were building the MasterCard ApplePay system. Wow.

This was such an awesome opportunity to apply my knowledge and skills to such an important project. When I joined the team, I intended to continue delivering CodeWinds content in my spare time, however the project demanded more of my focus than I anticipated, especially as we approached the launch. We poured our hearts into making sure that our platform was battle ready. And what happened on launch day? ... well everything just worked.

It was one of those priceless moments when everything comes together, like a symphony of technology and collaboration. The launch was described by some the senior staff as being possibly the most successful MasterCard launch of all time. It was complex, involving so many partners, yet it came together beautifully. I was blessed to be a part of this amazing team.

Regrets

Yet in all the success we had with this project, I failed you my CodeWinds community. I focussed so completely on the project that my content creation ground to a halt. I should have communicated with you, so you wouldn’t be left hanging and wondering what had happened. For that I am truly sorry, and ask for your forgiveness.

I’m back and focussed on CodeWinds

Fast forward to today, what’s in store for my future and that of CodeWinds. Well I am happy to say that I’m back. After much soul searching, I departed from the MasterCard team to work on CodeWinds fulltime. My desire is to bring you the best leading edge full stack web developer content.

React.js and other course plans

In the past few months, I have been doing a deep dive into React.js and its family. I’m so excited by the development and innovation going on in the React.js community.

“I believe the ideas and technology developing from the React.js community will profoundly influence how we build web and mobile apps.”

I’m currently planning a course on React.js and then will follow it with other topics like ES6, Hapi, Node, building resilient systems, and using HTML5.

I’ll offer this material in a variety of ways, but the primary mechanism will be online courses with training videos and exercises that you can follow at your own pace or in conjunction with those in a class. These will be real world projects similar to that which you would build at your companies.

I don’t like the simple hello world style examples which are so far removed from our real projects that it is hard to see how you really would do things in practice. So these will be real projects solving real problems including proper testing and error handling. I’ll deliver these video lessons in bite sized chunks that build on each other, so you can go directly to a specific topic or learn from begi...