The panelists talk to Christopher Chedeau and Jordan Walke about React.js Conf and React Native.

02:24 - Dann Toliver Introduction

• Twitter
• GitHub
• Bento Miso

02:35 - Matt Asher Introduction

• Twitter
• GitHub
• Blog

02:51 - EveryBit.js and I.CX

• [GitHub] everybit.js
• EveryBit.js Whitepaper

03:43 - Architecture

• Episode #135: Smallest Federated Wiki with Ward Cunningham

06:54 - Sustainability and The Pieces of the System

• Content “Puffs”
• Authentication
• Storage
  • Firebase
  • Distributed Hash Table (DHT)
  • The Chord Algorithm (Peer-to-Peer)

21:56 - Decentralization

• Space Monkey
• Madesafe

25:20 - Audience: Why Should I Care?

27:38 - Getting Started: Nuts and Bolts

• Frontend Agnostic
• Storage and Performance
• Users and Data Management
  • Payload Properties
  • Metadata
  • Graph Database
    • Adding New Relationships
    • Adding Heuristics
    • Resource Allocator Component
      • Local Storage
      • RAM

34:55 - Scaling and Server Cost

36:23 - Cloud Storage and Management (Security & Trust)

• HTTPS
  • SSL Model
  • GPG Model
• “Proof of Presence”
• "Self-verifying"
  • Namecoin Project

47:22 - Implementing Cryptographic Primitives

• bitcoinjs-lib    
• Key Management
• Cryptography
• OAuth

55:13 - The Firefox Sync Tool Project

Picks

[Twitch.tv] Kylelandrypiano (Jamison)
"Visualizing Persistent Data Structures" by Dann Toliver (Jamison)
Probability and Statistics Blog (Jamison)
Seeed Studio (Tim)
Adafruit Industries (Tim)
SparkFun Electronics (Tim)
American Sniper by Chris Kyle, Scott McEwen, and Jim DeFelice (Chuck)
Introducing Relay and GraphQL (Dann)
The Clojurescript Ecosystem (Dann)
Read-Eval-Print-λove (Dann)
React Native (Matt)

02:35 - John-Daniel Trask Introduction and Background

• Twitter
• GitHub
• Blog
• Mindscape
  • @MindscapeHQ

04:57 - Raygun.io

• @raygunio

06:23 - Crash Reporting The Right Way

• Error Grouping
• Suppress Notifications

10:06 - Most Common Errors

12:05 - Source Maps

19:16 - Managing Error Reporting in Gross Environments

22:17 - Determining Where The Issue Is

24:45 - Do People Write Their Own Errors?

26:23 - Frameworks Support

28:28 - Collecting Data: Privacy and Security

30:01 - Does working in error reporting make you judgemental of others’ code?

• “DDOSing Yourself”

32:42 - Planning for Rare Exceptions

33:36 - Tactics to Cut Down on Messages

35:53 - Gathering Basic Debugging Information

37:58 - Getting the BEST Information

• Promises
• Stockholm Syndrome

42:24 - The Backend: Node.js

• The raygun4node provider

43:24 - “Creating an Application”

Picks

LDS Connect (AJ)
LDS I/O (AJ)
TED Talk About Nothing (Dave)
OlliOlli 2 Soundtrack (Jamison)
Jurassic Park (Joe)
 ng-vegas (Joe)
WASD CODE 87-Key Illuminated Mechanical Keyboard with White LED Backlighting - Cherry MX Clear (Chuck)
Grifiti Fat Wrist Pad (Chuck)
Thank You Rails Clips Kickstarter Backers! (Chuck)
Mastery by Robert Greene (Chuck)
Ready Player One by Ernest Cline (Chuck)
The Pirates of Silicon Valley (John-Daniel)
littleBits (John-Daniel)

02:25 - Dan Abramov Introduction

• Twitter
• GitHub
• Dan Abramov: Live React: Hot Reloading with Time Travel @ react-europe 2015

02:43 - Dan’s Background and Journey Into Building Stuff with React

• Visual Basic

05:48 - redux and React    

10:07- The Elm Programming Language

12:19 - Reducers

14:04 - Hot Reloading

17:50 - “React makes you a better JavaScript developer.”

22:10 - Time Travel

28:26 - Storing Data and Managing State

• Interacting with the browser on CircleCI's VM

34:43 - [Patreon] Support Dan Abramov Creating Redux and React Hot Loader

36:24 - react-transform

• react-proxy
• babel-plugin-react-transform
• react-transform-catch-errors

41:34 - Using redux outside React

43:52 - Editors and Programmer Productivity

45:35 - Future Plans

Picks

The OAuth2 RFC (Aimee)
Michael Ries: Hiring Apprentices (Jamison)
@sebmck: "Sometimes having email history isn't always a good thing..." (Jamison)
Metal Gear Solid 5: The Phantom Pain (Jamison)
Firefly (Joe)
The Elm Programming Language (Joe)
Google Keep (Dave)
15 Minute Podcast Listener chat with Charles Wood (Chuck)
Pebble Time (Chuck)
100 Days of Burpees (Chuck)
Broad City (Dan)
Jamie xx: In Colour (Dan)
Cycle.js (Dan)

Sign up for JS Remote Conf!

Dan and Andrew's super awesome, helpful document that they made for the show during preparation

03:22 - Andrew Clark Introduction

• Twitter
• GitHub
• OpenGov
• flummox

03:39 - Dan Abramov Introduction

• Twitter
• GitHub
• JavaScript Jabber Episode #179: redux and React with Dan Abramov

04:03 - Flux

• Flux vs MVC

09:36 - Data Flow

• Why FluxComponent > fluxMixin
• Mixins Are Dead. Long Live Composition.  
• Higher-order Components
• Sebastian Markbåge's Tweet

22:52 - Conceptualizing React and Flux

• React.js Conf 2015 - Flux Panel
• Does redux limit ambiguity that exists in Flux?

27:50 - Documentation

30:38 - The Elm Programming Language

32:34 - Making Patterns Explicit in Frameworks

• Tom Dale @ TXJS 2015
• Let a 1,000 flowers bloom. Then rip 999 of them out by the roots.
• Sebastian Markbåge: Minimal API Surface Area @ JSConf EU 2014

36:31 - Getting Started with React and Flux

• Classes

42:42 - Where Flux Falls Short

58:23 - Keeping the Core Small; Making Decisions

Picks

Strange Loop 2015 Videos  (Jamison)
Typeset In The Future (Jamison)
Open-source as a project model for internal work (w/ speaker notes) by Kevin Lamping (Jamison)
Explanation of Zipf's Law (Dave)
Will Conant's talk at UtahJS 2015 on Flux (Dave)
The Legend of ZERO (3 Book Series) by Sara King (Joe)
Camel Up (Joe)
The Elm Programming Language (Joe)
Boundaries: A talk by Gary Bernhardt from SCNA 2012 (Aimee)
Nodevember (Aimee)
TV Fool (Chuck)
RCA Outdoor Digital HDTV VHF UHF Yagi Type Antenna (Chuck)
The Michael Vey Book Series (Chuck)
BusinessTown (Dan)
Elon Musk: The World’s Raddest Man (Dan)
Professor Frisby's Mostly Adequate Guide to Functional Programming (Dan)
Abiogenesis (Dan)
react-future (Dan)
The Righteous Mind (Andrew)
lodash-fp (Andrew)
Inside Amy Schumer (Andrew)
dataloader (Andrew)
Careers at OpenGov (Andrew)

00:51 Jameson is looking for clients who need front and back end code for apps; @Jergason (Contact him via Direct Message)

04:40 An explanation of Capital One and its operations

6:06 How many Capital One developers are using Node and how it is being implemented

10:30 Process of approval for app/website development

14:15 How the culture at Capital One affects technology within the company

18:25 Using Javascript libraries to manage different currencies

19:40 Venmo and its influence on banking

22:32 Whether banks are prepared to operate in a cashless society

29:44 Using HTML and Javascript for updating projects or creating new ones

35:21 Who picks up Javascript easily and why: “It’s more about grit than raw intelligence.”

44:00 Upgrading via open source codes

45:40 The process for hiring developers

51:35 Typescript vs. non-typescript

PICKS:

“Nerve” Movie

Brave Browser

“Stranger Things” on Netflix

Angular 2 Class in Ft. Lauderdale, Discount Code: JSJ

“Strategy for Healthier Dev” blog post

Health-Ade Beet Kombucha

“The Adventure Zone” podcast

On the Cruelty of Really Teaching Computer Science article by E.W. Dijkstra

“The Freelancer Show” podcast

“48 Days” podcast

Node.university

Azat Mardan’s Website

Azat Mardan on Twitter

CETUSA – Foreign exchange program

3:23 Discussing the purpose and aim of Codewars

7:30 The process for building a program with Codewars

11:07 The UI and editor experience

12:55 The challenges faced when first building Codewars

14:23 Explaining PJAX

16:54 Building code on Codewars

21:24 The expanded use of KATA on Codewars

23:11 Practicing “solving problems” and how it translates to real world situations

34:00 How Codewars proves out the persistence of coders

36:41 How Codewars appeals to collaborative workers

44:40 Teachable moments on Codewars

49:40 Always check to see if Codewars is hiring. Codewars uses Qualified.io, which helps automate the hiring process.

PICKS:

Marrow Sci-fi book

Uprooted Fantasy book

“Write Less Code” blog post

“The Rands Test” blog post

Five Stack software development studio

“Stranger Things” on Netflix

Angular 2 Class in Ft. Lauderdale, Discount Code: JSJ

Lean Analytics book

Code book

Datasmart book

Letting Go book

00:50 Intro to guests Donovan Brown and Jordan Matthiesen

1:14 Javascript and Devops

3:49 Node JS and integrating with extensions

11:16 Learning Javascript coming from another language

15:21 Visual Studio Team Services at Microsoft, integration and unit testing

• Visualstudio.com
• Donovanbrown.com

25:10 Visual Studio Code and mobile development

• Apache Cordova open source project

31:45 TypeScript and tooling

33:03 Unit test tools and methods

38:39 ARM devices and integration

QUOTES:

“It’s not impossible, it’s just a different set of challenges.” - Donovan Brown

“Devops is the union of people, process and products to enable continuous delivery of value to your end users” - Donovan Brown

“Apps start to feel more native. They can actually get form.” - Jordan Matthiesen

PICKS:

Veridian Dynamics (AJ)

Jabberwocky Video (AJ)

Hard Rock Cafe - Atlanta (Charles)

CES (Charles)

3D printers (Donovan)

High-Yield Vegetable Gardening (Jordan)

taco.visualstudio.com

Jordan on Twitter @jmatthiesen

Visualstudio.com

Donovanbrown.com

Donovan on Twitter @donovanbrown

SPONSORS:

Front End Masters

Hired.com

0:55 - Dan Fernandez and his work

• Microsoft Docs
• Twitter

7:50 - Walkthrough of the doc experience

15:00 - Editable nature of the doc

21:00 - Test driving a language

26:30 - Catering to the user

32:30 - Open Source

34:40 - User feedback

37:30 - Filters and Tables of Content

40:45 - Form submissions

41:50 - Community contributors

Picks:

Ghostbusters (AJ)

Daplie (AJ)

Daplie Wefunder (AJ)

.NET Rocks (Charles)

ScheduleOnce (Charles)

Devchat.tv 2017 Conferences (Charles)

Disable HTML5 Autoplay (Dan)

Visual Studio Code (Dan)

JSJ episode Visual Studio Code with Chris Diaz and Eric Gamma (Charles)

On today's JavaScript Jabber Show, Aimee Knight, Cory House, and Charles Max Wood discuss Gomix with Daniel X Moore. Daniel is a Software Developer at Fog Creek Software, and has been in the industry for 10 years. Their company currently offers an amazingly convenient way to build apps. Tune in to learn about it!

This episode features Moving from Node.js to .NET and Raygun.io with John-Daniel Trask. John-Daniel is the Co-founder and CEO of Raygun, a software intelligence platform for web and mobile. He's been programming for many years, and is originally from New Zealand. Tune in and learn what prompted them to move to the .NET framework!

JSJ 275: Zones in Node with Austin McDaniel

The panel for this week on JavaScript Jabber is Cory House, Aimee Knight, and Charles Max Wood. They speak with special guest Austin McDaniel about Zones in Node. Tune in to learn more about this topic!

[00:01:11] Introduction to Austin

Austin has worked in JavaScript for the past ten years. He currently works in Angular development and is a panelist on Angular Air. He has spent most of his career doing work in front-end development but has recently begun working with back-end development. With his move to back-end work he has incorporated front-end ideas with Angular into a back-end concept.

[00:02:00] The Way it Works

NodeJS is an event loop. There is no way to scope the context of a call stack. So for example, Austin makes a Node request to a server and wants to track the life cycle of that Node request. Once deep in the scope, or deep in the code, it is not easy to get the unique id. Maybe he wants to get the user from Passport JS. Other languages – Python, Java – have a concept called thread local storage. They can associate context with the thread and throughout the life cycle of that request, he can retrieve that context.

There is a TC39 proposal for zones. A zone allows you to do what was just described. They can create new zones and associate data with them. Zones can also associate unique ids for requests and can associate the user so they can see who requested later in the stack. Zones also allow to scope and create a context. And then it allows scoping requests and capturing contacts all the way down.

[00:05:40] Zone Uses

One way Zone is being used is to capture stack traces, and associating unique ids with the requests. If there is an error, then Zone can capture a stack request and associate that back to the request that happened. Otherwise, the error would be vague.

Zones are a TC39 proposal. Because it is still a proposal people are unsure how they can use it. Zones are not a new concept. Austin first saw Zones being used back when Angular 2 was first conceived. If an event happened and they wanted to isolate a component and create a scope for it, they used Zones to do so. Not a huge fan of how it worked out (quirky). He used the same library that Angular uses in his backend. It is a specific implementation for Node. Monkey patches all of the functions and creates a scope and passes it down to your functions, which does a good job capturing the information.

[00:08:40] Is installing the library all you need to get this started?

Yes, go to npminstallzone.js and install the library. There is a middler function for kla. To fork the zone, typing zone.current. This takes the Zone you are in and creates a new isolated Zone for that fork. A name can then be created for the Zone so it can be associated back with a call stack and assigned properties. Later, any properties can be retrieved no matter what level you are at.

[00:09:50] So did you create the Zone library or did Google?

The Google team created the Zone library. It was introduced in 2014 with Angular 2. It is currently used in front-end development.

[00:10:12] Is the TC39 proposal based on the Zone library?

While Austin has a feeling that the TC39 proposal came out of the Zone library, he cannot say for sure.

[00:10:39] What stage is the proposal in right now?

Zone is in Stage Zero right now. Zone JS is the most popular version because of its forced adoption to Angular. He recommends people use the Angular version because it is the most tested as it has a high number of people using it for front-end development.

[00:11:50] Is there an easy way to copy the information from one thread to another?

Yes. The best way would probably be to manually copy the information. Forking it may also work.

[00:14:18] Is Stage Zero where someone is still looking to put it in or is it imminent?

Austin believes that since it is actually in a stage, it means it is going to happen eventually but could be wrong. He assumes that it is going to be similar to the version that is out now. Aimee read that Stage Zero is the implementation stage where developers are gathering input about the product. Austin says that this basically means, “Implementation may vary. Enter at your own risk.”

[00:16:21] If I’m using New Relic, is it using Zone JS under the hood?

Austin is unsure but there something like that has to be done if profiling is being used. There has to be a way that you insert yourself in between calls. Zone is doing that while providing context, but probably not using Zone JS. There is a similar implementation to tracing and inserting logging in between all calls and timeouts.

[00:17:22] What are the nuances? Why isn’t everybody doing this?

Zone is still new in the JavaScript world, meaning everyone has a ton of ideas about what should be done. It can be frustrating to work with Zone in front-end development because it has to be manually learned. But in terms of implementation, only trying to create a context. Austin recommends Zone if people want to create direct contacts. The exception would be 100 lines of Zone traces because they can get difficult.

Another issue Austin has is Node’s native basic weight. Weight hooks are still up in the air. The team is currently waiting on the Node JS community to provide additional information so that they can finish. Context can get lost sometimes if the wrong language is used. He is using Typescript and doesn’t have that problem because it is straightforward.

[00:21:44:] Does this affect your ability to test your software at all?

No, there have not been any issues with testing. One thing to accommodate for is if you are expecting certain contexts to be present you have to mock for those in the tests. After that happens, the tests should have no problems.

Picks

Cory:

• Apple AirPods

Aimee:​

• Blackmill
• Understanding Zones

Charles:

• Classical Reading Playlist on Amazon
• Building stairs for his dad
• Angular Dev Summit 

Austin:

• NGRX Library Redux 

Links

• Twitter
• GitHub

Tweet this Episode

John-Daniel Trask is the CEO and developer at Raygun.io.

JD and Chuck talk in this episode about learning to program as a kid, the arc of JD's career, and entrepreneurship.

Links:

• 154 JSJ Raygun.io Error Reporting and Workflow with John-Daniel Trask
• JSJ 263 Moving from Node.js to .NET and Raygun.io with John-Daniel Trask
• C
• C++
• Delphi
• NetScape Navigator
• VBScript
• JQuery
• Mindscape
• Raygun.io
• CoffeeScript
• Visual Studio
• Scott Hanselman on Dark Matter Developers
• Tensorflow
• Stripe
• @traskjd

Picks:

JD:

• Keygen.sh
• Octopus Deploy
• JavaScript x86

Chuck:

• The Miracle Morning
• Meditations App
• Vision Board App
• LootCrate
• Game of Thrones Journal
• Zelda Theme Journal

Panel: 

Charles Max Wood

Guest: Austin McDaniel

This week on My JavaScript Story/My Angular Story, Charles speaks with Austin McDaniel. Austin is a return guest and was previously featured on JavaScript Jabber episode 275 . Austin talks about his journey getting into programming as an 11year old, to recently, as a web developer with more complex technologies. Austin talks about building widgets, working in Angular, JavaScript, and more in-depth web development on many different platforms. Lastly, Austin talks about his contributions to NGX Charts and speaking at a variety of developer conferences.

In particular, we dive pretty deep on: 

• How did you get into programming? 11 years old
• Cue Basic
• Web developer
• College jobs was in web developing
• IE6
• Building Widgets
• Components
• jquery 
• Web is the future
• How did you get into Angular? 2013, v1.2
• Backbone
• Angular 1 & 2
• NG X Charts
• Speaking at Conferences
• Augmented Reality and VR
• Web AR
• Angular Air Podcast
• Working as a contractor with Google
• and much, much more!

Links: 

• JavaScript Jabber episode 275
• jquery
• http://amcdnl.com
• Angular Air Podcast
• @amcdnl
• github.com/amcdnl
•  

Picks

Austin

• Todd Motto 

Charles

• NG Conf
• Angular Dev Summit
• Angular Air Podcast

Panel: 

Charles Max Wood

Cory House

Joe Eames

Aimee Knight

Special Guests: Azat Mardan

In this episode, JavaScript Jabber panelist speak with Azat Mardan. Azat is a return guest, previously on JSJ Episode 230. Azat is an author of 14 books on Node JS, JavaScript, and React JS. Azat works at Capital One on the technology team. Azat is the founder and creator of Node University.

Azat is on the show to talk about changes in React and licensing. Some of the topics cover Facebook,  licensing with React, using the wrong version of React, patent wars, and much more in-depth information on current events in React.

In particular, we dive pretty deep on:

• Facebook - Licensing with React
• Using the Wrong version of React in some companies
• BSD licensing
• Patent wars
• Facebook developing React
• Difference in Preact and Inferno
• Rewriting applications
• What did Capital One do about the changes?
• React 16
• Pure React
• Was the BSD patents - Med and Sm Companies
• Patents explained
• React Developers at Facebook
• Fiber - New Core Architecture
• And much more!

Links:

• http://azat.co
• https://node.university
• https://devchat.tv/js-jabber/230-jsj-node-at-capital-one-with-azat-mardan

Picks:

Cory

• Axel Rauschmayer post
• Prettier

Charles

• Indiegogo for Dev Chat
• forum.devchat.tv

Aimee

• Dev Tees
• Hacker News - Question on Stack Exchange and Estimates 

Joe

• Heroku 
• El Camino Christmas

Azat

• PMP 
• Azat - Short Lecture

Panel: Charles Max Wood

Guest: Azat Mardan

This week on My JavaScript Story, Charles speaks with Azat Mardan. Azat is the author of 14 books on Node JS, JavaScript, and React JS. He also founded Node University, speaks at conferences, and works at Capitol One. Azat first got into programming when he was in college and his major was Informatics in eastern Europe and then when he graduated, he taught himself JavaScript and PHP and did some freelance work. Once he came to the United States, he got his master’s degree in Information Systems Technology and was building websites for country embassies. His main advice to people new to programming and IT is to just focus on one thing and give yourself enough time to get comfortable with that technology, and then move on to a new technology to conquer.

In particular, we dive pretty deep on:

• How did you get into programming?
• Major in informatics
• PHP, JavaScript, CSS, and HTML
• Freelancing
• Masters in Information Systems Technology
• C++ class
• FDIC
• Advice to new programmers
• The importance of focus
• His startup experience
• Ruby on Rails
• Mac vs Windows
• Taught himself different frameworks and languages
• Location matters
• MongoDB
• The best way to learn is to teach others
• What was it about JavaScript that really clicked for you?
• JavaScript has expressiveness
• The Talent Code
• What led you to React?
• Which contributions are you most proud of?
• And much, much more!

Links: 

• Node University
• The Talent Code
• Azat’s Blog: WebAppLog.com

Picks

Charles

• Gardenscapes
• Starcraft II
• The Osiris Method

Azat

• Echo JS

Panel:

• Charles Max Wood
• Aimee Knight
• Joe Eames
• AJ O'Neal
• Special Guests: Orta Therox

In this episode, the JavaScript Jabber panelists talk about the tool Danger with Orta Therox. Danger allows you to create cultural rules about your pole request workflow. They discuss what Danger is, how it works, and how it can help you to catch errors and speed up code review. Danger lets you erase discussions so that you can focus on the things that you should really be focusing on, like the code. They also compare Danger to other ways of doing test converge.

In particular, we dive pretty deep on:

• What is DangerJS?
• Think of it as being on the PR level
• Provides an eval context
• Used on larger projects
• React, React Native, Apollo, and RxJS
• Experimenting with moving Danger onto a server
• Danger can run as a linting step
• Pre-commit hooks
• Prettier
• How do you use Danger on your own machine?
• Danger Ruby vs Danger JS
• NPM install
• How is using Danger better that other ways of test coverage?
• What kinds of rules can you write for this system?
• Can use with Ruby or JavaScript
• React Storybooks
• Retrospectives
• And much, much more!

Links:

• React Dev Summit
• JS Dev Summit
• Danger JS
• React
• React Native
• Apollo
• RxJS
• Prettier
• Danger Ruby
• Ruby
• JavaScript
• Orta’s GitHub
• Artsy Blog

Picks:

Charles

• Hogwarts Battle Board Game
• Sushi Go Party! Game
• NYC tips

Aimee

• Max Stoiber Blog
• The Ultimate Guide to Kicking Ass on Take-home Coding Challenges

Joe

• SaltCON
• Stuffed Fables Board Game

AJ

• UniFi AC Lite
• Fullmetal Alchemist

Orta

• The Wire
• Worm Web Serial

Panel:

• Charles Max Wood
• AJ ONeal
• Aimee Knight
• Joe Eames

Special Guests: Jordan Eldredge

In this episode, the JavaScript Jabber panelists discuss Winamp2-js with Jordan Eldredge. Jordan is the creator of Winamp2-js and was inspired to create this media player from the old Winamp media player that he used back in the day. They talk about the importance of limitations, the value of having fun side projects, and pushing the boundaries. They also touch on skin parsing, making Webamp an electron app, and more!

In particular, we dive pretty deep on:

• What is Winamp2-js?
• The history and future of Winamp
• WACUP
• Winamp was the first big mp3 player that you could style
• Webamp’s features and the technical challenges associated with them
• Why JavaScript?
• Creative solutions
• Limitations of browser and creating something that previously existed
• The importance of limitations
• Hadn’t done very much JavaScript prior to this project
• Originally created with jQuery
• Led him into a career in JavaScript
• Pushing the boundaries
• Skin parsing
• “Bitrot” and making Winamp skins accessible again
• The value of side projects, even stupid ones
• Architecture docs
• What made you choose React and Redux?
• Spotiamp (Soptify’s canceled Winamp client)
• Making Webamp an Electron app
• Winamp visualizers being ported to the web
• The domain name webamp.org
• And much, much more!

Links:

• Winamp2-js
• Webamp
• JavaScript
• jQuery
• Architecture docs
• React
• Redux
• jordaneldredge.com
• Jordan’s GitHub
• @captbaritone

Sponsors

• Kendo UI
• FreshBooks
• Loot Crate

Picks:

Charles

• JAM XT Speaker
• Trello

AJ

• Samson GoMic
• Greenlock for Web Servers
• Greenlock for Node.js

Aimee

• KA Engineering Principles

Joe

• 2ality.com
• What if JavaScript wins? Medium post

Jordan

• JavaScript Garden
• Rust
• @winampskins

Panel:

• Aimee Knight
• Charles Max Wood
• Christopher Ferdinandi (Boston)

Special Guests: Dan Shappir (Tel Aviv)

In this episode, the panel talks with Dan Shappir who is a computer software developer and performance specialist at Wix.com. As Dan states, his job is to make 100 million websites (hosted on the Wix platform) load and execute faster! Past employment includes working for companies, such as: Ericom, Ericom Software, and BackWeb. He studied at Technion Institute of Management and currently lives in Tel Aviv, Israel. The panel talks about web performance API among other things. Check it out!

Show Topics:

1:29 – Charles: Let us know who you are and why you’re famous!

1:39 – “Hello!” from Dan Shappir.

2:25 – Charles: You should say that you go to EACH site EVERY day out of the millions of sites out there.

2:53 – Charles: My mom mentioned Wix to me at first. My mom teaches High School Math.

3:16 – Dan: Yes that is our mission statement. That everyone can get a website without the knowledge of how to build a website.

3:52 – Aimee makes her comments.

3:59 – Dan: On our platform we try to offer people flexibility. There are bounds and limits, but people can do their very own thing, though. To make Wix faster because as we add more features and functionality that is our goal.

4:40 – Chuck: Okay, I know how to make X perform a little bit better. You are looking at a platform that controls TONS of sites, how do you even go about that?

4:58 – Dan: It is more difficult then that. We have millions of users leveraging the platform but there are a lot of developers in Wix who are developing the platform. I don’t think anyone at Wix has a total grasp of the complexity of the platform that we built. We have hundreds of frontend people working on our platform. All of them have pieces to the kingdom. We have processes in place with code reviews and whatnot, but there is so much going on. There is a change every 2 minutes, 24/7. We need to make sure progressing instead of regressing. 

6:54 – Aimee: I think it was interesting in one of the links you sent over. Because you know when something is getting worse you consider that a bug.

7:15 – Dan: It is more than a bug because if we see regression in performance then that is a problem. I can literally see any part of the organization and say, “stop” if it will

7:57 – Chuck: We are talking about performance, but what does that mean? What measures are there?

8:15: Dan: We are looking at performance can mean different things in different contents. User sites, for example, most important aspect is load time. How quickly the page loads and gets open to the viewer to that specific site. When they click something they want it instantly and no drag time. It does change in different contexts.

9:58 – Chuck: People do talk about load time. People have different definitions of it.

10:12: Dan: Excellent question. When you look at the different sites through Wix. Different people who build sites – load time can mean something else to everybody. It can mean when you see the MAIN text or the MAIN image. If it’s on an ECON site then how soon can they purchase or on a booking site, how long can the person book X product.

I heard someone at a conference say that load time is when: HERO TEXT And HERO IMAGE are displayed.

12:14 – Chuck: What is faster React or Vue?

12:21 – NEW HOST: Not sure. It all depends.

12:34 – Dan: We are big into React. We are one of the big React users outside of Facebook. I joined Wix four years ago, and even back then we were rebuilding our framework using React. One of our main modifications is because we wanted to do server-side rendered.

13:27 – Christopher asks Dan a question.

14:16 – Dan: We are in transition in this regard. Before we were totally client-site rendered, and that was the case until middle of last year. Then we deployed...

Dan: We are 100% server-side rendered now. Some things we are still using JavaScript. We have another project going on now and it’s fully CSS, and little JavaScript as possible. What you might want to do with that site is...

You might get in a few months every Wix site will be visible even if JavaScript is disabled.

16:26 – Aimee adds in her comments and observations to this topic.

16:55 – Dan: We don’t want things displayed incorrectly before it lays out. We hide the content while it’s downloading then make it visible. They lay-outing are done faster, because...

17:44 – Christopher asks Dan a question.

18:04 – Dan: I got into API...

Either you are moving forward or are you moving back. AKA – You are either progressing or regressing.

Different stages:

1.) Development stage

2.) Pre-Production (automated tools that check the performance with specific use cases)

3.) Check it out!

It’s beneficial to use these APIs.

21:11 – Christopher: What is performance APIs?

21:38 – Dan: There is a working group – Todd from Microsoft and others who are exposing the information (that is available in the browser) out into the browser. When the browser downloads a certain source (image, font, etc.) it can measure the various stages of downloading that feature.  You have these different sages of downloading this resource. The browser can measure each of these stages and then expose them to you. Basically it’s for the browser to expose this information to you and in a way that is coherent and uniform. It essentially maintains this buffer that puts performance entries sequentially.

Dan continues explaining this topic in detail.

25:55 – Dan: You have this internal buffer...

28:45 – Advertisement – Sentry – They support opensource.

29:39 – Christopher: everything you are saying seems that I can use this or that tab right now...

Why would I prefer the API to something visual, hypothetically?

30:03 – Dan: Three Different Stages. (See above.)

This information is very, very helpful during the developmental stage. Say you got a link from someone...

Dan mentions: Performance.mark

34:04 – Aimee: When you were talking about resource-ends. Many people don’t know what this is. Can you spend 2-3 minutes about how you guys are using these? Are there people can add for big bang for their buck?

34:41 – Dan: This might want to be a topic for its own podcast show.

Dan gives a definition of what a resource-end means.

Go back to fonts as an example.

Pre-connect for example, too.

39:03 – Dan: Like I said, it’s a huge topic.

You have to exercise some care. Bandwidth is limited. Make sure you aren’t blocking other resources that you do need right now.

40:02 – Aimee: Sounds like a lot of great things to tap into. Another question I have is about bundling.

40:27 – Dan: One of the things that we try to do (given that we are depending on the JavaScript we are downloading) we need to download JavaScript content to the client side. It has been shown often that JS is the most impactful resources that you need to download. You really want to be as smart as possible with that. What is even more challenging is the network protocols are changing.

Dan continues to go in-depth about this topic.

Dan: What we have found is that you want to strive to bundle resources together.

44:10 – Aimee: Makes sense.

44:15 – Dan continues talking about this topic.

45:23 – Chuck asks two questions. (First question is now and second question is at 51:32.)

2 Questions:

1. You gather information from web performance AI - What system is that?

45:42 – Dan: I am not the expert in that. I will try not to give misleading information. Actually let me phrase it different. There are 3^rd party tools that you can use leverage in your website. IF you are building for commercial reasons I highly recommend that you use performance-monitoring solution. I am not going to advertise one because there are tons out there. We ended up rolling out our own infrastructure because our use case is different than most.

At a conference I talked with a vendor and we talked about...

51:32 – 2^nd Question from Charles to Dan: Now you’ve gathered this information now what to you do? What patterns? What do you look for? And how do you decide to optimize things?

54:23 – Chuck: Back to that question, Dan. How should they react to it and what are they looking for

54:41 – Dan: Three main ways: 1.) Generate alerts 2.) See trends over long period of time 3.) Looking at real-time graphs.

Frontend developer pro is that likely being woken up in the middle of the night is lower. We might be looking at the real time graph after we deployed...

57:31 – Advertisement – Get a Coder Job!

58:10 – Picks!

Links:

• JavaScript
• jQuery
• React
• Elixir
• Elm
• Vue
• Wix
• Window Performance
• Web Performance
• Terra Genesis
• Terra Genesis: Space Colony
• The One Thing
• DevChat TV – YouTube
• GitHub: Off Side
• HBO: Insecure
• Wix: Engineering
• JavaScript Riddle
• JavaScript Riddles for Fun and for Profit
• Dan Shappir’s Twitter
• Dan Shappir’s LinkedIn
• Dan Shappir’s Crunch Base
• Dan Shappir’s GitHub
• Dan Shappir’s Talk through Fluent
• Dan Shappir’s Medium
• Dan Shappir’s YouTube Talk: JavaScript riddles for fun and profit

Sponsors:

• Code Badges
• Kendo UI
• Sentry
• Digital Ocean
• Cache Fly
•  

Picks:

Aimee:

• Waking up early!
• How to Deal with Dirty Side Effects in Your Pure Functional JavaScript

Chris:

• Offside - Toomuchdesign
• Insecure TV Show

Charles:

• Terraform - Game
• “The One Thing"
• Code Badge
• DevChat on YouTube

Dan

• Wix Engineering
• JavaScript Riddle

Sponsors

• Sentry use the code “devchat” for 2 months free on Sentry small plan
• CacheFly

Host: Charles Max Wood

Special Guest:  Dan Fernandez

Episode Summary

In this episode of My JavaScript Story, Charles hosts Dan Fernandez, Principal Group Program Manager at Microsoft.

Listen to Dan on the podcast JavaScript Jabber on this episode.

Dan went to a programming camp and fell in love with programming. He majored in Computer Science in college and started working for IBM upon graduation.  Listen to the show for Dan’s journey into programming and much more!

Links

• JavaScript Jabber 241: Microsoft Docs with Dan Fernandez
• Dan’s Twitter
• Dan's LinkedIn
• https://twitter.com/JSJabber
• https://www.facebook.com/javascriptjabber

Picks

Dan Fernandez:

• Microstang: Microsoft helps build a custom Mustang packed with Windows 8 and Kinect
• JavaScript Jabber 347: JAMstack with Divya Sasidharan & Phil Hawksworth

Sponsors

• Sentry use the code “devchat” for 2 months free on Sentry small plan
• CacheFly

Host: Charles Max Wood

Special Guest: Dan Shappir

Episode Summary

In this episode of My JavaScript Story, Charles hosts Dan Shappir from Tel Aviv, Israel, who is a computer software developer and performance specialist at Wix.

Listen to Dan on the podcast JavaScript Jabber on this episode.

Dan got a TI-99/4 when he was very young and enjoyed programming games. He first started with Basic language. After he studied Computer Science at the Hebrew University of Jerusalem, he joined the Israel army to serve his military service. While in the military he also obtained his Masters Degree in Computer Science.

Currently Dan is working as a Performance Tech Lead at Wix, he works on  speeding up the delivery and execution of 50+ million websites hosted on the Wix platform, as well as Wix own applications and services.

Links

• JavaScript Jabber 334: “Web Performance API” with Dan Shappir
• Dan Shappir’s Twitter
• Dan Shappir’s LinkedIn
• Dan Shappir’s Crunch Base
• Dan Shappir’s GitHub
• Dan Shappir’s Talk through Fluent
• Dan Shappir’s Medium
• Wix
• Dan Shappir’s YouTube Talk: JavaScript riddles for fun and profit
• https://www.facebook.com/DevChattv

Picks

Dan Shappir:

• Open Source Functional JavaScript Library
• Dan's JavaScript Riddles on Twitter
• Dan's JavaScript Riddles in Conference Talk
• Wix Engineering Blog

Charles Max Wood:

• VDOT O2
• Charles Max Wood Instagram Account

Sponsors

• Triplebyte offers a $1000 signing bonus

• Sentry use the code “devchat” for $100 credit

• CacheFly

Panel

• Charles Max Wood
• Joe Eames
• Christopher Buecheler
• Aimee Knight
• AJ O’Neal

Joined by special guest: Dan Shappir

Episode Summary

In this episode of JavaScript Jabber, special guest Dan Shappir, Performance Tech Lead at Wix, kicks off the discussion by defining server-side rendering (SSR) along with giving its historical background, and touches on the differences between server rendering and server-side rendering. He helps listeners understand in detail how SSR is beneficial for the web and takes questions from the panel about how it affects web performance in cases where first-time users and returning users are involved, and how does SSR fare against technologies such as pre-rendering. He then elaborates on the pitfalls and challenges of SSR including managing and declaring variables, memory leaks, performance issues, handling SEO, and more, along with ways to mitigate them. In the end, Dan sheds some light on when should developers use SSR and how should they start working with it.

Links

• Dan’s Twitter
• Dan’s GitHub
• SSR
• WeakMap

Follow JavaScript Jabber on Devchat.tv, Facebook and Twitter.

Picks

Christopher Buecheler:

• Tip - Take some time off once in a while

Aimee Knight:

• Learning How to Learn: Powerful mental tools to help you master tough subjects

AJ O’Neal:

• Fatherhood!

Joe Eames:

• Tiny Towns

• The Goldbergs

Charles Max Wood:

• EverywhereJS

• Christopher Buecheler’s books

• Get a Coder Job - Publishing soon!

Dan Shappir:

• Quora

• Corvid by Wix

• You Gotta Love Frontend Conferences

This episode of My JavaScript Story is coming to you live from OSCON. Joining Charles Max Wood is Daniel Gruesso from GitLab to talk about developing in the Open Source and the Developer Report.

GitLab works with an open core model, Daniel talks about the trade - offs of having code open to public, the first of which is having everything up-to-date so any contributions made will work with the latest version. Daniel calls this the "bus-factor" where if one of the team members gets hit by a bus, the rest of the team will have everything to work with.

They then talk about the GitLab 2019 Global Developer Report results. One of the most interesting results of this survey with over 4,000 respondents, was that remote teams outperformed on site teams. This ties into the current Twitter discussion about "10x Performing Engineers". Remote teams are able to work on their own most productive hours and are not disturbed by their teammates when they are doing dedicated work on a deadline. Also remote teams by nature have to be more conscious of security.

Sponsors

• Sentry use the code “devchat” for 2 months free on Sentry small plan

• Adventures in DevOps

• Adventures in Blockchain

• CacheFly

Host: Charles Max Wood

Joined by Special Guest: Daniel Gruesso

Links

• Daniel's LinkedIn

• GitLab

• Open Source & Software Development| O'Reilly OSCON

• GitLab 2019 Global Developer Report | GitLab

• 10x Engineer Twitter

In this episode of My JavaScript Story, Charles talks to Dan Pastori, Co-Founder, Software Architect at 521 Dimensions.

Charles asks about Dan's average day and what his life looks like before diving into his coding journey. Dan talks about how he got into web development. Dan taught himself PHP and JavaScript.

Charles talks about the Views on Vue episode Dan was on VoV 012: Re-using VueJS Mixins and Filtering Google Map Data with Dan Pastori, and wants to know how Dan got into Vue. Dan compares learning times of Vue and Angular and mentions he learned Vue in a week as opposed to the months he spent learning Angular.

Dan talks about his involvement in the Vue community and the future of Vue as well as the projects he is currently working on. Dan then talks about his future projects and plans. They finish off with picks.

Host: Charles Max Wood

Joined by Special Guest: Dan Pastori

Sponsors

• Sentry use the code “devchat” for 2 months free on Sentry small plan

• Adventures in DevOps

• Adventures in Blockchain

• CacheFly

Links

• VoV 012: Re-using VueJS Mixins and Filtering Google Map Data with Dan Pastori

• Dan's LinkedIn

• https://github.com/521dimensions/amplitudejs

• 521 Dimensions

• https://avotoast.app/

• https://github.com/521dimensions

• https://serversideup.net

• Dan's Twitter

Picks

Dan Pastori:

• Clean Code by Robert C. Martin

• The Food Lab: Better Home Cooking Through Science by Cherie Mason and J. Kenji López-Alt

Charles Max Wood:

• Headliner App

Daniel Caldas is calling from Singapore. He currently works as a software engineer for Zendesk and has also worked in Portugal and Germany. He has worked primarily on the frontend with Node and JavaScript. He talks about his experience testing JavaScript, how he got started with Jest, and why he likes it. Daniel finds Jest very easy to use and straightforward. He likes that  Jest has a single reference page for documentation. He feels that Jest is largely complete out of the box and has only made a small add on to get rid of Boilerplate in some tests.

Daniel explains what a snapshot, how they work, and why he prefers fixtures over factories. He gives tips on how to set up your tests so that they are easy to follow. He finds it helps to structure your scenarios in the fixture description. He talks about gotchas in Jest. While Jest is largely easy to use, Jest has been around for a while and breaking changes do happen. It’s important to check what version your code base is using. While there are a lot of free sources around Jest online, he advises listeners to stick as close to the official documentation as possible, or to people associated with Jest, and to read recent stuff. As for conventions, Jest has pretty much everything out of the box and the built in conventions make it easy to navigate any project that uses Jest.

Daniel talks about some of the features available in Jest, converting observables into promises, and tricks he has used to make tests easier to put together. He talks about his method for keeping his mocks and stubs straight. He advises listeners to have some organizational rules, such as starting the imports alphabetically, and to always follow those rules. He talks about how he runs tests and what environments he uses. While Jest is normally used for unit testing, Daniel has also used it for end to end tests, and he talks about his experience with an open source project doing both types in Jest. Daniel concludes the show by advising listeners starting with JavaScript and frontend, don’t think too much about the library you’re going to use because you’ll probably end up using Jest. It’s more important to have unit tests and a proper testing framework at the beginning than anything else. He also invites listeners to check out his open source work on Github.

Panelists

• Aimee Knight

• AJ O’Neal

• Charles Max Wood

**To receive your 40% OFF coupon for Manning Publications (good for all our products in all formats) visit us on Facebook - click on "Send A Message"and type "YES"**

Guest

• Danile Caldas

Sponsors

• Sentry | Use the code “devchat” for $100 credit

Links

• Zendesk

• Jest

• React

• Babel

• ESLint

• Async/Await

• Cypress

• React-d3-graph

• Unrevealed tips for unit testing with Jest

Picks

Aimee Knight:

• The Difference Between Fault Tolerance, High Availability, and Disaster Recovery

AJ O’Neal:

• Rubin Report with Lindsay Shepherd

Charles Max Wood:

• White Christmas

• Holiday Inn

Daniel Caldas:

• Home Alone

Daniel Caldas is a Portuguese developer working and living in Singapore. He learned to code in high school programming in Pascal. He moved up to the university and that's where he encountered JavaScript. He wound up doing a bunch of design work, static websites, and jQuery. He explains his journey and learning methods leading to a job working for Zendesk on their CRM.

Host: Charles Max Wood

Joined By Special Guest: Daniel Caldas

Sponsors

• Sentry | Use the code “devchat” for $100 credit

• CacheFly

______________________________________

"The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood is now available on Amazon. Get Your Copy Today!

______________________________________

Links

• JSJ 411: Unit Testing Jest with Daniel Caldas

• goodguydaniel.com

Picks

Daniel Caldas:

• tweak

Charles Max Wood:

• Shift

• Bose SoundLink Around Ear Wireless Headphones II

Clark, Victoria, 1961-

Sculptor and artist. Correspondence, writings, financial records, scrapbooks, newspaper clippings, photographs, and other papers of French, his daughter, Margaret French Cresson, and other members of the French family relating primarily to French's career as a sculptor and artist and to the French family.

Dipper, Frances, 1951- author

Allhoff, Fritz

Online Resource

Online Resource

Hayden Library - TP155.5.C76 2019

Online Resource

Online Resource

McCartney, Dan, author

Adewuya, J. Ayodeji, 1951- author

Korschun, Daniel

Bosworth, Michael T