On today's episode of My JS Story, Charles Max Wood welcomes Jon Schlinkert. Jon was on JavaScript Jabber episode 98 where he talked about Assemble.io. Tune in to My JS Story Jon Schlinkert to learn how his journey began in programming and what's keeping him busy these days.

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!

Welcome to the 9th My JS Story! Today, Charles Max Wood welcomes Joe Fiorini. Joe has been into programming since his teenage years. He discussed about functional reactive programming in episode 61 of JavaScript Jabber. Get to know him better at My JS Story Joe Fiorini.

On today's episode, Aimee Knight, AJ O'Neal, Cory House, Joe Eames, and Charles Max Wood discuss Azure with Jonathan Carter. Jonathan has been working at Microsoft for 10 years. He currently focuses on Node.js and Azure. Tune in to learn how you can use Azure in building applications and services.

On today's JavaScript Jabber Show, Aimee Knight and Charles Max Wood discuss Contributor Days with Tracy Lee. Tracy is a Google Developer Expert and a co-founder of This Dot Media and This Dot Labs. She's passionately into helping startups create a connection with investors. Part of what she's been up to lately is what this episode is about. Tune in to learn about it!

Welcome to the 9th My JS Story! Today, Charles Max Wood welcomes Richard Feldman. Richard works at No Red Ink, and he is the author of Elm in Action. He was in JavaScript Jabber and talked about Elm with Evan Czlapicki in episode 175 and covered the same topic alone in episode 229 . Stay tuned to My JS Story Richard Feldman to learn more how he started in programming and what he's up to now.

On today's JavaScript Jabber Show, Charles Max Wood, AJ O'neal, Aimee Knight, Joe Eames, and Cory House discuss Docker for Developers with Derick Bailey. Derick is currently into Docker and has been doing a series on it at WatchMeCode. He is also writing an ebook titled Docker Recipes for Node.js Development which aims to provide solutions for things that concern Node.js. Stay tuned to learn more about Docker and the ebook which Derick is working on!

Welcome to the 11th My JS Story! Today, Charles Max Wood welcomes Valeri Karpov. Valeri is a Platform Tech Lead at Booster Fuels, the author of Professional Angular JS and The 80/20 Guide to ES2015 Generators, and a blogger at codebarbarian.com. He is also the one who maintains mongoose JS. Stay tuned to My JS Story Valeri Karpov to learn more how he started coding and what he is currently up to!

On today's JavaScript Jabber Show, Charles, Aimee, Joe, and Cory discuss Wordpress and Wordpress API for JavaScript Developers with Roy Sivan. Roy is a WordPress (WP) developer at Disney Interactive. He has long been a fan of JavaScript and WP. During a WordCamp, the WP Founder announced the need for WP developers to learn JavaScript. But, what's in WP that developers should be interested about? Tune in to learn!

Welcome to the 12th My JS Story! Today, Charles Max Wood welcomes Max Stoiber. Max is a frontend JavaScript Developer from Vienna, Austria and currently works as an open source developer for Thinkmill, a company based in Sydney, Austria. Tune in to My JS Story Max Stoiber to learn more how he learned to program and discover what he enjoys doing!

On today's JavaScript Jabber Show, Charles, Aimee, and AJ discuss Graphcool with Johannes Schickling. Johannes is based in Berlin, Germany and is the founder of Graphcool, Inc. He also founded Optonaut, an Instagram for VR, which he sold about a year ago. Tune in to learn more about GraphQL and see what's in store for you!

Welcome to the 13th My JS Story! Today, Charles Max Wood welcomes Rebecca Turner. Rebecca is a CLI programmer at npm, Inc. She has been in the show around two to three years ago in episode 174 and talked about npm 3. Tune in to My JS Story Rebecca Turner to learn more how she got into programming and what she is up to these days!

On today's JavaScript Jabber Show, Charles and Aimee discuss Development in a Public Institution with Shawn Clabough. Shawn is a developer and developer manager at Washington State University. He works with the research office, and has been in the industry for 20 years. Tune in to this exciting episode!

On this week's episode of My JS Story, Charles Max Wood interviews Kim Carter. Kim is a software engineer, architect, web developer, entrepreneur, and the founder of BinaryMist Ltd. He recently appeared as a guest in episode 251, and talked about InfoSec for Web Developers. Also, he is currently writing a powerbook series and runs InfoSec conferences based in New Zealand. Stay tuned to know more about his journey in programming!

On today's JavaScript Jabber Show, Charles, Joe, Aimee, Cory, and AJ discuss Clean Code JavaScript with Ryan McDermott. Ryan is a UX Engineer at Google and has been a professional developer for 5 years. He's focused on frontend Angular and backend node.js. Stay tuned to learn more about his current project with JavaScript!

On this week's episode of My JS Story, Charles Max Wood interviews Justin Searls. Justin was on the show on episode 38 and 226 in the show. He co-founded Test Double, a software agency which helps developers improve the quality of the software they write. Want to know how he got into this career path? Stay tuned!

On today's episode, Charles, Joe, and Cory discuss Practical JavaScript with Gordon Zhu. Gordon is the founder of Watch and Code, and teaches the Practical JavaScript online course. His mission is to help beginners become developers through tutorials. Tune in!

On this week's episode of My JS Story, Charles Max Wood interviews Adam Baldwin. Adam is the team lead at Lift Security and founder and organizer of the Node Security Project (NSP). He appeared on episode 89, and talked about NSP in 2013. Learn more about what he's passionate about and how his life navigated towards programming. Tune in!

On today's episode, Charles, Aimee, and Cory discuss HTTP 2 with Surma. Alongside being part of the Chrome DevRel Team for Google, Surma works on different web app performance. He is also engaged in HTTP 2, interaction, UX, and spec work. Stay tuned to discover what HTTP 2 can do for you!

On this week's episode of My JS Story, Charles Max Wood interviews Bob Zeidman. Bob focuses on software forensics, but he also does consultations whenever he sells the intellectual property of a startup. He was on episode 238 and talked about intellectual property and software forensics. How did his life navigate towards programming? Tune in!

Join AJ, Aimee, and Joe as they discuss Mozilla Firefox Developer Tools with Jason Laster. Jason just started working at Mozilla since March. But even before that, he has been working on Chrome's dev tool extension called Marionette. That's when he discovered that the browser is an open source that anyone can play with. Now, he is working on a new debugger in Firefox. Tune in!

On today's episode, Charles Max Wood features My JS Story Aimee Knight. Aimee first appeared in episode 153, where talked about her career as a Junior Developer. She eventually became one of the awesome panelists of JavaScript Jabber. Tune in to learn about her journey in programming!

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!

On this week's episode of My JS Story, Charles Max Wood interviews Alex Russell. Alex is a software engineer on the Chrome team. He focuses on designing new features and running their standards work. He appeared as a guest on episode 87, where he talked about TC39. Tune in to his story!

JSJ 265 Wade Anderson and Ramya Rao on Visual Studio Code

This episode is live at the Microsoft Build 2017 with Charles Max Wood and AJ O’Neal. We have Wade Anderson and Ramya Rao from the Visual Studio Code Team at Microsoft. Tune in and learn more about what’s new with Visual Studio Code!

[00:01:20] – Introduction to Ramya Rao and Wade Anderson

Ramya Rao and Wade Anderson are in the Visual Studio Code Team at Microsoft.

Questions for Wade and Ramya

[00:02:00] – Elevator Pitch for Visual Studio Code

Our vision on Visual Studio Code is to take what was best out of the IDE world (Visual Studio, Eclipse, IntelliJ, etc.) and bring what was best from the lightweight editor world (Sublime Text, Notepad++, Atom) and merge those two together. We wanted the lightweight features from text editors and the debugging capabilities of Visual Studio and Eclipse. We did general availability last year. We’ve been stable for a year. Additionally, this is Visual Studio Code for Mac, Windows, or Linux. It’s also built in Electron.

[00:03:45] – What are your roles on the team? Do you have particular parts that each of you work on?

Wade’s title is a Program Manager. He does more non-developer things but Ramya is an engineer on the team so she gets a lot more coding that Wade does. Everybody has a key area to own but nothing stops them to go into another area. We try to share knowledge between people but we always have that one key owner that you always go to.

Ramya is a recent addition to the team. She started out maintaining the Go extension, maintaining and adding features. She’s slowly branching out to the Emmet features of the product.

[00:05:30] What is Emmet?

Emmet, or Zen Coding, is a must-have tool for you. You can write, say abbreviations and that expands to really huge HTML to update tags, rename tags, etc. That is one of the features of Emmet and Sergey actually wrote the library. We have an in built integration in the product. I [Ramya] am currently working on that.

[00:06:28] Does Visual Studio Code make it easy to go to the parts that I need to customize on an HTML?

In that case, we have a multi-cursor software in Visual Studio Code, as well. You could place your cursor in different positions, and then, simultaneously edit things.

[00:07:42] Is Emmet an extension or does it come with Visual Studio Code?

Right now, it’s in Built. If you want to know more about Emmet features, you can to emmet.io. That has all the documentation that you need to learn about Emmet features. In Visual Studio Code right now, we’re looking at making into an extension. We pull it out of the main code and maybe more people can contribute and make it even more better.

[00:08:21] – What’s new in Visual Studio Code?

One of our main pillars for this year is to improve performance of the product. We’ve grown a larger team so we’re adding a lot more features every month. Last few months has been, “How can we get some stability on the issues coming in while making sure we’re reducing our tech load?” We really keep to those core principles that we started with at the beginning, which was, we want a fast, lightweight editor.

We built a few extensions that we call key map extensions. They are just a mapping of key bindings that you learned in Sublime Text. You don’t have to re-learn any key bindings in Visual Studio Code.

We also build this Welcome page where you can flip through and see features really briefly. In that Welcome page, one of the key things is an interactive playground where you can play with existing code in different sections. Additionally, as we’ve mentioned, we also put multi-cursor features.

Another thing is workbench naming. You can change the theme of Visual Studio Code but it will be restricted to the editor and not the rest of the workbench.

[00:13:40] – Do you know how Xterm.js works as it was one of the features that you’ve added in Visual Studio Code?

Daniel’s another engineer that’s here with us today. He was the largest contributor to the Xterm.js project. He built the integrated terminal for Visual Studio code so I can’t speak to the internals of how that works.

[00:14:12] – Are we going to start seeing Visual Studio Code integrated into web experiences with other Microsoft products?

That’s actually where we started. We were Monaco editor where you get this cloud-based editing experience. We’re getting people to use it but we’re only getting people who were already using Microsoft products.  When electron came out, we saw an opportunity of, “Hey, can we port this  Monaco editor to Electron and we could then, run it on Mac and Linux.”

[00:19:45] – What are the performance things that you’ve done?

One thing that we did recently was adding an ability to calculate the start time for Visual Studio Code? That’s one of our full steps to get more information from the user-side. How can you get a profile of what things are running? Which part of the process took much time?

We also need to identify what are the things people are doing that’s causing the editor slow down. An example is when you open a large file and things get laggy.

Another exercise we did was we looked at all of our extension API’s to see which one of those could be a malicious extension.

The difference between VS Code and Atom is that, we ask questions like, “Are we using good data structures? Are we managing our memory properly? Are we removing stuff we don’t need anymore?” That just comes down to all those little things you learn from basic textbooks that have been around for decades about how to write good code. That’s what we have been doing and that’s what we’ll continue to try to do, to try and improve the performance.

[00:25:55] – Do you have problem on the desktop? Are all the modules just load at once?

We definitely don’t load everything at once. Different parts of the editor is loaded differently. When you do the Require, we don’t do it at first load. We do it when we notice that the user wants to use Emmet. We don’t try to load all the library at the beginning and delay the whole process.

We try to lazy load as much as possible, even the extensions. We have a separate process called extension host that takes care of loading all the extensions. Whether the extensions are completed loading or not, that does not stop you from typing in a file. Simple actions shouldn’t be bugged down by fancy actions.

[00:28:25] – What’s coming next for Visual Studio Code?

Every month, when we plan our iteration, we create iteration draft plan. We put it out there for people to see. Performance and helping people get started are probably the top two for us. You can look at github.com/Microsoft/vscode, look for the label ‘iteration plan draft.’ So that’s the current work that we’re doing that month.

Another feature is the multi-root workspace where you can open multiple folders. When you look at the issues and sort by most comments, multi-root is the number one. The second one that is little paper cuts around formatting and auto-intending – just things that make your code prettier.

Picks

AJ O’neal

• Breath on the Wild
• Microsoft’s Intelligent Edge

Charles Max Wood

• Boom Beach
• Bluetick.io
• Emacs key binding extension for Visual Studio Code

Wade Anderson

• Kindle Paperwhite
•  Twitter @waderyan_

Ramya Rao

• Open source
• Twitter @ramyanexus

My JS Story Justin Meyers

On this week’s episode of My JS Story, Charles Max Wood interviews Justin Meyers Co­founder and CEO of Bitovi, a Javascript consulting firm focused on simplifying Javascript development through the use and creation of open source tools as well general consulting, training, and web applications. He was on Episode 202 and talked about DoneJS and CanJS. Tune in to hear Justin’s full story!

7th Grade and a TI­82 [3:02]
Justin’s discovery of conditional statements and methods on a classic TI­82 was his first taste of programming. With a little guidance, he soon learned to program games on the TI­82 and then later moved onto bigger and better mediums like C and QBasic.

Grunt work is good for you. [4:51]
While studying Computer Science, Justin finds out that professors often have grunt work, and although they may not pay well now, sometimes they can in time lead to loads of experience and maybe even a bigger job. After 4 years of working on websites and writing documentation, he gets his first real job at Accenture.

Open Source and reducing waste. [6:23]
Accenture, while giving him a great chance to make some impressive projects, provoked Justin to see the efficiency in sharing code. Justin and a college friend get together to work on a project to build a platform that…builds. Although their project was unsuccessful, the tools they started to create for the project had plenty of potential.

The Last desperate gasp. AKA shaving his head. [9:40]
Justin talks about the Ajaxian blog and conference. Ten years ago, the Ajaxian blog was one of the best online resources for Javascript news. Justin was running low on funds and struggling and as his “last desperate gasp” he heads to the Ajaxian conference with his head shaved. Leaving only “Javascript MVC” shaped out of his hair. This stunt gets him remembered by many of the important attendees and also scores him his big break with a consulting job with T­-Mobile. Two to Three weeks later, Justin had a stroke. Justin talks about how incredible the timing was.

How Javascript MVC came to be. [13:23]
Justin talks about starting with JSJunction and modeling after it. Their first steps were to add a model layer as well as Event Delegation. Javascript MVC reflects some of Ruby on Rails. Justin worked with Peter Svensson from Dojo, with a methodology that at the time seemed crazy. Justin reminisces when Steve Jobs “Killed” Flash with HTML5 and CSS.

Bitovi begins. [17:24]
Justin talks about how the T­-Mobile job meant that he would need an official business. Originally dubbing it JupiterIT. Justin found that MVC was too encompassing and that programmers enjoyed a sense of creativity. By pulling Javascript MVC’s tools apart and creating single frameworks from the tools, Justin then created tools like CanJS and DoneJS.

Who does the heavy lifting at Bitovi? [20:48]
As the CEO of Bitovi, Justin has less time to program as before. Working with Open Source, development is a mix between contributors and full time employees. The majority being the employees. Justin talks about not having a sales force and focusing on their product to drive sales. Mainly, long term cost of ownership and the ability for the framework to last, working hard to make sure that clients that have committed to Javascript MVC years ago still have a relevant use for the framework.

Exploring HTTP2 and Push. [23:42]
With the emergence of HTTP2 and Push, Justin talks about working on and exploring different ways for streaming/server side rendering. Justin describes one of the experiments with building an empty skeletons, javascript assets, but also pushing instructions on how to mutate the page to the client. Before the javascript payload is fully loaded, the page starts to mutate. Allowing for optimal performance on slower connections, fantastic for mobile. Problems they are looking at for the future include things like different ways that CDNs can work with HTTP2 and Push. Justin has also worked with using Fetch to enable streaming by building tools around that. He suggests that HTTP2 and Push will maybe bring a renaissance in the developer world.

Justin’s side Parsing Project. [28:45]
Additional to his other work, Justin is working on a generic parsing project. Similar to BISON or JISON. Designed for simple parsing at faster speeds. He describes how to compiles to the code that parses your code. Working in runtime.

A way other companies can learn from Bitovi. [29:52]
We don’t know what the future is going to be for code, so packaging the framework into separate repos allows for better scheduling and a better way to manage long term. Updating a segment of a framework can sometimes break another segment if having it all happen together.

Picks [34:26]

Justin:

Dean Radcliff’s Antares Framework

Charles:

Boom Beach

Clash of Clans

BlueTick.io

Nimble

Keeping up with Justin’s work.

Bitovi.com’s Blog

Justin’s Twitter.

Sponsors

Cachefly.com
Newbie Remote Conf 2017

On today’s episode of JavaScript Jabber, Charles Max Wood and panelist Joe Eames chat with Rebecca Turner, tech lead for NPM, a popular Javascript package manager with the worlds largest software registry. Learn about the newly released NPM 5 including a few of the updated features. Stay tuned!

[1:58] Was the release of node JS 8 tied to NPM5?

• Features in NPM5 have been in planning for 2 years now.
• Planned on getting it out earlier this year.
• Node 8 was coming out and got pushed out a month.
• Putting NPM5 into Node 8 became doable.
• Pushed really hard to get NPM5 into Node 8 so that users would get NPM5 and updates to NPM5.

[2:58] Why would it matter? NPM doesn’t care right?

• Right you can use NPM5 with any version of node.
• Most people don’t update NPM, but upgrade Node.
• So releasing them together allowed for when people updated Node they would get NPM 5.

[3:29] How does the upgrade process work if you’re using NVM or some node version manager?

• Depends. Different approaches for each
• NVM gets a fresh copy of Node with new globals. NVM5 and Node 8 are bundled.
• For some, If you manually upgrade NVM you’ll always have to manually. It will keep the one you manually upgraded to.

[4:16] Why NPM 5?

• It’s night and day faster.
• 3 to 5 times speed up is not uncommon.
• Most package managers are slow.
• NPM 5 is still growing. Will get even faster.

[5:18] How did you make it faster?

• The NPM’s cache is old. It’s very slow. Appalling slow.
• Rewrote cache
• Saw huge performance gains

[5:49] What is the function of the cache?

• Cache makes it so you don’t have to reinstall modules from the internet.
• It has registry information too.
• It will now obey http headers for timing out cache.

[6:50] Other things that made it faster?

• Had a log file for a long time. It was called shrinkwrap.
• NPM 5 makes it default.
• Renamed it to packagelog.json
• Exactly like shrinkwrap package file seen before
• In combo with cache, it makes it really fast.
• Stores information about what the tree should look like and it’s general structure.
• It doesn’t have to go back and learn versions of packages.

[7:50] Can you turn the default Packagelog.json off?

• Yes. Just:
• Set packagelog=false in the npmrc

[8:01] Why make it default? Why wasn’t it default before?

• It Didn’t have it before. Shrinkwrap was added as a separate project enfolded in NPM and wasn’t core to the design of NPM.
• Most people would now benefit from it. Not many scenarios where you wouldn’t want one.
• Teams not using the same tools causes headaches and issues.

[9:38] Where does not having a lock show up as a problem?

• It records the versions of the packages installed and where NPM put them so that when you clone a project down you will have exactly the same versions across machines.
• Collaborators have the exact same version.
• Protects from issues after people introduce changes and patch releases.
• NPM being faster is just a bonus.
• Store the sha512 of the package that was installed in the glock file so that we can verify it when you install. It’s Bit for bit what you had previously.

[11:12] Could you solve that by setting the package version as the same version as the .Json file?

• No. That will lock down the versions of the modules that you install personally, not the dependancies, or transitive dependancies.
• Package log allows you to look into the head of the installer. This is what the install looks like.

[12:16] Defaulting the log file speed things up? How?

• It doesn’t have to figure out dependences or the tree which makes it faster.
• Shrinkwrap command is still there, it renames it to shrinkwrap but shrinkwrap cannot be published.
• For application level things or big libraries, using shrinkwrap to lock down versions is popular.

[13:42] You’ve Adopted specifications in a ROC process. When did you guys do that?

• Did it in January
• Have been using them internally for years. Inviting people into the process.
• Specifications
• Written in the form of “Here is the problem and here are the solutions.”
• Spec folder in NPM docs, things being added to that as they specify how things work.
• Spec tests have been great.

[14:59] The update adds new tools. Will there be new things in registry as well?

• Yes.
• Information about a package from registry, it returns document that has info about every version and package json data and full readme for every version.
• It gets very large.
• New API to request smaller version of that document.
• Reduces bandwidth, lower download size, makes it substantially faster.
• Used to be hashed with sha1, With this update it will be hashed with sha512 as well as sha1 for older clients.

[16:20] Will you be stopping support for older versions?

• LTS version of NPM was a thing for a while. They stopped doing that.
• Two models, people either use whatever version came with Node or they update to the latest.
• The NPM team is really small. Hard to maintain old NPM branches.
• Supports current versions and that’s pretty much it.
• If there are big problems they will fix old versions. Patches , etc.

[17:36] Will there ever be problems with that?

• Older versions should continue to work. Shouldn’t break any of that.
• Can’t upgrade from 0.8.
• It does break with different Node version
• Does not support Node versions 0.10 or 0.12.

[18:47] How do you upgrade to NPM?

• sudo npm install -gmpm
• Yes, you may not need sudo. depend on what you’re on.

[19:07] How long has it been since version 4?

• Last October is when it came out.

[19:24] Do you already have plans for version 6?

• Yes!
• More releases than before coming up.
• Finally deprecating old features that are only used in a few packages out of the whole registry.
• Running tests on getting rid of things.

[20:50] Self healing cache. What is it and why do we want it?

• Users are sometimes showing up where installs are broken and tarbols are corrupted.
• This happens sometimes with complicated containerization setups makes it more likely. It’s unclear where the problem actually is.
• CaCache - content addressable cache. Take the hash of your package and use it to look up address to look it up in the cache.
• Compares the Tarbol using an address to look it up in the cache.
• Compares to see if it’s old. Trashes old and downloads updated one.
• Came out with the cache. Free side effect of the new cache.

[23:14] New information output as part of the update?

• NPM has always gave back you the tree from what you just installed.
• Now, trees can be larger and displaying that much information is not useful.
• User patch - gives you specifically what you asked for.
• Information it shows will be something like: “I installed 50 items, updated 7, deleted 2.”

[24:23] Did you personally put that together?

• Yes, threw it together and then got feedback from users and went with it.
• Often unplanned features will get made and will be thrown out to get feedback.
• Another new things ls output now shows you modules that were deduped. Shows logical tree and it’s relationships and what was deduped.

[25:27] You came up to node 4 syntax. Why not go to node 8?

• To allow people with just node 4 be able to use NPM.
• Many projects still run Node 4. Once a project has been deployed, people generally don’t touch it.

[26:20] Other new features? What about the File Specifier?

• File specifier is new. File paths can be in package json, usually put inside pointing to something inside your package.
• It will copy from there to your node modules.
• Just a node module symlink.
• Much faster. Verifiable that what’s in your node modules matches the source. If it’s pointing at the right place it’s correct. If not, then it’s not.
• Earlier, sometimes it was hard to tell.

[27:38] Anything else as part of the NPM 5 release? Who do you think will be most affected by it?

• For the most part, people notice three things:
• 1st. no giant tree at the end
• 2nd. Much faster
• 3rd. Package lock.

[28:14] If it’s locked, how do you update it?

• Run npm installer and then npm update
• Used to be scary, but works well now.
• Updates to latest semver, matches semver to package json to all node modules.
• Updates package lock at the same time
• Summary in Git shows what’s changed.

[28:59] Did Yarn come into play with your decisions with this release?

• The plans have been in play for a long time for this update.
• Yarn’s inclusion of similar features and the feedback was an indicator that some of the features were valuable.

[29:53] Other plans to incorporate features similar to yarn?

• Features are already pretty close.
• There are other alternative package managers out there.
• PMPM interesting because when it installs it doesn’t copy all the files. It creates hard links.

[30:28] Does PMPM and Yarn use NPM registry?

• Yes! Other than CNPM. The NPM client used in China.
• CNPM Registry mirror behind firewall. Have their own client to their registry. Their registry is a copy of ours.

[31:15] What about RNPM?

• I wouldn’t be surprised.

[31:45] “Won’t you come and say something controversial about your competitor?”

• We all want it to be collaborative.
• When we were writing our new cache, we also helped Yarn with their cache and sped things up tremendously.

Picks

Charles

Rush Limbaugh’s children’s books
Tinker Crate
Kiwi Crate
NPM
Episodes on My JS Story.

Joe

Gravity Falls
Board Games

Rebecca

NPX

Funstream

Links to keep up with NPM and Rebecca

Twitter @rebeccaorg
NPMjS on Twitter
blog.npmjs.com

My JS Story Cory House

On this Episode we have another JS Story, and this time it’s with Cory House, a Pluralsight author, software architect for Cox Automotive, and a consultant with a focus on React. Listen to Charles Max Wood and Cory discuss a bit about how Cory got into programming, how learning how to learn is vital to being a talented developer, as well as using documentation as your development environment to ensure your code’s documentation doesn’t fall behind. This and more right here. Stay tuned.

How did you get into programming?

Cory starts his story as a business major in college but had interest in computers. He spent time around various computers and machines, giving him experience in various operating systems and platforms. On any given day he would be using any of three different operating systems. His interest in computers inspired him to double major. He started learning Cobalt and Visual Basic and C++. He talks about being interested in web development, including Flash. He specialized in Flash throughout college, as well as early on in his software development career. He also talks a bit about that the open web seems to innovate in a way that keeps it relevant. He talks about using Flash to make websites with entering screens and animations and now that is obsolete. Charles mentions that it’s interesting that his main interest was business and computers became something he was interested in later on and that you don’t have to be someone who started young to be proficient. Cory talks about being driven to catch up, being around people who knew things off the top of their head while he was still asking questions and looking things up.

Learning How to Learn

Out of college Cory found that he had a degree, but what he had really learned was how to learn. He never used Cobalt, C ++, or visual basic after school. Learning how to learn combined with being able to create a focus on a specific technology are vital. Charles adds that he would hear often that it took being a natural in programming to get it, and that maybe being a natural was really just being someone who has learned how to learn and to focus.

Getting Good With Your Craft

Cory mentions that working with someone who head and shoulders ahead of everyone else. They were working in Unix and seemed to know every single Unix command and flag. He found it inspiring to see someone take the craft so seriously and to learn a specific technologies tool with so much dedication. Some technologies will be so important that they will be key technologies that will still be useful many years later. Cory suggests that one of those tools seem to be JavaScript. JavaScript is almost mandatory in frontend web development. Additionally, JavaScript is reaching into other new technology types including IoT and VR and other places, constantly expanding.

How did you get into JavaScript?

Cory talks about how it really all got started when Steve Jobs killed Flash. He opened his mind to other technologies and started working with JavaScript. Remembering learning jQuery, he found himself really enjoying it. He started building online business applications. Browser inconsistencies were a huge issue, making it so that you’d have to check your work on each browser to make sure it worked cross platform. Things are moving so quickly that being a full stack developer is becoming less and less prevalent, to the point where he considers himself primarily a JavaScript developer. Being an expert in a single technology can make you really valuable. Companies are running into issues with not finding enough people that are experts in a single tech. Cory suggests that employers should find employees that seem interested and help allow them to focus and learn whatever that tech is. Charles talks about the split between developers that tend to lean full stack and plug in technologies when they need it versus developers that work exclusively in front end. He suggests it may be a case by case situation.

Service Oriented Architecture

Cory suggests that service oriented architecture movement has moved us that way. Once you have a set of services set up, it becomes more realistic to turn on the front end. If there were a good set of services there, Cory adds that he doesn’t think he would be able to build services faster using a server side framework like Rails, Django, or ASP.Net MVC than he could in React today using something like create React app. The front end has become much more mature. Cory mentions that he has had good experiences with ASP.Net NPC and Visual Basic being a Microsoft stack developer. He adds that he doesn’t feel like he has given up anything working with JavaScript. He adds that with the nesting of different models together, he gets to reuse a lot of code in server side development. NPM makes it easy to stand up a new package. If you are planning to create an API, it becomes much harder to use a server side rendering stack, with so many APIs available, it’s a logical move to go client side.

Possible Future for Front-end and Back-end Roles

Charles brings up that the development of things like VR are making changes in the roles that front end and back end development play. The front end will more to taking care of the overall application development of apps, while the back end will become supporting roles as services and APIs. New technology like VR and artificial intelligence will need a high amount of computing power on the backend. The front end will focus more on the overall experience, display, and the way we react with things. Charles talks about how the web may move away from being just an HTML platform. He says that it will be interesting to find where JavaScript and frameworks like React will fall into this shift into this next generation. We already are seeing some of this with the capabilities with canvases, WebVR, and SVG and how they are changing how we experience the web.

Reasonable Component Story

Cory brings up being interested in the Reasonable component story. Sharing code from a traditional web app, to a native app, and to potentially a VR app as well is exciting and he hopes to see it flesh out more in the coming years. He talks about going to conferences and how much we have built and how much we don’t have easily sharable innovation. He hopes to see it solved in the next few years.

What contributions have you made to the JavaScript community?

Cory mentions working on the open source project Slingshot. He was trying to solve issues that many found in React. React isn’t very opinionated. React is for writing reasonable components for the web, but it doesn’t have opinions on how you structure your files, how you minify, bundle, deploy, or make API calls, etc. He realized that telling people to use React and to deal with those issues wasn’t reasonable. He created React Slingshot as a development boilerplate. He put it to use in many applications and it became popular. It’s easy because it did things like allow you to run NPM to pull independencies and pull a file, it would fire up a web browser, watch your files, run tests, hot reloading on save, and had a running Redux application build it. It allowed people to get started very quickly. He talks about how he wasn’t the only person trying to solve this issue. He says that if you look now there are well over one hundred boiler plates for React that do similar things. Most popular being Create React App. Contributions outside of this, he talks about editing documentation on open source projects being part of his biggest contribution, writing it in markdown and then making pull requests.

What are you working on now?

Cory adds that he just finished his 7th or 8th Pluralsight course on creating usable React components. At work they create their own reusable React component library. He says that he realizes that it’s a complicated process, where all decisions you make, in order to have a reusable component story, you have to make a lot of decisions. Things like how granular to make the components, reusable styles and how they are packaged, how they are hosted, will it be open or source, etc.

Publicly Closed - Internally Open Source Projects

Cory talks about the idea of having it as a closed source project, but treating it like an internal open source project for the company, having many people feel invested into the project. He found creating the documentation story was the toughest part. Having solid documentation story that helps with showing how to use the components and it’s features and behaviors. He spends much of his type looking at other documents to help him come up with ways to create his own. He talks about generating the documents automatically with the updates so that they are always in sync. Charles adds that documentation syncing often happens right in the comments, which are also acceptable to being outdated.

Pull-request-Template.md

Cory adds that a useful way to allow for well documented and safe pull requests is to make a pull request template in GitHub by creating a file called pull-request-template.md so that any time someone makes a pull request, that .md template will populate the pull request. Cory has a checklist for a pull request like making sure there are tests for any new components, the file name should have an uppercase character, is there a ticket open, etc. All of the basic things that should happen in a pull will be in the pull-request-template.md. Charles adds that documentation is one of the things that gets ignored. Having a standard process is very important, more so than getting the job done faster. Also having an outlined expectation for how it’s delivered is important as well.

Documentation as Development Environment

A useful trick that Cory uses, is using the documentation as the development environment. Anytime they are working on a new component, they start with a documentation site, making changes within the documentation and then it hot loading your changes live. This way your documentation is front of mind and keeps the documentation fall behind.

Why React instead of the other frameworks?

Cory says that he can sum up React in a single sentence. He says that your HTML sits right in the JavaScript. Which usually sounds bad to a large group of developers. He expects people to react negatively when he talks about it. What he has run into as a common problem, is people separating concerns by filetype and technology, but with React he seems the common problems in terms of components. Cory says that components are the future. Industries that have matured utilize components. For example car manufacturers or even electronic manufactures build things in modules and components. Things that are reusable should be encapsulated into a component instead of trying to hold it in our heads. This makes it so things look the same and reduces many mistakes. You can create components in different frameworks, but React co-mingles markup and javascript with something like JSX. You’re not writing HTML, you’re writing JSX that boils down to HTML. That one element is fundamentally what makes React easier to Cory. For the most part, React can be learned by JavaScript developers in less than a day because many of the things you need to do in React, is just basic JavaScript. Charles adds that components are a concept coming up in various frameworks and is becoming more popular.

Picks

Cory’s

Cory’s React Courses on Pluralsight Essentialism the book

Charles’

Get a Better Job Course Angular Remote Conf (now Ruby Dev Summit) React Podcast Kickstarter

Links

Cory’s Twitter

JSJ 267 Node 8 with Mikeal Rogers, Arunesh Chandra, and Anna Henningsen

On today’s episode of JavaScript Jabber we have panelists Joe Eames, AJ O’Neil, Amiee Knight and Charles Max Wood and we are talking about Node 8. To help us we have special guests Mikeal Rodgers, Arunesh Chandra, and Anna Henningsen. It’s going to be a great show. Tune in.

[1:56] Is Node 8 just an update or is there more?

• More than just an update
• Two main points:
• Improved Prana support
• Native API
• Native APIs are helpful for Native Add-ons. For both the consumer and the developer side.
• Prior to update these Node Native modules ran in C++ and bound to specific to Node 8 APIs.
• Causes these modules to be updated or reconciled every time these modules are rereleased.
• Creates burden for module maintainers.
• Creates friction in upgrading Node versions in production departments.
• If you have a deployment depending on a certain Native module, some of the modules may not get updated in time when updating your Node versions. Keeping people from updating Node.
• Creates compatibility issues with Node users not using Node 8
• Experimental support for a Native layer in Node 8 to eliminate these issues as much as possible.
• Important milestone for the module ecosystem.
• You can write extensions for Node in C++ and it decouples V8 so you can use something else on the front.
• Modules takes dependency on V8 API specific to a particular version. So if V8 changes your module will be extracted from that.
• As a side benefit, you can have another VM to take advantage of that.
• Major version upgrades mean updating Native modules and usually some of those modules haven’t updated to the newest version of Node and be complicated.
• Deep dependency wise, about 30% depends on a Native module somewhere
• In the future, with the Native API, you’ll be able to update Node without breaking modules.

[5:51] What kind of work went into this?

• Most of the work was in C++
• First thing that was done was, they looked at the top dependent Native modules in the ecosystem.
• Looked for what kind of V8 exposure they had and cataloged it
• Looked at how these APIs and what their purposes were
• Looked for a way to extract them so that they are part of Node Core
• Created neutral APIs, now part of the Node core.
• All C APIs
• Also has a C++ wrapper to improves usability of the API.

[7:17] What’s an example of what you can do with these APIs?

• Native modules allows for tighter integration and better module performance
• Specific APIs that you can use in V8 that isn’t available through JavaScript
• If you have a C++ variable code and you want to expose a variable into JavaScript, that is V8 API note a Node 8 API
• Having it bound directly to the VM was something they wanted for a long time
• Google controls V8 and they bind to V8
• Created a better relationship with Google starting in IOJS
• Also worked with Microsoft with their Node Shocker work.
• Same with SpiderMonkey
• SpiderNode is in the works

[9:23] Have you guys done any testing for performance?

• Some. There is a performance working group.
• There is a need to stay on top of V8
• V8 team has focused on new language features
• Many features have been added over the years
• Many didn’t come in optimized
• The performance profile has changed with these features
• If you’re using new language features, you will see a performance boost
• In core, still tracking down code that was specific to the old optimizer and rewriting i to work the new optimizer
• Turbo C compiler hasn’t landed yet, but is to come.
• Will have a completely different performance profile
• In most real world applications it will be faster
• Waiting on the release to take a version of V8 to make it easier to upgrade features in the future

[11:28] Are the new features picked up from V8 or implemented in Node?

• It’s all in V8
• Better longterm support
• Promises are made better in Node as a platform
• Added new method called util.promisify()
• Implementation comes from V8
• Allows for more optimization for promises in Node core
• Promise support for the one-deprecated domains module.

[13:02] Is there anything more than NMP 5?

• First off, delete your NMP cache.
• It’s in your home directory usually with a .npm extension

[14:09] What are the new features in V8?

• Unlimited heap sizes, previously had a 4gb limit. No fixed limit.

[14:09] Will you see things like chakra come out tuned for servers?

• Profiles of a server for application process are getting smaller
• Getting cut into containers and VMs and micro services
• Vms that have cold boot time and run quickly in a strained environment is looking more like what we will see in the future
• Yes, especially if you’re using cloud functions
• V8 is optimized for phones, but Chakra is even more so
• Looking for opportunities for VMs can be solely optimized for a device target
• Node take advantage of that VM
• VM neutrality is an interesting concept
• VM Vendors trying to optimize it based on workloads of a server
• Opens opportunities for Node
• Node Chakra has been proved to iOS. You can cut off jitting off which was a requirement to be able to be in the Apple App Store
• Node is not just for servers anymore
• Node doesn’t take a long time configuring it
• When a developer runs code on an IoT or a mobile app they don’t control the VM that is bundled, they run it on top of Node and it just works.
• VM neutrality gives a new vector, so you can swam a whole different VM

[18:44] When running different engines like iOS vs Android, does the profile change?

• What it comes down to is if it’s eventive programming
• The browser is an eventive environment, is very efficient waiting for things to happen before it does something
• The way that we program servers and nodes are the same as well
• the basics are the same generally
• environmental differences exist but the programming model is usually the same
• What does impact it is memory and processor and hardware and things like that
• That is where tuning the VM comes into play

[20:29] What is the new Async Hooks API used for?

• Node has been lacking for automated inspection of Async Hook
• No way for Node to tell you when scheduling and beginning of an Async operation. Hook helps with that
• it’s a way for developers to write debugging features
• Node tells the application that it’s working with Asynchronous way.
• The embedded inspector has been embedded since Node 6
• Now has a JavaScript API to use it
• You can use things like Chrome debugger inside the running node process
• Old debugging protocol has been removed
• VM.run is still there but in the process of being deprecated

[22:34] How like is the experimental Node API will change?

• Marked as experimental because it’s the first time in the open
• Hopefully out of experimental soon
• Soon can port API to the existing LTS
• Looking for more people to participate with the new API and give feedback
• Fix any concerns before it goes to LTS
• Some other experimental things are in the works like ASync Hooks and how it interacts with promises
• Renaming some features
• Another new feature - serializer and deserializer that comes with V8
• experimental but will most likely stay

[25:31] what is your standard for going to LTS?

• Major releases every 6 months
• Next Oct Node 9 will come out and then Node 8 will be LTS
• Documentation, updates, additions etc will be ready then
• Plan to do it for 2.5 years
• Every even releases come out to LTS as the odd release comes out
• Helps keeps a current line while having something new in the release line
• Node 6 is the current LTS version

[27:26] What are you taking out or deprecating in Node 8?

• Use the word deprecate sparingly
• If many people use features, it’s hard to get rid of
• Security issue with Buffer, constructor argument was ambiguous
• Had added APIs that were more explicit over time and pushed those
• Now it will be deprecated

[28:43] 21% - 33% Performance increase with some Node updates

• Someone online updated their React app to Node 8 and found an 21% - 33% increase
• Benchmarking group tests to make sure things are getting faster
• V8 is always getting faster as well
• Code changes fast and so there is a chance performance slows down so they have people to check
• Benchmark test are all automated by a team

[30:47] Is it safe to just switch to Node 8?

• For front-end, yes
• clear your NPM cache
• Back use cases will usually wait until LTS

[31:28] Where any of the features hard to implement?

• The API work took about a year
• It was a collaboration which made it interesting
• IBM, Intel, Google were involved
• The collaboration took a while
• Also Async hooks took at least a year.
• Async hooks used to be called async wraps and has been in the work for almost 3 years
• many of the changes were the accumulation of small chances

[33:07] It’s the little things

• Letting people get small changes in accumulate into a big difference
• the product gets much better that way

[33:57] What versions of Node are you actively updating?

• Current releases of Node 8 for a half of year
• Node 6 is LTS
• Additional year of maintenance of previous LTSs.
• Schedule is at http://github.com/node8js/lts in a chart
• Support for Node 4 with only critical updates, Node 6 minor updates, and Node 8
• Node 7 doesn’t get much support unless it’s vital security supports.
• If you’re running 0.10 or 0.12 stop. Those do not get security fixes anymore

[35:42] Where do you see things going from here?

• Mostly still working out Async hooks
• Maybe add some web worker or worker support for Node JS
• ES module support
• Working to make promises better
• Working on the performance profile and internal systems

[20:29] What is the adoption like of Node 8?

• Node team gets better at getting people to adopt quickly
• but about 5% - 6% will not upgrade
• community doubles each year at 8 million users right now
• Here is a graph on Twitter posted by NPM
• Limiting breaks and softly deprecating things makes it’s easier to upgrade

[40:11] How can people contribute and get involved?

• NodeToDo.org shows how to make contribution
• Occasionally major conferences have information on how to contribute
• Test it out and help make it stronger

[42:08] If people install Node 8 and have issues what can they do?

• If it’s an NPM problem check with them
• clear cache!
• install newest version with: npm install -g npm@latest
• Report problems to either NPM or Node
• If you’re not sure where the problem is, check github.com/nodejs/help

Links

Node8 Node’s Twitter Node’s Medium Node Evangelism Group

Mikael on Twitter and GitHub Arunesh on Twitter Anna on Twitter

Picks

AJ

Overclocked Remix Super Mario RPG Window to The Stars

Amiee

Blogpost RisingStack on Node 8
2 Frugal Dudes

Charles

Homeland
House of Cards

Joe

Shimmer Lake

Mikael

Blake2b-wasm

Aremesh

Current Nightly News

My JS Story 023 Laurie Voss

This week we have another My JavaScript story. This week’s guest is Laurie Voss. Laurie has worked with NPM from the start and has been a vital piece to getting it off the ground. Hear how Laurie got interested in computers, how Laurie got started with NPM, as well as a few things about the newly released NPM 5.

How did you get into programming?

Laurie started by going into a computer camp, at the time Laurie hadn’t spent time around computers, and it wouldn’t be until the second time that he went to the computer camp that he would see a computer again. Laurie grew up in Trinidad where not many people could afford computers. He started making his first website in Angelfire using HTML before CSS became a thing.

How did you go from web development to hardcore Javascript?

Laurie had been writing JavaScript since it was invented. Laurie started a web development company in high school using JavaScript. Laurie met Issac while working at Yahoo and he introduced Laurie to Node which was a starting point to taking JavaScript more seriously for Laurie. When Node was ready in 2013, NPM Inc was on it’s way.

What do you do at NPM Inc?

IN the beginning of 2014, Laurie was doing a lot of the JavaScript and was the CTO. Laurie says that part of his strategy has always been to hire JavaScript developers that are better at writing JavaScript that he is. Making him the worst JavaScript programmer at NPM. Laurie’s main job was doing what was needed to get NPM happen, including talking to layers and the business side of things. There are many companies that don’t understand how open source works, and in many cases it leads to run ins with lawyers. Many times NPM acts as an umbrella for open source tools that aren’t able to fight overzealous corporations.

What do you think is your biggest contributions to NPM?

Laurie expresses that it has changed over the years. A year ago he would say that he would have to say it leans towards the piece of software that is the registry. It’s very scalable and has worked great for small scale up to very large scale. Laurie works hard to gather funds and help make NPM grow as well as be scalable. He says that he is very proud that he build something that let’s others build things.

How did you get involved?

Laurie has been with NPM since the beginning. He tells us how Issac had been running NPM on donated hardware in spare time while working with Node. NPM would break a lot and be down due to the borrowed equipment. They decided that they needed to create a business model around NPM to help it grow. Laurie had just finished working on a startup and knew how to get funding and got their first round in 2014.

How did you get to being profitable?

Laurie talks about making sure that their plan is in line with their customers. NPM could easily charge for many parts of NPM but they would rather charge for things that make sense to charge, so in this case the private packages. Enough people are using the private package to getting NPM to profitability. Laurie says that even if money stopped coming in they would have to git rid of a few employees but would be able to keep a small team and sustain the NPM registry, but would never build anything new. It’s always between being profitable or using money to build new things.

What are you working on now?

NPM 5 was just released and it’s much faster, five times faster. Laurie talks about being excited about the team and what they are putting into it. Things like making deployments easier. Many developers use NPM to put code together as well as to deploy it. If you didn’t have a lock file, it’s possible that it would change. But the lock file can take a long time, and you already know what needs to go there so they are adding npm store and npm fetch making deploys much faster. Additionally they will be adding a feature called insights. They are able to see information about different users packages, security information, performance information, etc. They can use that information to help developers with suggestions based off of data gathered by what other people are doing. Charles adds that it would be great for coming up with topics for the podcast.

Anything else?

Laurie reminds everyone about NPM Organizations as well as NPM Enterprise. NPM Organizations is a way to organize packaging as well as teams of developers and helps you to collaborate. NPM Enterprise allows for single sign on support, license auditing, and features that corporations care about.

Picks

Laurie

Zite and NextJS
Slides.com

Charles

VMWorld
Tweet or email if you’re looking at resources for learning VR AI or Iot

Links

Twitter
NPM Organizations
NPM Enterprise

JSJ 268 Building Microsoft Office Extensions with Javascript with Tristan Davis and Sean Laberee

This episode is live at the Microsoft Build 2017 with Charles Max Wood and AJ O’Neal. We have Tristan Davis and Sean Laberee from the Office Team at Microsoft. Tune in and learn more about what’s new with Microsoft Office Extensions!

[00:01:25] – Introduction to Tristan Davis and Sean Laberee

Tristan Davis and Sean Laberee are Program Managers on the Microsoft Office team, focused on Extensibility.

Questions for Tristan and Sean

[00:01:45] – Extending Office functionality with Javascript

Office isn’t just an application on Windows that runs on your PC. It is running on iPhone, iPad, Android tablet, and apps on the browser with Office Online. The team needs a new platform, add-ins, which allow you to build apps that run across all places. It’s HTML and Javascript. HTML for all the UI and a series of Javascript module calls for the document properties. Sometimes we call it OfficeJS.

[00:03:20] – This works on any version of Office?

It works on Office on Windows, Mac, Online and iPad.

[00:03:55] – HTML and CSS suck on mobile?

There are things that you’re going to want to do when you know you’re running on a mobile device. If you look at an add-in running on Outlook for iPhone, the developer does a lot of things to make that feel like part of the iPhone UI. Tristan believes that you could build a great add-in for Office using HTML and JavaScript.

[00:05:20] – Are these apps written with JavaScript or you have a Native with WebView?

Office itself is Native. All of it is Native code but the platform is very much web. The main piece of it is pointing at the URL. Just go load that URL. And then, you can also call functions in your JavaScript.

[00:06:35] – Why would you do this? How does it work?

The add-in platform is a way to help developers turn Word, Excel and PowerPoint into the apps that actually solve user’s business problems. The team will give you the tools with HTML and JavaScript to go and pop into the Word UI and the API’s that let you go manipulate the paragraph and texts inside of Word. Or in Excel, you might want to create custom formulas or visualizations. The team also let people use D3 to generate their own Excel charts.

And developers want to extend Office because it’s where a lot of business workers spend their days 0 in Outlook, Teams, Word, Excel.

[00:10:00] – How did this get delivered to them?

There are 2 ways to get this delivered. One, there’s an Office Store. Second, if you go into Word, Excel, and PowerPoint, there’s a store button and you can see tons of integrations with partners.

For enterprises, IT can deploy add-ins to the users’ desktops without having stress about deploying MSI’s and other software deployments that the web completely rids off. The add-ins make a whole lot of pain the past completely go away.

[00:11:00] – Everybody in the company can use a particular plug-in by distributing it with Office?

That’s right. You can go to Office 365 add-in experience. Here’s the add-in and you can to specific people or everyone who’s part of a group.

For the developer’s perspective, if you have the add-in deployed to your client, you could actually push updates to the web service and your users get the updates instantly. It’s a lot faster turn-around model.

[00:14:20] – What about conversations or bot integrations?

There’s the idea of connectors at Teams. You can subscribe to this web book and it’ll publish JSON. When the JSON is received, a new conversation inside of Teams or Outlook will be created. For example, every time someone posts on Stack Overflow with one of the tags that team cares about, it posts on Outlook.

It’s a great way to bring all the stuff. Rather than have 20 different apps that are shooting 20 different sets of notifications, it’s just all conversations in email, making do all the standard email things.

And in the connector case, it’s a push model. The user could choose what notifications they want.

You’d also learn things like bots. You can have bots in Teams and Skype. The users can interact with them with their natural language.

[00:18:40] – How about authentication?

As long as you’re signed into Office, you can call JavaScript API to give you an identity token for the sign in user and it will hand you a JWT back. That’s coming from Azure Active Directory or from whatever customer directory service. That’s standard.

If you want to do more, you can take that identity token and you can exchange that for a token that can call Microsoft graph. This app wants to get access to phone, are you okay with that? Assuming the user says yes, the user gets a token that can go and grab whatever data he wants from the back-end.

[00:20:00] – Where does it store the token?

That’s up to the developer to decide how they want to handle that but there are facilities that make sure you can pop up a dialog box and you can go to the LO-flow. You could theoretically cache it in the browser or a cookie. Or whatever people think is more appropriate for the scenario.

[00:20:55] – What does the API actually look like from JavaScript?

If you’re familiar with Excel UI, you can look at Excel API. It’s workbook.worksheets.getItem() and you can pass the name of the worksheet. It can also pass the index of the worksheet.

[00:22:30] – What’s the process of getting setup?

There’s a variety of options. You can download Office, write XML manifest, and take a sample, and then, side loads it into Office. You can also do that through web apps. There’s no install required because you can go work against Office Online. In the Insert menu, there’s a way to configure your add-ins. There’s upload a manifest there and you can just upload the XML. That’s going to work against whatever web server you have set up.

So it’s either on your local machine or up in the cloud. It’s as much as like regular web development. Just bring your own tools.

[00:24:15] – How do you protect me as a plug-in developer?

There’s an access add-in that will ask your permission to access, say, a document. Assume, they say yes, pipes are opened and they can just go talk to those things. But the team also tries to sandbox it by iframes. It’s not one page that has everybody’s plug-ins intermingle that people can pole at other people’s stuff.

[00:27:20] – How do you support backward compatibility?

There are cases where we change the behavior of the API. Every API is gated by requirement set. So if a developer needs access to a requirement set, he gets an aggregate instead of API’s that he can work with but it isn’t fixed forever.

But it’s not at that point yet where we end up to remove things completely. In Office JS, we’ve talked about API’s as one JavaScript library but really, it’s a bootstrap that brings in a bunch of other pieces that you need.

[00:30:00] – How does that work on mobile? Do they have to approve download for all components?

You can download components by using the browser that the operating system gives. It’s another one of the virtues of being based on the web. Every platform that has a web browser can have JavaScript execution run-time. It allows for the way that their app guidelines are written.

[00:33:15] – How about testing?

It’s a place where there’s still have work to do. There’s a bunch of open-source projects that partners have started to do that. What they’ve done is they’ve built a testing library. Whatever the mock is, it's just a thing on Github. It is open-source friendly. So the team could be able to contribute to it. “Here’s an interesting test case for this API. I want to make sure that it behaves like this.

[00:35:50] – Could you write it with any version for JavaScript e.g. TypeScript?

A Huge chunk of the team is big TypeScript fans. They’ve done a lot of work to make sure that TypeScript experience is excellence.

Type is basically a collection of typing files for TypeScript. There’s a runtime process that parses your TypeScript, gives you feedback on your code, and checks for errors. You can also run it in the background.

There’s an add-in called Script Lab. Script Lab is literally, you hit the code button and you get a web IDE right there. You can go start typing JavaScript code, play with API’s, and uses TypeScript by default. It’ll just actually load your code in the browser, executes, and you can start watching.

[00:39:25] – Are there any limitations on which JavaScript libraries you can pull in?

There a no limitations in place right now. There are partners that use Angular. There are partners that are big React fans. If you’re a web dev, you can bring whatever preferences around frameworks, around tools, around TypeScript versus JavaScript.

[00:45:20] – What’s the craziest thing you’ve seen done with this API?

Battleship was pretty cool. There’s also Star Wars entering credits theme for PowerPoint.

[00:46:40] – If a developer is building a plug-in and get paid for it, does Microsoft take credit for that?

There are 2 ways that folks can do it. You can do paid add-ins to the store. Either you do the standard perpetual 99 cents or you can do subscriptions, where it’s $2.99/month. Tristan encourages that model because integrations are just a piece of some larger piece of software.

But Microsoft is not in the business of trying to get you to pay me a little bit of 10 cents a dollar. It’s really in the business of making sure that you can integrate with Office as quickly as possibly can.

When the users go to the store, they can use the same Microsoft account that you use to buy Xbox games or movies in the Xbox, Windows apps in the Windows store.

[00:52:00] – The App Model

If folks are interested in the app model, they should go to dev.office.com to learn more about it because that’s where all the documentation is. Check out our Github. Right there in the open, there’s the spec. Literally, the engineers who are coding the product are reading the same marked-down files in the same repo that you, as a developer, can come and look at. And you can comment. You can add issues like you could have a dialogue with that PM. Under the OfficeDev, you’ll find a tunnel repository that contains samples. Our docs are there.

Picks

AJ O'Neal

• Lithium

Charles Max Wood

• Miracle Morning by Hal Erod
• Clean Code by Uncle Bob Martin
• Ketogenic diet

Tristan Davis

• Amazon Echo
• Microbiome

Sean Laberee

• Running
• Garmin watch

MJS 024 Aaron Frost

This episode can double as a My JavaScript Story and a My Angular Story and features Aaron Frost. Aaron has been on both JavaScript Jabber and Adventures in Angular. He has been a principal engineer for four years and recently organized his fourth NG-Conf.

How did you get into programming?

Aaron was working as a loan officer when he decided he needed a new career. He went to work at an accounting support phone center. There he discovered he was good at Sequel. He tried out for the QA team; the UA automation made sense to him. He became a senior QA and in 2010 jumped to working in development full time. He knew JavaScript; which made everyone wanted to hire him. He learned JQuery too.

What was it about JavaScript that really got you excited about it?

In Utah when he was working for a company, he had never learned JavaScript; he was told he had to learn jQuery to do browser extensions. The first night he learned jQuery he decided he loved the language. He stuck with it for three to four months. After that, he learned actual JavaScript. He explains that it just “fits in his head,” and made him feel well equipped and powerful.

How do you get to Angular?

He worked for a big, local corporation in Utah with powerful developers. The JavaScript community was strong there. They used Backbone and one day he emailed the developers. He suggested they Angular. One of the developers asked Aaron to help with the conversion. They were writing less code in Angular than in Backbone. It saved time.

Sometime after that, his friend Kip Lawrence suggested that they go to an Angular Conference. When they looked up conferences they couldn’t find any. They decided to start their own Angular conference after that.

How do you become a GDE?

There is a GDE app where you nominate yourself. In order to be picked, you have to meet a lot of criteria. You have to answer a lot of questions. There are things they want you to have done to prove you stand out and are a leader in the community. They want more than someone who is just smart. They want people who have presented at conferences, made open source contributions, written books, etc.

What else have you done in JavaScript or Angular?

One of the very first projects Aaron did is one that he considers one of the coolest. He built a browser extension for his twin brother’s real estate website that solved a captcha. He then marketed it to other people. He believes it is one of the most fun problems to solve.

What are you working on these days?                      

Aaron has a side project, which is a remote communication app for remote workers to use. He is working on how to make the NG-Conf bigger and better each year. He is also spending time being a dad.

Is there an overarching thing you’ve learned over the last 7 or so years of programming?

The thing that keeps recurring is that there is a need for engineers to focus on solving problems for users and less on having perfect code. He has noticed that developers make decisions to try to make perfect code that can sink a company. Developers should be more business focused than tech problems. It is more responsible for making a business profitable. Solve problems for the user first and don’t try to replace a language that’s working.

Picks

Aaron:

• Superpowers https://www.amazon.com/gp/bookseries/B00YU1C4ZY/ref=dp_st_0141321342
• Yarn www.yarnpkg.com
• Samsung SmartThings  www.smartthings.com

Charles:

• Nimble www.nimble.com
• Bluetick www.bluetick.io
• Visual studio code www.code.visualstudio.com
• Wade Anderson interview, Microsoft build https://devchat.tv/js-jabber/jsj-265-wade-anderson-ramya-rao-visual-studio-code
• www.zapier.com

Links

• Twitter: https://twitter.com/js_dev
• GitHub: https://github.com/aaronfrost

JSJ 269 Reusable React and JavaScript Components with Cory House

On 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] – Overview

We 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 issue

The 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 dead

No. 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 components

There 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 components

Reusable 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 components

The 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 teams

Aimee’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 crossover

Cory’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] – Challenge

Cory’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.

Picks

Cory House

• Creating Reusable React Components on Pluralsight
• Ted Talk: Why You Should Define your Fears Instead of Your Goals by Tim Ferriss

Joe Eames

• UI-Router
• Persistence

Aimee Knight

• Ask HN: People who completed a boot camp 3+ years ago, what are you doing now?
• NgAtlanta

Charles Max Wood

• Upwork.com

JSJ 269 Reusable React and JavaScript Components with Cory House

On 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] – Overview

We 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 issue

The 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 dead

No. 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 components

There 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 components

Reusable 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 components

The 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 teams

Aimee’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 crossover

Cory’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] – Challenge

Cory’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.

Picks

Cory House

• Creating Reusable React Components on Pluralsight
• Ted Talk: Why You Should Define your Fears Instead of Your Goals by Tim Ferriss

Joe Eames

• UI-Router
• Persistence

Aimee Knight

• Ask HN: People who completed a boot camp 3+ years ago, what are you doing now?
• NgAtlanta

Charles Max Wood

• Upwork.com

MJS 025: Helen V. Holmes

This episode features a My JavaScript story with Helen V. Holmes. Helen has never before been a guest on the show. She is both a designer and front-end programmer who previously worked for Mozilla. In January, she started her own freelancing business. Listen to Charles Max Wood and Helen discuss how she got into programming, what made her decide to open a freelance business, and more!

How did you get into programming?

Helen started by making themes for herself and friends in LiveJournal using other people's CSS themes. Once she got to college she realized that although this wasn't a career, it was an aspect of a career. She then majored in graphic design, going on to do internships in both front-end development and design. Since college, she has gone back and forth between front-end development and design work.

How long ago was that?

Helen graduated college in 2013.

Did you graduate in computer science?

Helen did not even minor in computer science. At the time, she was focused on making stuff. The computer science major was too heavily focused on theory. She did take a couple of classes in it, but the graphic design major was more focused on building prototypes. Her graphic design major didn't teach her how to do anything - she said that you're on your own, and you have to figure out how to show off your ideas. The major appealed to her at the time because of that reason. Now Helen thinks majoring in computer science would have been really helpful for her career.

Charles points out that you don't have to have a computer science degree to do this work. Helen agrees; it can be wasted on you if you don't have the right enthusiasm to learn everything. Both say that you can get the education you want through self-education. Helen explains that so much of successful programming is good communication - this can be learned in college, while the specifics of how to code can be learned later.

How do you get from a graphic design major to "serious programming?"

Helen doesn't know how serious the programming she does is now. Her first real job was at Capital One as a front-end developer on their design team. She was doing prototypes and communicating between the design and production/engineering teams. She realized that nobody knew how to write JavaScript when trying to communicate between the two teams, so she decided that she should learn. A lot of the engineers came to the same realization at the same time. She started to write React as she was leaving Capital One. Everyone was trying to improve his or her JavaScript chops at the same time.

Did you get into Angular or React at Capital One?

When she first started at Capital One everyone was writing Angular. She wrote a lot of Angular in the beginning of her work. Most of the prototypes could be solved with React. Near the end of her time, she started using a lot of React.

What do you see is the difference between Angular and React?

Angular solves a lot more problems than React. It brings logic to the client side. React is only about solving visual problems. That's why it appealed to Helen. The design team she worked with was all about solving visual problems.

Why did you choose the front end?

Helen mainly chose it because she was a graphic design major. She believes that because the web is so accessible that it is the easiest thing. She also thinks the front end is fun.

How'd you wind up at Mozilla?

She met James Long through a mutual friend. Once they met, he thought she'd be a good addition to their team. He told her why it'd be a good switch for her - they were doing React work and they were looking for someone to understand problems that engineers go through.

What do they use React on?

She was on the browser team. The front-end of the developer tools was a JavaScript application that wasn't Angular. They were working on moving it to become a more documented framework. They wanted to use Redux and React. The team was converting it panel by panel.

What made you decide you were going to go freelance?

Helen had been missing things that she had done in college such as branding and illustration work. She had done some illustration work while at Firefox. She ultimately wanted to do a variety of different things instead of just product work. What gave her courage to go into freelance work was that James Long was also going freelance at the same time, so she thought that she was in good company. She also is related to a lawyer, so it wasn't as scary filing the paperwork because she had someone to ask for help during the process.

What contributions do you feel like you've made to the JavaScript community?

Helen believes that the highest impact work she has done has been on the Firefox browser. She didn't write a lot of code, but feels like what she did write is being used by a lot of people. She is most proud of the CSS grid because she says that it is exciting for people who do layout stuff on the web.

What are you working on now?

Helen started her own business at the beginning of the year. She is figuring out how she wants her skills to grow and with what kind of clients she wants to work. She has a lot of side projects, one being what she calls an art project. She is translating JPEG to Pixel art. She is taking NeoPixels, which are little programmable LEDs, and taking a matrix of values and displaying them on a sight board.

With everything that's out there in JavaScript, how do you keep current?

Helen answers that she doesn't. She tries to stay current with the tools she is using, which is React. She doesn’t try to be good at everything because she is also a designer, so she says that she has to pick and choose what she stays current on. Charles says that is what he tells people to do. There is so much out there that there is no way that anyone is going to stay current on everything. He says to keep current on what you are doing specifically.

Picks         

Helen:

• Wonder Woman http://wonderwomanfilm.com
• Debt: The First 5,000 Years https://www.amazon.com/Debt-First-5-000-Years/dp/1612191290

Charles:

• JavaScript Jabber Slack Room https://devchat.tv/javascript-jabber-slack
• Monthly Webinars  https://devchat.tv/webinars
• Angular Remote Conf https://devchat.tv/conferences/angular-remote-conf-2017

Links

• Helen V Holmes Twitter https://twitter.com/helenvholmes

JSJ 270 The Complete Software Developers Career Guide with John Sonmez

This episode features a panel of Joe Eames, AJ O’Neal, as well as host Charles Maxwell. Special guest John Sonmez runs the website SimpleProgrammer.com that is focused on personal development for software developers. He works on career development and improving the non-technical life aspects of software developers. Today’s episode focuses on John’s new book The Complete Software Developers Career Guide.

Did the book start out being 700 pages?

No. My goal was 200,000 words. During the editing process a lot of questions came up, so pages were added. There were side sections called “Hey John” to answer questions that added 150 pages.

Is this book aimed at beginners?

It should be valuable for three types of software developers: beginner, intermediate, and senior developers looking to advance their career. The book is broken up into five sections, which build upon each other. These sections are: - How to get started as a software developer - How to get a job and negotiate salary - The technical skills needed to know to be a software developer - How to work as a software developer - How to advance in career

Is it more a reference book, not intended to read front to back?

The book could be read either way. It is written in small chapters. Most people will read it start to finish, but it is written so that you can pick what you’re interested in and each chapter still makes sense by itself.

Where did you come up with the idea for the book?

It was a combination of things. At the time I wanted new blog posts, a new product, and a new book. So I thought, “What if I wrote a book that could release chapters as blog posts and could be a product later on?” I also wanted to capture everything I learned about software development and put it on paper so that didn’t lose it.

What did people feel like they were missing (from Soft Skills) that you made sure went into this book?

All the questions that people would ask were about career advice. People would ask things regarding: - How do I learn programming? - What programming language should I learn? - Problems with co-workers and boss - Dress code

What do you think is the most practical advice from the book for someone just getting started?

John thinks that the most important thing to tell people is to come up with a plan on how you’re going to become educated in software development. And then to decide what you’re going to pursue. People need to define what they want to be. After that is done, go backwards and come up with a plan in order to get there. If you set a plan, you’ll learn faster and become a valuable asset to a team. Charles agrees that this is how to stay current in the job force.

What skills do you actually need to have as a developer?

Section 3 of the book answers this question. There was some frustration when beginning as a software developer, so put this list together in the book. - Programming language that you know - Source control understanding - Basic testing - Continuous integration and build systems - What kinds of development (web, mobile, back end) - Databases - Sequel

Were any of those surprises to you?

Maybe DevOps because today’s software developers need to, but I didn’t need to starting out. We weren’t involved in production. Today’s software developers need to understand it because they will be involved in those steps.

What do you think is the importance of learning build tools and frameworks, etc. verses learning the basics?

Build tools and frameworks need to be understood in order to understand how your piece fits into the bigger picture. It is important to understand as much as you can of what’s out there. The basics aren’t going to change so you should have an in depth knowledge of them. Problems will always be solved the same way. John wants people to have as few “unknown unknowns” as possible. That way they won’t be lost and can focus on more timeless things.

What do you think about the virtues of self-taught verses boot camp verses University?

This is the first question many developers have so it is addressed it in the book. If you can find a good coding boot camp, John personally thinks that’s the best way. He would spend money on boot camp because it is a full immersion. But while there, you need to work as hard as possible to soak up knowledge. After a boot camp, then you can go back and fill in your computer science knowledge. This could be through part time college classes or even by self-teaching.

Is the classic computer science stuff important?

John was mostly self-taught; he only went to college for a year. He realized that he needed to go back and learn computer science stuff. Doesn’t think that there is a need to have background in computer science, but that it can be a time saver.

A lot of people get into web development and learn React or Angular but don’t learn fundamentals of JavaScript. Is that a big mistake?

John believes that it is a mistake to not fully understand what you’re doing. Knowing the function first, knowing React, is a good approach. Then you can go back and learn JavaScript and understand more. He states that if you don’t learn the basics, you will be stunted and possibly solve things wrong. Joe agrees with JavaScript, but not so much with things algorithms. He states that it never helped him once he went back and learned it. John suggests the book Algorithms to Live By – teaches how to apply algorithms to real life.

Is there one question you get asked more than anything else you have the answer to in the book?

The most interesting question is regarding contract verses salary employment and how to compare them. It should all be evaluated based on monetary value. Salary jobs look good because of benefits. But when looking at pay divided by the hours of work, usually a salary job is lower paid. This is because people usually work longer hours at salary jobs without being paid for it.

What’s the best place for people to pick up the book?

simpleprogrammer.com/careerguide and it will be sold on Amazon. The book will be 99 cents on kindle – want it to be the best selling software development book ever.

Picks

Joe

Wonder Woman

AJ

The Alchemist

Charles

Artificial Intelligence with Python

John

Algorithms to Live by: The Computer Science of Human Decisions Apple Airpods

Links

Simple Programmer Youtube

MJS 026 Chris Coyier

This week’s episode is a My JavaScript Story with Chris Coyier. He is from the ShopTalk Show and CodePen. Listen to learn more about Chris!

How did you get started programming?
Chris has an atypical story. good time in life. He is from a small town in Madison, Wisconsin and had a very privileged upbringing. He went to a nice high school that had a programming elective in his high school. He took a class that taught Turbo Pascal and loved it. He had a lot of fun doing it and became set on doing it in college.

How do you go from that to professional web developer?

Have to give up on it first. He almost got a degree in university management computer systems, which was more management focused than programming focused. He tried and gave up on Java. He then tried graphic design and ended up getting a degree in that. He got into digital prepress at print jobs where he designed documents. It was fun but it was not as fun as being a “real programmer” would be in his mind. He then got a job at an agency doing web developer work. During this time JavaScript was not on his radar.

How do you get from front-end work to building something like CodePen and starting a front-end podcast?

He has made his career his hobby. He loves doing this stuff. When he was building websites for the first time he started CSS tricks. It became really fun. He grew it over ten years. Because it’s his career and hobby he got better over time. All of his time was spent helping friends, writing, or at conferences. He then decided to build CodePen with some of his friends.

What are you working on these days?

Chris wants to be careful not to be working on too many things at once. His top priority is CodePen, which he says is hard to keep up with what developers want there. The second priority is CSS tricks. He likes to publish quality articles for people to read. This third priority is his podcast.

What’s the thing you’ve done that you’re the proudest of?

CodePen is what has been so continually rewarding. This last month he is all money accounted for. He is really proud of CodePen because they made a company from nothing. He and his coworkers have made the podcast over a decade of growing an audience and it feels entrepreneurial.

Charles’ most proud thing is the decision to go full time with his podcast for the last year and a half.

Picks

Chris:

• CodePen https://codepen.io/
• ShopTalk www.shoptalkshow.com
• Alien Covenant http://www.alien-covenant.com/

Charles:

• www.getacoderjob.com
• React Native www.reactnative.com
• www.gocd.org
• JS Dev Summit https://jsdevsummit.com/

Links

• GitHub https://github.com/chriscoyier
• Twitter https://twitter.com/chriscoyier
• https://chriscoyier.net/

JSJ 271: SharePoint Extensions in JavaScript with Mike Ammerlaan and Vesa Juvonen

This episode is a live episode from Microsoft Build where AJ O'Neal and Charles Max Wood interview Mike Ammerlaan and Vesa Juvonent about building extensions for SharePoint with JavaScript.

[00:01:28] Mike Ammerlaan introduction
Mike has worked at Microsoft for a long time on multiple Microsoft products and projects. He's currently on the Office Ecosystem Marketing Team.

[00:01:52] Vesa Juvonen introduction
Ves a is Senior Program Manager for the SharePoint Splat team. He's been with Microsoft for about 11 years and manages the community and documentation for the SharePoint framework.

[00:02:18] What is the SharePoint Framework?
This is how you write SharePoint extensions with JavaScript. SharePoint has changed. It now works with common modern development tools and web development techniques. SharePoint consolodates the extension effort

[00:03:32] What is SharePoint?
File sharing, team sites, communication points for teams. Part of Office 365. You use Web Parts to add functionality to SharePoint. Web Parts provide functionality like widgets and are scoped to a team, group, or set of users. It's usually hosted on premises, but you can also use it with Office 365 as a hosted solution.

[00:05:56] What extensions can you build for SharePoint?
You can build widgets for your front page or intranet. You can also add user management or data management or document management.

Examples:

• Dashboards
• Mini Applications
• Scheduling and Time Tracking
• Document Storage
• Source code repositories

[00:07:39] What is WebDAV and how does it relate?
WebDAV is a protocol for accessing documents and SharePoint supports it among other protocols for managing documents.

[00:08:36] Do I have to build front-end and back-end components to get full functionality?
You can build the front-end UI with Angular and other frameworks. And then build a service in Azure on the backend. The backend systems can then access Line of Business systems or other data systems.

It really does take multiple skill sets to build extensions for SharePoint.

[00:11:10] SharePoint on Mobile
There is a mobile web app and the Web Parts work through the mobile application. You can also use any browser to connect to the application.

[00:12:08] Building extensions with standard Angular or React component libraries
There are standard Yeoman templates. You can also pull in the components through React or Angular just like what Microsoft does.

Newer Angular versions are designed for Single Page Apps and SharePoint isn't necessarily set up to work that way. The Web Parts are isolated from each other and Angular requires some workarounds.

[00:14:30] Getting around sandboxing
Google and Microsoft are talking to each other to see how to work around this when there are multiple sandboxed applications that can't talk to each other in very simple ways.

[00:15:39] Application library or naming collisions if my UI uses different versions or clobber page wide settings
There are guides for a lot of this. React does a bunch of the isolation work.

Addons are iframed in and an API token is given to grant access to the data and APIs.

Microsoft also reviews and approves plugins.

[00:18:30] How do you get started and make money at this?
Look at the SharePoint store. You can build things through websites and pages and offer the plugins through the store.

You can request a SharePoint tenant installation from the Microsoft Dev Tools for free. Then you can build into the tenant site. The rest of the tools are available on npm.

SharePoint Developer Tools

[00:22:13] Automated testing for SharePoint extensions
Unit testing is built in for JavaScript. Testing the UI's require you to sign into Office 365. There are people doing it, though.

[00:22:54] Building internal-only extensions
SharePoint is an enterprise tool, so a lot of enterprises may not want to install extensions from the store. You can definitely build and install private plugins for SharePoint setups. They also have their own backend systems that will require custom development.

[00:25:50] Office 365, SharePoint, and OneDrive
Office 365 is used by people across many different sized organizations and SharePoint is much more enterprise. Office 365 tools store files and information in SharePoint.

What about OneDrive versus Sharepoint? OneDrive is focused for one person. SharePoint is focused around a team. But they have the same APIs and use the same technology stack.

[00:29:05] The history and future of SharePoint
It started out on premises and has moved to the cloud. The SharePoint team is working to keep it available and useful in the modern cloud based era.

[00:30:25] What does the API footprint look like?
It spans modifying lists, data objects, attributes, items in a list, put Web Parts on a page, modify the experience, and manage and modify access, users, and documents. SharePoint is a way of building a way of conveying information.

SharePoint is layers of data and scopes.

[00:35:26] Tutorials and Open Source
dev.office.com
The Sharepoint framework is not open source yet, but they're working on that. They also need to open source the Yeoman templates.
Open source samples are available at github.com/sharepoint.

Picks

Charles Max Wood

• BlueTick
• Zapier
• ScheduleOnce
• Moo.com
• Advice: Take the time to go talk to people.
  Vesa adds that you should go to a session that's on something completely outside your experience.

AJ O'Neal

• The Circle
• Spontaneity/Happiness: AJ tells a story about a woman he saw running through sprinklers.
• Oh the places you'll go by Dr. Seuss: AJ talks about a journal entry he read at a yard sale.

Mike Ammerlaan

• Super hot VR on Oculus Rift

Vesa Juvonen

• Family

A big thanks to Microsoft, DotNetRocks, and Build!

MJS 027 Chris Anderson

This episode is a My JavaScript Story with guest Chris Anderson. Chris works at Microsoft, specifically on Azure Functions and WebJobs SDK. Hear how he got his start, how he has contributed to the community, as well as a bit about what it’s like being a Program Manager for Microsoft. 

[00:01:50] ]How did you get into programming?

In college Chris was an aerospace engineer. His first taste of working with code was at an internship at Lockheed Martin. Most of his daily work was with spread sheets so he learned Visual Basic to help handle that. He found himself interested in writing code more so he took an intro in C summer course and then things snowballed. When he finished that semester, he talked to advisor about switching to Computer Science. Immediately landed into JavaScript. Chris talks about having a ‘clicking moment’ while in a topics class. A classmate was talking about NodeJS and so he tried it out and hasn’t stopped using it since.

[00:03:36] What about programing appealed to you?

Chris says that programming made him have a sense of having superpowers. In aerospace he learned how planes worked and that was fun, but programming had an immediately feedback on what he was working on. He adds that it made sense in the way that programming is a universal toolset for no matter what field you’re in. Charles adds that he dug into coding after working in tech support and needing it.

[00:05:22] Have you worked with JavaScript before learning about Node?

Chris’ first real coding experience was with his internship. He taught himself JavaScript on the job and after a few months found himself really liking it. He felt like JavaScript felt more natural and expressive. Javascript empowered him to work on the client side and the server side and he felt empowered to do full stack.

[00:06:55] Was this before Microsoft?

Microsoft’s hiring process for college graduates you apply the year you graduate and go through a handful of interviews. He got hired into a team working on databases, working in SQL server. He wanted to work in developer tools and learned how to use power shell and SQL works and how powerful it was. He started moving back and pushing NodeJS onto SQL. There was a driver for SQL purely in JavaScript called TDS and he would make pull requests and contributed to that. He talks about searching internally looking for other work and finding a mobile services team that needed a NodeJS person so he started there. Later he started WebJobs and then later Functions, as an effort to make NodeJS technology work with a .Net technology called Webjobs SDK. Functions exists because he wanted to add a NodeJS to a .Net product.

[00:11:07] ] Did you find pushing NodeJS into a well developed language ecosystem risky?

Chris talks about helping push adoption of .Net and creating prototype ideas, and it sparking from that. His goal was to make customers more productive.

[00:12:02] Having fun at work

Chris talks about the team culture being fun at times. Sometimes as a developer you get buffered by Project Managers, but in the case developers spend a lot of time talking to customers. They are excited so they have loads of interactions, helping develop diverse ideas. Charles adds that the preconception to how the environment feels in Microsoft tends to be negative but from talking to people who work there, things seem to be more open than expected. Chris points to open source concepts that really makes working with Microsoft great.

[14:40] What does a Program Manager do on a team?

Chris talks about how his job is to explore the issues and talk to customers and then prioritize how to make things better. He talks about doing whatever he can to make the product successful with the customers, including building a prototype of an idea, taking a sort of position similar to an entrepreneur. Charles adds that it’s refreshing to find that someone in the Program Manager also being technical sufficient and hands on. Chris talks about how teams are built naturally and pulled together with a group of people who love what they are doing.

[00:16:52] Does the Azure Functions team use Azure Functions to make Azure Functions work?

Chris talks about not using Azure functions under the covers, for the most part it’s built on top of the app service technology stack like web apps and mobile apps. Things that power that is what powers the Azure functions, like Angular. A lot of the engineering pieces are on top of that. They do use Azure for various Microsoft internal things. All of the tests they build are functions to test functions.

[00:18:24] How did you and your team come to use Angular?

Chris was working on the prototype for Azure Functions. Amed had experience with working on front end applications and he wanted to try out Angular 2 even though it was still in beta. He found that had the right amount of stuff out of the box. Additionally it had typescript which meshed well. They tend to pick things that people on the team know well and not as much as trying to stay tied into Microsoft supported systems. Chris talks about doing one or two major refactoring.

How much Angular have you worked on yourself?

Amed works the most on Angular, Chris’ job as Program Manager puts in him in a place where his commits don’t go into production, but he will often write prototypes. He played around a lot with the Monaco editor and adding features for that. As far as outside of that, he has written a few tutorials for using Functions plus Angular as well as written his wedding website with Angular.

[00:22:33] What other extracurricular projects have you worked on?

Chris talks about doing a lot of side projects for a while. One working with ExpressSocket.io. He also built a middleware project where you can write middleware into Functions. Plenty of little projects he puts on GitHub and never finishes. Chris talks about wishing he could switch hats between being the Program Manager and a developer.

[00:23:42] Is there anything in particular you feel like you’ve contributed to Angular?

Chris talks about improving by putting in loads of pull requests for tons of JavaScript libraries and a few NodeJS libraries. He would like to be more involved in the start of those processes. Chris says he hopes to maybe be involved in the next Node version update. He really likes the Node community.

Picks

Chris

Mountain Dew Pitch Black
The Expanse Series on SciFi
Application Insights

Charles

Wheel of Time
Coolage
Dog Company
Data Dog

Links

Twitter
GitHub

JSJ 272: Functional Programming and ClojureScript with Eric Normand

This episode of JavaScript Jabber features panelists Aimee Knight and Charles Max Wood. Special guest Eric Normand is here to talk about functional programming and ClojureScript. Tune in to learn more!

[00:1:14] Introduction to Eric Normand

Eric works for purelyfunctional.tv. The main target market for his company is those people who want to transition into functional programming from their current job. He offers them support, shows them where to find jobs, and gives them the skills they need to do well.

[00:02:22] Address that quickly

Functional programming is used at big companies such as Wal-Mart, Amazon, EBay, Paypal, and banks. They all have Clojure but it is not used at the scale of Java or Ruby.

So yes, people are using it and it is influencing the mainstream programming industry.

[00:3:48] How do you build an application?

A common question Eric gets is, “How do I structure my application?” People are used to using frameworks. Most start from an existing app. People want a process to figure out how to take a set of features and turn it into code. Most that get into functional programming have development experience. The attitude in functional programming is that they do not want a framework. Clojure needs to be more beginner friendly. His talk is a four-step process on how to turn into code.

[00:05:56] Can you expand on that a little?

There are four steps to the process of structuring an application.

1. Develop a metaphor for what you are trying to do. Developing the first implementation. How would you build it if you didn’t have code?
2. Develop the operations. What are their properties? Example: will have to sort records chronological.
3. Develop relationships between the operations.
4. Run tests and refactor the program. Once you have that, you can write the prototype.

[00:13:13] Why can’t you always make the code better?

Rules can’t be refactored into new concepts. They have to be thrown away and started completely over. The most important step is to think before beginning to write code. It may be the hardest part of the process, but it will make the implementation easier.

[00:17:20] What are your thoughts on when people take it too far and it makes the code harder to read?

He personally has written many bad abstractions. Writing bad things is how you get better as a programmer. The ones that go too far are the ones that don’t have any basis or are making something new up. They are trying to be too big and use no math to back up their code.

[00:20:05] Is the hammock time when you decide if you want to make something abstract or should you wait until you see patterns develop?

He thinks people should think about it before, although always be making experiments that do not touch production.

[00:23:33] Is there a trade off between using ClojureScript and functional JavaScript?

In terms of functional programming in JavaScript don’t have some of the niceties that there are in Clojure script. Clojure Script has a large standard library. JavaScript is not as well polished for functional programming; it is a lot of work to do functional programming it and not as much support.

[00:27:00:] Dave Thomas believes that the future of software is functional programming. Do you agree?

Eric thinks that it seems optimistic. He doesn’t see functional programming take over the world but does think that it has a lot to teach. The main reason to learn functional programming is to have more tools in your toolbox.

[00:31:40] If this is a better way to solve these problems, why aren’t people using it?

There is a prejudice against functional programming. When Eric was first getting into it, people would ask why he was wasting his time. Believes that people are jaded. Functional programming feels foreign because people are used to a familiar way of programming; they usually start with a language and get comfortable.

[00:40:58] If people want to get started with it, is there an easy way in?

Lodash is great to start replacing for loops. It will clean up code. There are other languages that compile to JavaScript. For example, Elm is getting a lot of attention right now. It is a Haskell like syntax. If you want more of a heavyweight language, use TypeScript or PureScript. ClojureScript is into live programming. You are able to type, save, and see results of the code immediately on the screen in front of you.

Picks

Aimee:

• The Hidden Cost of Abstraction 
• What Functional Language Should I Learn 

Eric

• Steven King, On Writing 
• Youtube Channel: Tested  

Charles

• Ionic Framework

Links

• Purely Functional TV 
• Blog 
• Building Composable Abstractions 

MJS 028 Zach Kessin

In this episode we have another JavaScript Story, this time our guest is Zach Kessin. Zach is a Developer and consultant. On the server side he works with Erlang and Elixir. On the front end he works on Elm. He also also written a few books for O’Reilly and a video course for Manning available sometime in the fall. He was a guest on episode 57 and is here with us today to tell us his story. Stay tuned!

[2:48] How did you get into programming.

Zack tells the story about how when he was 7 he asked his mother for a computer. She agreed that if he paid for half of it somehow, then she would help him get it. He Gathered his half by calling relatives and gathering funds. His mom taught him Basic and Logo. He also learned Pascal. While in University he picked up the book Structure and Interpretation of Computer Programs and loved it. He talks about remembering writing a HTML forum but not knowing how to submit entries. After college he started working.

[4:38] Resources then vs now.

Charles adds that if you’re tenacious enough to call your family members to find funding to buy a computer to learn, then you probably have the drive it takes to be a programmer. Charles and Zack talk about how in the 80s it was rare to have access to a computer, and now homes have multiple computers throughout. The resources are more readily available now with the internet. If you’re looking to get into development, there are plenty of great resources.

[7:45] How did you get into JavaScript and Erlang?

Zach starts explaining by telling how he get into JavaScript before the internet really existed. His first JavaScript program exposure was a loan calculator at a bank. Early on the only thing you could do was validate forms, but over time it grew. He started working for a company writing php. He felt like it wasn’t as functional or elegant as he was hoping for. He found various languages and landed on Erlang. Erland was designed to work for programming telephone switches. Due to phone services nature, It handles high scale, high reliability, has to be upgraded on the fly, etc. Zach talks about how server programming looks very similar to phone line programming. Zach adds that a few years ago he wanted work on some front end and after looking around finally he learned about Elm. He says that he is always looking for what’s new and useful.

[14:26] Programming Languages Change the Way We Think

Charles points out that it’s very interesting out about how functional programming has played out. He mentions that many JavaScript programmers use functional style programming to help with speed or efficiency. He adds that a fully functional programming language is very interesting and could be helpful. Zach talks about how learning new languages helps adjust the way we think.

[16:45] How have you contributed to the development community?

Charles starts off with mentioning Zach’s podcast that was called Mostly Erlang. Zach adds that he has wrote two books for O’ Reilly, one on HTML5 and Erlang. He has done some blogging and is creating a video course called Startup Elm. He mentions that he spends most of his time teaching. He admires people who write libraries and sustains them over years, but it isn’t something he sees himself getting into. He adds that having the libraries are useless unless you have someone to communicate about it and teach it. Charles mentions that contributions come in various ways and the community needs those sort of teachers. Zach mentions that he often speaks at conferences and meet ups. Public speaking can be a great way to progress your career. Charles brings up the idea of “Sweeping the dojo floor”. He was introduced to this idea by Dave Hoover. Sweeping the dojo floor means that you’ve got enough experience to talk about the topic, but maybe not fully contribute and so you do things like document code, or write articles and outreach for the topic. Talks can lead to work. You can easily find research papers and do talks on that. Zach adds that sometimes in a community, you see the same speakers over and over and new speakers are needed. Zach also mentions that there are plenty of opportunities to do talks in something other than english.

[26:36] What are you working on now?

Zach talks about the list of things he is working on. Starting with Startup Elm and it’s live course that will be happening in October. He is also working on a SaSS product for Instagram marketers called SquareTarget. He adds that he has a day job as well.

Picks

Zach

Intrepid Large Format Camera Kickstarter

Charles

Toast Masters
Zapier
Javascriptjabber.com/slack

JSJ 273: Live to Code, Don't Code to Live with 2 Frugal Dudes Sean Merron and Kevin Griffin

This episode of JavaScript Jabber features panelists Aimee Knight, Cory House, and Charles Max Wood. Special guests Sean Merron and Kevin Griffin discuss how to live frugally. Tune in to hear their advice!

[00:02:14] Introduction to Sean and Kevin

Sean and Kevin are the hosts of the 2 Frugal Dudes Podcast. They are middle class software engineers. Sean works a 9 to 5 job, while Kevin owns a small business called Swift Kick. Swift Kick is a company that focuses on independent consulting, software development, and training companies for software development.

[00:05:50] Different Types of Financial Advisors

There is no legal reason that financial advisors have to work in your best interest. On the 2 Frugal Dudes Podcast, Sean and Kevin advise people to use fiduciary advisors. These types of advisors are not legally allowed to accept kickbacks from different funds. This means that they are more likely to help you to the best of their ability. They get paid for their services. Laws are currently changing so that everyone has to be a fiduciary advisor unless clients sign a specific form.

[00:10:00] What do I do with money left over at the end of the month that I can’t put into a 401K and Roth IRA?

They suggest that you put only the amount of money in your 401K that your company will match. Then, put the rest into a Roth IRA and max that out. Before you decide to do what next, you need to decide why you are saving money. When will you need the money? What will you need it for? Once you know the answer to these questions, you will be able to assess what your money will best be placed. For example, if you are saving to buy a house you need to put your money in a safe investment. A Roth IRA can be used as a savings vehicle or as an emergency fund. Sean believes that a Bank CD is the safest return you can get.

[00:14:30] Best Way to Save 

For those who are self-employed, it is a good idea to have two emergency funds – a personal and a business fund. Business emergency funds should have five months of personal salary. Kevin built his up over two or three years and uses it as self-insurance.

Sean says that the employee world is different. For him, he only keeps the minimum amount in his emergency fund. He knows that he is in a field where his job is in high demand, so feels comfortable with being able to get a job quickly. For others, this may not be the case. Have to evaluate how much to save based on how long you think you may need the money. 

[00:18:50] What is the first thing people should be doing for their own financial well being?

Kevin follows Dave Ramsey’s advice.

1. Basic emergency fund. He uses $1,000. Most emergencies fall under that amount of money.
2. Get rid of all consumer debt. This includes car payments, credit cards, and student loans. Mortgage is not consumer debt.
3. Grow an emergency fund to three or six months of expenses.
4. Investments. Setting up retirement funds, paying for college, or mortgages.

Sean values early retirement so he focuses on that. What does retirement mean to me? What does rich mean? You should always track your money through a budget. Then you can funnel money towards emergency funds and tackling debt.

Self-insurance means that you don’t have to worry about funds. It helps lower your stress knowing that you have your finances in order. It is a peaceful place to be and opens up opportunities for you. If someone has stressors in their life – for example, their car breaks down – and they have no money to fix it, they now have car and money problems. This stress can then potentially lead to other problems such as marriage problems. If the money to fix the broken car would have been there, it would alleviate stress.

[00:28:23] Difference between 401k, IRA, and Roth IRAs

A 401k is an employer provided, long-term retirement savings account. This is where you put in money before it is taxed. With this plan you are limited with the funds you can choose from to invest in.

IRAs are long-term retirement plans as well. The first type of IRA is a Traditional IRA, which is similar to a 401k. You get tax reduction for the money you put in the account. You pay taxes once you withdraw money. A Roth IRA is where you already pay taxes on money that you are putting in, but don’t have to pay taxes when withdrawing money. You can withdraw contributions at anytime without being penalized, you just can’t take out any earnings.

Another thing that is potentially good for early retirement is a Roth IRA conversion ladder. This is where you take money from a 401k and convert it into a Roth IRA and use it before 60 years old to fund early retirement.

Traditional IRAs are good for business owners looking for tax deductions now. An HSA (Health Savings Account) can also be used as a retirement device. It goes towards medical expenses if needed.

[00:34:20] Are there tools or algorithms I can use to figure this stuff out?

There are some. Portfolio Visualizer allows you to choose different portfolio mixes and put different amounts of money in each one. Portfolio Charts is similar to Portfolio Visualizer but gives nice graphics. Sean created a JavaScript website to help people use to figure out early retirement.

The hardest part is calculating return because you have to estimate what your return will be each year.

[00:39:00] Put Your Money Somewhere

The only bad investment is not making an investment. Even making a bad investment is better than not having any at all. Inflation eats away at money that is just sitting.

[00:42:05] If you get one of these advisors what advice should you be looking for?

Need someone that tries to understand your particular situation. “It depends” is very true and your advisor should know that. No two people will have the same financial goals. They should want to help reach your goals in the least costly way possible. Other things they should be able to do is be honest and help you control your emotions during upswings and downswings. 

[00:47:08] Why index funds?

As an investor, you can buy an index fund cheaper than buying the whole index. A mutual fund will try to buy and sell the stocks in that index in order to follow the index's performance. As an investor, you have the opportunity to buy into a mutual fund that handles it for you.

You don’t have to independently invest in companies either. You can invest in an index instead that will look at, for example, top performing technology companies. It is usually a better value.

[00:53:33] How much do I invest in my business verses putting money into a Roth IRA or 401k?

Sean thinks it comes down to retirement goals. At some point you will want money to come in passively and retire in the future. If you can passively put X amount of dollars into your company then it can be looked at as a form of investment.

Kevin evaluates his business goals every quarter. He creates a business budget based off of those goals.

Picks

Cory

• Random Walk Down Wall Street by Burton Malkiel 
• Rich Dad, Poor Dad by Robert Kiyosaki 
• Ego is the Enemy by Ryan Holiday

Aimee

• Hacker News Thread – How to Not Bring Emotions Home With You
• Phantogram 

Charles

• Money Master the Game by Tony Robbins 
• ELPs (Endorsed Local Providers) Dave Ramsey

Sean

• The Little Book of Common Sense Investing by John Bogle
• Mr. Money Mustache Blog 
• www.mint.com

Kevin

• Unshakable by Tony Robbins
• YNABS 
• The Millionaire Next Door by Thomas Stanley

Links

• 2 Frugal Dudes Twitter
• Sean's Twitter
• Kevin's Twitter
• www.swiftkick.in
• www.kevgriffin.com
• http://earlyretirementroadmap.com/
• 2 Frugal Dudes Podcast

MJS 029: Matt Creager

On this episode, we have another My JavaScript Story, our guest is Matt Creager. Matt works for Manifold. He's here with us today to tell us his story. Stay tuned!

[01:00] – Introduction to Matt Creager

Matt works for an interesting company called Manifold. They sponsored the show.

[01:35] – How did you get into programming?

Before Matt fell in love with programming, he was in love with technology. They bought his first computer. It was a Gateway 2000 and he got access to the internet around the same time. He spent all of his time on that computer because they were moving around so much. That became the way that he stayed in touch with people. He remembers taking it apart and formatting the hard drive accidentally.

His uncle has been in the IT industry since he was a kid too. Matt was always associating him with spending time with his computer programming, a role model, and stabilizer in his life. He was switching tapes. And then, his cousin decided that he was going to start scripting his character’s actions in a game that they were playing. And now, looking back, it was some combination of Lua and C++. He started taking his cousin’s scripts apart to automate his own character in the game. He was 13 or 14.

The first programming book that he bought was a result of not being able to figure out how to get his character what it wants to do. It was one of the C++ bibles. And then, he became active in the forums around the scripting language. He was sharing the scripts and he started to realize that he can harvest stuff in the game and sell it for real cash.

Matt never considered himself technical and never considered programming a career. He was just translating CPU and RAM for people who were shopping for computers. And then, he wanted people to measure theirs so he built tools that took the data they had in an office and turn them into reports. When the manager started using that, it became a nationwide program and suddenly, he was on the map. He was leading a team.

When Blackberry started a technical interview, he realized that he has the answers to these questions. Initially, he was just a Technical Issues Manager. He had a Data Science team and that team was responsible for identifying and prioritizing issues. They were using Node 0.4, very early version of Node. And then, he discovered Angular and dived head first to the Angular community.

[13:10] – BlackBerry got Matt to JavaScript

Matt looked at Node because he was trying to figure out how he could do real time analytics. He wanted these dashboards that data scientists are looking at. That was the stepping stone into JavaScript.

[15:30] – Hackathon

On the side, a couple of local companies started to run hackathons. Matt was going to hackathons all the time. Then, he ended up of hopping from BlackBerry to becoming a full time front-end developer at a start-up.

Matt was talking with one of the organizers at LA Hacks. She was telling him that the reason why people are going to these hackathons is because they want to win and they want to put that fact on their resumes. In his day, that was not hackathons were like. The prizes can act as a negative incentive. They really work hard for the prizes. Sometimes they actually end up becoming more creative as a result because they know they need to use this specific combination of API’s.

[18:45] – Contributions to JavaScript community

When Matt joined GoInstant, it was very early days of RTC. Web sockets are new at that point. You’re probably more familiar with Firebase. In the early days, GoInstant and Firebase are competing for the same developers. They’re working on the same problems. The tools that they are building were real time synchronization between the state you have on the client and the state you have on the server. A lot of those that they build, open-source tools, they went with GoInstant to Salesforce. But they inspired the libraries and a lot of it is probably on the same code base that you now see in libraries that pretty much does the same things with Firebase.

And then, most recently, Matt and the team built Torus. They realized that if they are going to be building smaller applications, going to start to use more cloud services, more services tailored towards developers, and going to manage a lot more credential, a lot of credentials that need to be secured and shared with the teammates, they needed to take those credentials and put them on applications wherever they are running, whether that’s a Docker container or Heroku. That’s his most recent open-source project.

[20:50] – What are you working on now?

Manifold is their latest project. They’re trying to build a market place for developer services. It’s been 3 months. They moved from Torus to building Manifold earlier this year. The official launch hasn’t happened yet. That’s hopefully to come earlier this year – September. If it’s something that you want to try out and experiment with, there is a coupon for My JS. Give it a try before they launch a $25 credit that they can use to provision a logging instance, monitoring, or database. You can use it with any type of services that you might need to build your app.

Picks

Matt Creager

• OpenCollective.com
• Scaphold GraphQL
• Elixir
• Manifold.co
• Twitter, Github: @matt_creager

Charles Max Wood

• AWS Lambda
• Zapier
• Heroku
• Udemy course for Ionic Framework

JSJ 274 Amazon Voice Services and Echo Skills with Terrance Smith

On today’s episode of JavaScript Jabber, we have panelists Joe Eames, Aimee Knight, Charles Max Wood, and we have special guest Terrance Smith. He’s here today to talk about the Amazon Alexa platform. So tune in and learn more about Amazon Voice Services!

[01:00] – Introduction to Terrance Smith

Terrance is from Hacker Ferrer Software. They hack love into software.

[01:30] – Amazon Voice Service

What I’m working on is called My CareTaker named probably pending change. What it will do and what it is doing will be to help you be there as a caretaker’s aid for the person in your life. If you have to take care an older parent, My CareTaker will be there in your place if you have to work that day. It will be your liaison to that person. Your mom and dad can talk to My CareTaker and My CareTaker could signal you via SMS or email message or tweet, anything on your usage dashboard, and you would be able to respond. It’s there when you’re not.

[04:35] – Capabilities

Getting started with it, there are different layers. The first layer is the Skills Kit for generally getting into the Amazon IoT. It has a limited subset of the functionality. You can give commands. The device parses them, sends them to Amazon’s endpoint, Amazon sends a call back to your API endpoint, and you can do whatever you want. That is the first level. You can make it do things like turn on your light switch, start your car, change your thermostat, or make an API call to some website somewhere to do anything.

[05:50] – Skills Kit

Skills Kit is different with AVS. Skills Kit, you can install it on any device. You’re spinning up a web service and register it on Amazon’s website. As long as you have an endpoint, you can register, say, the Amazon Web Services Lambda. Start that up and do something. The Skills Kit is literally the web endpoint response. Amazon Voice Services is a bit more in-depth.

[07:00] – Steps for programming

With the Skills Kit, you register what would be your utterance, your skill name, and you would give it a couple of sets of phrases to accept. Say, you have a skill that can start a car, your skill is “Car Starter.” “Alexa tell Car Starter to start the car.” At which point, your web service will be notified that that is the utterance. It literally has a case statement. You can have any number of individual conditional branches outside of that. The limitation for the Skills Kit is you have to have the “tell” or “ask” and the name of the skill to do whatever. It’s also going to be publicly accessible. For the most part, it’s literally a web service.

[10:55] – Boilerplates for AWS Lambda

Boilerplates can be used if you want to develop for production. If you publish a skill, you get free AVS instance time. You can host your skill for free for some amount of time. There are GUI tools to make it easier but if you’re a developer, you’re probably going to do the spin up a web service and deal it that way.

[11:45] – Do you have to have an Amazon Echo?

At one point, you have to have the Echo but now there is this called Echoism, which allows you to run it in your browser. In addition to that, you can potentially install it on a device like a Raspberry Pi and run Amazon Voice Services. The actual engine is on your PC, Mac, or Linux box. You have different options.

[12:35] – Machine learning

There are certain things that Amazon Alexa understand now that it did last year or time before that like understanding utterances and phrases better. A lot of the machine learning is definitely under the covers. The other portion of it Alexa Voice Service, which is a whole engine that you have untethered access to other portions like how to handle responses. That’s where you can build a custom device and take it apart. So the API that we’re working with here is just using JSON and HTTP.

[16:40] – Amazon Echo Show

You have that full real-time back and forth communication ability but there is no video streaming or video processing ability yet. You can utilize the engine in such a way that Amazon Voice Services can work with your existing tool language. If you have a Raspberry Pi and you have a camera to it, you can potentially work within that. But again, the official API’s and docs for that are not available yet.

[27:20] – Challenges

There’s an appliance in this house that listens to everything I say. There’s that natural inclination to not trust it, especially with the older generations. Giving past that is getting people to use the device. Some of the programming sides of it are getting the communication to work, doing something that Alexa isn’t pre-programmed to do. There isn’t a lot of documentation out there, just a couple of examples. The original examples are written in Java and trying to convert it to Node or JavaScript would be some of the technical challenges. In addition, getting it installed and setup takes at least an hour at the beginning. There’s also a learning curve involved.

[29:35] – Is your product layered in an Echo or is your product a separate device?

Terrance’s product is a completely separate device. One of the functionality of his program is medicine reminders. It can only respond to whatever the API calls from Amazon tells you to respond to but it can’t do anything like send something back. It can do an immediate audio response with a picture or turn on and off a light switch. But it can’t send a message back in like two hours from now. You do want your Alexa device to have (verbally) a list of notifications like on your phone. TLDR, Terrance can go a little further with just the Skills Kit.

[32:00] – Could you set it up through a web server?

Yes. There are examples out there. There’s Alexa in the browser. You can open up a browser and communicate with that. There are examples of it being installed like an app. You can deploy it to your existing iPhone app or Android app and have it interact that way. Or you can have it interact independently on a completely different device like a Raspberry Pi. But not a lot of folks are using it that way.

[33:10] – Monetization

Amazon isn’t changing anything in terms of monetization. They make discovery a lot easier though. If you knew the name of the app, you could just say, “Alexa, [tell the name of the app].” It will do a lazy load of the actual skill and it will add it to your available skill’s list.

However, there is something called the Alexa Fund, which is kind of a startup fund that they have, which you can apply for. If you’re doing something interesting, there is a number of things you have to do. Ideally, you can get funding for whatever your product is. It is an available avenue for you.

[36:25] – More information, documentation, walkthroughs

The number one place to go to as far as getting started is the Amazon websites. They have the Conexant 4-Mic Far-Field Dev Kit. It has 4 mics and it has already a lot of what you need. You have to boot it up and/or SSH into it or plug it up and code it. They have a couple of these kits for $300 to $400. It’s one of the safe and simpler options.

There are also directions for the AVS sites which is under Alexa Voice Services, where you can go to the Github from there. There will give you directions using the Raspberry Pi.  If not that, there’s also the Slack chatroom. It is alexaslack.com. Travis Teague is the guy in charge in there.

Picks

Joe Eames

• Cosmic Engineers by Clifford D. Simak

Aimee Knight

• Conference: React Rally
• Pancakes

Charles Max Wood

• Conference: Angular Dev Summit
• Conference: React Dev Summit
• JavaScript Jabber Slack

Terrance Smith

• Language: Elm
• Youtube channel: The School of Life
• Game: Night in the Woods
• Hacker Ferret Software
• Hackerferret.com

MJS 030: Mike North

This episode is a My JavaScript Story featuring Mike North. Tune in to learn more about how Mike started his journey as a developer in JavaScript!

[00:01:15] Introduction to Mike

Mike has a Frontend Masters Series for Ember 2 and has two other courses that help developers stand out from the software perspective.

[00:02:45] How did you get into programming?

Mike describes that he has taken a non-linear path to get to where he is now. He started programming as a teenager. He was laying dry wall with a construction company when he was 15 or 16. At the end of the job, he built a training app for the company in order to decrease their paperwork. Mike states that the programming work he does day-to-day he only learned two or three years ago.

[00:04:13] Is that due to things changing so quickly?

Mike’s role and passion keeps evolving. People pick what is important to them. A goal of his is to always stay learning; he enjoys having a deep understanding of topics. He enjoys using brand new skills and calls himself a “perpetual beginner.” Mike is always talking about something that he has just figured out how to do.

[00:05:20] How do you approach keeping current?

Mike thinks that it is impossible to keep up with everything. It is a full time job to keep track of everything. Developers don’t need to spend so much time going through information. He goes to teams once every quarter and helps them absorb the information in a distilled way so they do not have to filter through stuff such as what frameworks are worth paying attention to. This condenses the information and frees them from having to learn everything. Instead, they are able to focus on their product.

[00:08:27] How did you get into JavaScript and web development?

When Mike entered college, he was going into mechanical engineering and did not want to write code. He thought it was boring. When he began getting into code, it was because he could use it to solve real world problems. When he first started, he wrote engineering simulation code for Formula One racecars. When the iPhone came out, it gave him clarity that he wanted to work with that. He began to work with jQuery Mobile. He liked doing this enough that he ran a consultancy at night. He ran projects that he had no previous experience with in order to learn skills that would help him make JavaScript his full-time job.

[00:13:29] Where does Ember fit in with all of this?

When Mike started working at Yahoo, he became very familiar with Ember. Ember allowed employees to treat engineers as resources towards the larger goal of building and merging all apps together instead of having separate pockets of different technology everywhere. There were only a few Ember experts at the time, so Mike took advantage and spent a lot of time to gain expertise with the framework.

[00:16:50] What kinds of contributions do you feel like you’ve made to the JavaScript community?

Mike believes the way he has contributed to the community has evolved over time. In the past, he wrote libraries and worked with issues in the framework itself. The impact he has now is representing newcomers to a technology. He does workshops at conferences. He loves teaching and enabling people.

[00:19:07] How do you structure the learning to make it that it is approachable for people? How do you address both audiences?

As far as newcomers to programming, there is an alarming statistic of companies hiring computer programmers at 400% of the rate at which CS majors can graduate. The demand for software engineers exceeds the ability to educate conventionality. This means companies have to take people seriously that were educated via boot camps. There is a lot of material for new beginners. For people who are established programmers but new to specific technologies, there is a huge gap of material. Video courses, tutorials, and books should be made more accessible for these people. Mike also believes it is the job of a senior engineer to spend time teaching people.

Books, tutorials, and trainings that scrape the surface disappoint Mike. This has informed the techniques he uses to teach during his workshops. Students spend 50% of their time solving problems. His students are given code tests and spend time working how to solve problems. It takes a long time to build his curriculum but it is his main focus right now.

Picks

Mike:

• TypeScript Deep Dive by Basarat Ali Syed
• Proposal for Async Iteration

Charles

• Visual Studio Code
• Frontend Masters 

Links

• Twitter
• www.mike.works

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

MJS 031: Mike Hostetler

Today's episode is a My JavaScript Story with Mike Hostetler. Mike talked about his contributions to the JavaScript community. Listen to learn more about Mike!

[00:50] – Introduction to Mike Hostetler

Mike was on episode 133 which was like 2.5 years ago.

[01:45] – How did you get into programming?

First computer

Mike got their first computer when he was 5 or 6 years old. 286 IBM Clone had a command prompt that he spent several years trying to figure out how to code with it until he stumbled on a few basic books at their local public library in junior high. He began teaching himself how to code with QBasic and Borland C++. He, then, found the internet early high school and downloaded the Mosaic browser. He started coding HTML and early JavaScript, late 90’s. Then, he went off to college to get a Computer Science degree.

First job

When Mike was late high school, he decided that he knew enough coding that he was going to try to get a job. He ended up finding web development companies in the phone book and calling each one of them, trying to explain that his 16-year-old self could help them code and build websites. He ended up landing a job and was paid minimum wage to build HTML sites - a lot of 1x1 pixels transparent gifs, coding HTML by hand and notepad. Then, he ended up working for that company for his first couple of years of college as well.

[05:30] – How did you wind up doing JavaScript?

After college, the job that Mike landed was spent on learning Microsoft technologies and then half on the open-source side of learning the LAMP stack. At that time, it required hand-coding JavaScript. His next role is building a custom mapping application which was a single page application that heavily relied upon JavaScript. This was client-side object-oriented. There were no frameworks but it was enough script to build a URL that called a custom CGI to render the map. So, he immediately jumped in and started using the early JavaScript frameworks and prototypes.

The role that Mike was in next was building a touchscreen capable device. They needed custom plug-ins to provide the highlight focus effect around the button. He needed to write a plugin to do that and jQuery has just been released. So, he stripped all the prototype code, throw JQuery in there, and then, write a plug-in to navigate this interface by keyboard.

[09:20] – Contributions with JavaScript

jQuery

Mike’s first participation was on the JQuery project. If you ever use the JQuery plug-ins site, the old site, that was his contribution. He ended up running infrastructure for JQuery for several years. JQuery launched his business career. He switched into an entrepreneur around 2009. Since then, he’s contributed in numerous ways through speaking, leading training, and writing articles. He was a co-author of the JQuery Cookbook.

Node.js

As Node began to get more popular, Mike switched his attention to Node and found passion around the Sails.js project. It was a Node framework that made it easy to build Express-powered apps with Node and limit a lot of the convention over configuration elements of the Sails framework. That morphed into ES6 rewrite of Sails called the Trails framework. Currently, he is an organizer of the Chicago Node.js Meetup and he’s a contributor to the Trails framework.

[11:50] – JQuery challenges and experiences

jQuery 1.4

Mike and the team made community’s problems their problems so the gravity of what they were working didn’t hit them very much until jQuery 1.4. They had an online conference. They all recorded talks and they’re releasing a talk a day for jQuery that will be going to accommodate the 1.4 release. He remembered that he was setting up, managing the servers, and was doing some last-minute configuration. Then, John had tweeted that 1.4 was ready, pointing to jQuery.com. The web server just ground to a halt as he saw the traffic come in off a tweet.

Open-source community

Mike remain friends with a lot of them. According to Mike, they were just normal people who made a choice to lean in, contribute, where those contributions ended up becoming popular. Looking forward, he said that he’s going to continue to contribute to the open-source community. He wants to help the junior developer that is learning ES6 for the first time and is solving a syntax error. From Mike’s perspective, technologies come in waves. jQuery was a wave but jQuery’s wave focuses its energy into JavaScript’s wave. Certain people catch a contribution wave. React is on the upswing. Node is in an interesting spot because they’ve been on the upswing for many years but there’s new work that could be done. He said that had a shot to be at the forefront of the wave and got to see it.

Advice

For anybody else that maybe listening, find a spot where there’s new ground that you can contribute to and just dive in and do what you can to solve a problem to make it better. You’ll catch your wave.

[21:00] – How to pick frameworks

Node frameworks

There was a Reddit thread about Node frameworks in 2017 that listed out all the possible frameworks. The classic answer is to use the right tool for the right job but Mike’s answer is: Node has grown so big that different frameworks are built to different people on the learning curve of Node. The other thing that Node has done is they have this culture of really running away from any Monolithic one-size-fits-all solution. The community of Node has made sure that they make space for an incredible diversity of solutions and frameworks.

Antipattern

The anti-pattern is: what is the best framework of 2017. That’s the wrong question in the Node culture. Look at your team, look at your project, what framework can you be most productive in and what framework can you contribute back into the community with? That is one of the key reasons that Node itself has remained and continued to grow in popularity.

[23:40] – Role in Sails and Trails

Mike’s not contributing to the Sails project at the moment. He has been focusing on the Trails project. He has written a couple of Trails packs or the equivalent of plug-ins, messed around with GraphQL. He is also helping answer questions in the Gitter chat – small ways.

[24:25] – Best ways to contribute

Stack Overflow

Go on to Stack Overflow. Subscribe to tags where you can answer questions. Every answer on Stack Overflow is a contribution. Go, watch, subscribe to the issue queues for the projects that you use. Just even sharing your experience with how you solve a problem, there is somebody that you could reach down to and answer their questions that take their burden off.

Gitter

Get involved in the Gitter chat. Listen, watch, stand on the sidelines, and see what’s going on how the community works.

Pull request

The next step, if you see a problem, submit a pull request, listen to see what the roadmap is, and see what you can contribute.

Infrastructure

A lot of projects need help in infrastructure in their build scripts to produce better-written code. You can document for them. If you wait for the next sexy thing to do, you’ll never get there. Be humble.

Fun

Remember that open-source is fun. If it becomes a drag, you are doing it wrong. Look for the opportunities that are aligned with what you do so it’s a fun, happy experience.

[26:45] – What are you working on now?

Raise Marketplace

Currently, Mike is taking on a new role as Director of Front-end Engineering at Raise Marketplace. It is a marketplace start-up in Chicago. His focus is rebuilding the front-end of Raise on a micro service Node.js in Go service architecture. They have also been listed to help some folks at Google in the web performance team. They are always hiring. If you are looking for a remote role for a start-up. Feel free to reach out to him on Twitter or on Raise.

ModernWeb

Mike’s side-project now is a website called ModernWeb.com, where they help connect companies with teams of software developers and tell the stories of those software projects. A lot of developers are great at writing code but are terrible at telling the awesome things that we do. So, ModernWeb exists to tell the stories of development. The great side effect is companies want to work with you when you tell your stories. They help complete that circle. Go over to ModernWeb.com and you can contact them through the website or you can drop him an email at mike@modernweb.com.

Picks

Mike Hostetler

• App: OmniFocus
• App: Sleep Cycle
• App: Life Cycle
• Zapier
• Twitter: @mikehostetler
• Mike-hostetler.com

Charles Max Wood

• Talk: Setting up and Contributing to Open-source Projects by Kent C. Dodds
• JavaScript Jabber Slack

JSJ 276: Vue.js with Maximilian Schwarzmüller         

This episode of JavaScript Jabber features panelists AJ O’Neal, Aimee Knight, and Charles Max Wood. They talk with special guest Maximilian Schwarzmüller about Vue.js. Tune in to find out more!

[00:02:21] Introduction to Maximilian

Maximilian lives in Germany and is a self-taught web developer. He mostly teaches web development on Udemy and his YouTube channel. Vue.js is just one topic that he teaches. He enjoys teaching and passing on information to other web developers: he believes it is the best thing you can do.

[00:03:10] What other courses do you teach?

He tries to cover basic web development topics. On Udemy Maximilian teaches Angular and generic JavaScript courses. He also teaches courses on Angular and Node.js. On his YouTube channel he teaches more back-end development and Node.js courses.

[00:04:00] Elevator Pitch for Vue.js

Vue.js is a new framework that is popular because it is similar to React but also has Angular features. It is easier to learn than React: not everything is in JavaScript and JXS is not included. It is more also flexible and has better performance than Angular 1. Vue.js is easier than Angular 2 both to learn and master. It is still a JavaScript framework, where developers build single page applications or drop in existing applications to enhance views, control parts of a page with JavaScript, get rid of jQuery, and have an easier time creating applications.

[00:05:10] What are some challenges people run into as they learn it?

If developers are brand new to Vue.js, getting started is easy. It has one thing that a lot of frameworks lack which is awesome documentation. Vuejs.org has a comprehension guide that makes getting started simple. There is a general idea that developers still need to learn of how to structure the app, which is similar to React. Developers have to learn how to build components which is used to build the application. The build template is where everything is controlled with Vue.js. JavaScript code is used as well as template syntax.

[00:06:27] So you build the template and then tell it how each part is supposed to behave with JavaScript?

Yes. To get started use Vue instances, which are JavaScript objects, control parts of the page and it is marked by an id on an HTML element. Then, write a Vue template, which is basically HTML code where extra features can be used to easily output a variable. It makes it much easier to control via Vue instance. Then add a code, add a method which changes the property of Vue instance. It works together and is easy to build up templates and control your page with Vue.

[00:11:12] Vue’s Advantages

That depends on the application. Vue.js is easier to learn, which is an advantage when trying to get new developers. The documentation on the website is excellent, which helps when learning the language. Vue also has it’s own single team that develops it’s products, such as the Vue Router and Vue X. It has better performance, but for extremely big projects Angular 4 may be better.

[00:13:38] Does Vue have routing in it?

Vue.js has its own router. The core Vue team develops it, which is a different package that is downloaded separately. The advantage to this is that if you don’t need the router, then you don’t have it in your bundle but can easily add it. Once it is added it integrates nicely.

[00:14:16] How does the Vue router compare to the React router?

The Vue router offers the same features as the React router: nested routes, passing parameters, route guards, etc. The Vue router integrates nicely into the Vue package. It also injects into every component you have and is very simple. All that has to be done is just to execute one line of code and then the router is in the project.

[00:17:10] How often is Vue.js upgraded and how hard is it to keep up?

Vue.js only has two versions. Upgrading from Vue 1 to Vue 2 is easy. The base syntax and framework is still the same, you just need to adjust and move on. Since Vue 2 they released bigger upgrades. There so far haven’t been any issues upgrading, they have added new features, and still use the old code.

[00:19:09] What is the feature with Vue as far as adoption goes?

It is hard to predict but there are indicators that Vue.js has a good future. Vue.js probably will not overtake Angular but it is becoming important for companies in Asia, which is an important market. They have developed an Ionic version of Vue.js. There has also been an ongoing trend on GitHub.

[00:21:20] Why do we keep having new frameworks and versions?

The language of JavaScript itself is seeing rapid development. New features have been added, new web technologies developed, etc. One reason is that developers do more on the web. They want easier ways of building applications. There is no perfect framework so there has to be tradeoffs between the frameworks. There is no perfect solution for every application so need a framework for every application.

[00:23:16] What is left undone in Vue.js?

It is complete as far as something can be complete. Developers are working on service rendering to improve search engine optimization and initial rendering performance. They are also working on progress web app support.

[00:28:02] What drives the way that Vue grows?

There is simplicity in their documentation. While the documentation is simple, the framework is also easy to learn. Maximilian believes that the reason Vue.js took off is because the documentation and framework work together nicely.

[00:31:19] What is going to keep Vue around?

The support is not based on corporation, but there is an Asian company that is developing a framework that uses Vue to with their own product. Because of this, can draw an assumption that they will keep Vue.js around. Vue.js also has a strong community and core team, giving it a good support system.

[00:34:15] What are people using if they want to use Native Apps but they want to use Vue?

They are having a hard time right now. Frameworks for Quasar and Weex are in the early stages. A Vue.js app needs to be built but there are packages that are working in that direction.

[00:37:25] How do you structure your Udemy courses and what do you think of that as a whole?

Maximilian started teaching Udemy courses about one and a half years ago. He really enjoys teaching. Each course follows a similar pattern. He starts with a rough topic, researches the topic to see what is in demand, and builds a course around projects. He then fits all the things he wants to teach into the project, plans the course curriculum, records and edits the lecture videos, and then finally releases the course.

[00:39:22] What do you get the most questions about with your Vue course?

Questions are mixed. Students dive into the course quickly but then pause. Most questions are about the basics. They usually have something to do with the first few sections of the course or setup problems.

Picks         

AJ:

• Broke Eatery 
• Dream Dinners

Aimee:

• Julie Evans blog 
• Nodevember

Charles:

• The Ketogenic Diet
• 2 Keto Dudes Podcast 

Max:

• Nuxt.js Framework 
• Slack “Chat with yourself” Channel

Links

• Onsen UI for Vue
• Twitter
• Youtube
• https://academind.com/
• Utemy Vue.js Course 

MJS 032: Feross Aboukhadijeh

Today's episode is a My JavaScript Story with Feross Aboukhadijeh. Feross talked about his contributions to the JavaScript community to the decentralized web. Listen to learn more about Mike!

[01:00] – Introduction to Feross Aboukhadijeh

Feross was on episode 155 and he talked about Webtorrent. It was 2 years ago.

[01:35] – How did you get into programming?

Toddler

Feross has always been interested in computers and technology. His mom told him a story about how when he was a toddler, he was always watching people whenever they’re using technology – the television, the microwave, or the VCR. She said that he’s trying to imitate what he saw.

HTML and Web proxies

According to Feross, he became seriously interested when he was in middle school when he learned about HTML and wanted to make a personal site. In high school, there was this class that you could take. It’s a tech team where they went around and fixed teachers’ computers because they were understaffed. Some of the computers have administrator privileges turned on for the student accounts as well because some of the software that was required for certain classes needed it. The computers always had viruses on them because people would install first-person shooters and play during class time. They actually have school-wide filtering system so students can’t access certain sites. One of the categories they blocked was downloading sites. In order to even do their job, they have to figure out web proxies to get around the filters. He ended up setting up one of those on his own server.

First website

Feross’ real programming experience was PHP. It was in his junior year of high school. He bought a book in Barnes & Noble about PHP and MySQL. He wanted to build a site to host his favorite flash animations. That project was a database-driven website where people can segment their flash animations and soundboards, prank phone calls, and other internet humor. The site was called freetoflash. That was the first website that he built.

[07:10] – How did you get into JavaScript?

Feross thinks JavaScript is one of those languages that you don’t actually really bother to sit down and learn. There weren’t any good resources. According to him, He really didn’t know JavaScript until he started a company right after he graduated from college. He started taking JavaScript seriously because he was learning Node.js and realized that you can build real things from it. The start-up is called PeerCDN. They’re trying to make a content delivery network that would work in the browser using WebRTC. The idea is you would add a script tag to your website and then we would try to find other people visiting your site that already has the content that you want, you’ll fetch it from them over a peer-to-peer connection to save on your hosting build to reduce your CDN bill. That was a big Node application. It also has intense front-end component. He started learning about NPM, how you build things with microservices, and how do you deploy a JavaScript application. That was in 2013.

[09:35] – Webtorrent

Feross has been trying to transition Webtorrent into a distributed contribution model. It’s always been something that he would give out commit rights. If someone makes a good contribution, he’ll just add them to the Github for it. He recently made it into an organization on Github. He’s hoping to make it something that’s not completely dependent on him in order for it to continue existing. He’s going to be involved with it for the foreseeable future but he’s also trying to do new projects as well besides that. The good news is Webtorrent is mostly done in some sense. It works well. There are bugs. But if you use Webtorrent, especially if you use the desktop application to torrent things, it’s really polished and works nicely.

Picks

Feross Aboukhadijeh

• Decentralized web
• Dat Project
• Beaker Project
• IPFS
• Secure Scuttlebutt
• Patchwork
• Brave
• Twitter: @WebTorrentApp
• Twitter: @feross

Charles Max Wood

• Let’s Encrypt
• Digital Ocean

JSJ 277: Dojo 2 with Dylan Schiemann and Kitson Kelly

This episode of JavaScript Jabber features panelists Aimee Knight, Cory House, and Charles Max Wood. They talk with Dylan Schiemann and Kitson Kelly about Dojo 2.

[00:02:03] Introduction to Dylan Schiemann

Dylan is the CEO at Sitepen and co-founder of the Dojo Toolkit.

[00:02:22] Introduction to Kitson 

Kitson is the CTO at Sitepen and project lead for Dojo 2.

[00:02:43] Elevator Pitch for Dojo

Dojo 1 has been around forever. Started back in 2004 as a way to solve the challenge of "I want to build something cool in a browser." Promises and web components were inspired by or created by Dojo. It's been a huge influence on the web development community.

Dojo 2 is a ground up re-write with ES 2015, TypeScript and modern API's. It's a modernized framework for Enterprise applications.

[00:04:29] How is Dojo different from other frameworks?

There's a spectrum: small libraries like React with an ecosystem and community of things you add to it to Angular which is closer to the MV* framework with bi-directional data binding. Vue lands somewhere in the middle. Dojo 2 is also somewhere in the middle as well. It's written in TypeScript and has embraced the TypeScript experience.

[00:06:00] Did the Angular 2 move influence the Dojo 2 development and vice-versa?

Dojo 2 had moved to TypeScript and 2 days later Angular announced that they were going to TypeScript. Angular also moved very quickly through their BETA phase, which caused some challenges for the Angular community.

With Dojo 2, they didn't start the public discussion and BETA until they knew much better what was and wasn't going to change. They've also been talking about Dojo 2 for 6 or 7 years.

The update was held up by adoption of ES6 and other technologies.

Dojo 1 was also responsible for a lot of the low-level underpinning that Angular didn't have to innovate on. Dojo 2 was built around a mature understanding of how web applications are built now.

People doing Enterprise need a little more help and assistance from their framework. Dojo provides a much more feature rich set of capabilities.

Angular could have pushed much more of TypeScript's power through to the developer experience. Dojo much more fully adopts it.

It's also easier if all of your packages have the same version number.

Call out to Angular 4 vs Angular 2.

[00:12:44] AMD Modules

Why use AMD instead of ES6 modules?

You can use both. Dojo 2 was involved in the creation of UMD. James Burke created UMD while working on Dojo.

ES6 modules and module loading systems weren't entirely baked when Dojo 2 started to reach maturity, so they went with UMD. It's only been a few months since Safari implemented the ES6 module system. Firefox and friends are still playing catchup.

The Dojo CLI build tool uses webpack, so it's mostly invisible at this point.

So, at this point, should I be using UMD modules? or ES6? Is there an advantage to using AMD?

With TypeScript you'd use ES6 modules, but UMD modules can be loaded on the fly.

[00:16:00] Are you using Grunt?

Internally, for tasks we use Grunt. But for users, we have a CLI tool that wraps around Webpack.

For package builds and CI, Grunt is used.

[00:18:30] What is the focus on Enterprise all about?

There are a lot of different challenges and complexities to building Enterprise apps. Dojo was the first framework with internationalization, large data grids, SVG charts, etc. Dojo has spend a long time getting this right. Many other systems don't handle all the edge cases.

Internationalization in Angular 2 or 4 seems unfinished.

Most Dojo users are building for enterprises like banks and using the features that handle large amounts of data and handle those use cases better.

[00:21:05] If most application frameworks have the features you listed, is there a set of problems it excels at?

The Dojo team had a hard look at whether there was a need for their framework since many frameworks allow you to build great applications. Do we want to invest into something like this?

React has internationalization libraries. But you'll spend a lot of time deciding which library to use and how well it'll integrate with everything else. A tradeoff in decision fatigue.

In the Enterprise, development isn't sexy. It's necessary and wants to use boring but reliable technology. They like to throw bodies at a problem and that requires reliable frameworks with easily understood decision points.

Producing code right is a strong case for TypeScript and they pull that through to the end user.

Many frameworks start solving a small set of problems, become popular, and then bolt on what they need to solve everything else...

Dojo tried to make sure it had the entire package in a clear, easy to use way.

You can build great apps with most of the big frameworks out there. Dojo has been doing this for long enough that they know where to optimize for maintainability and performance.

[00:29:00] Where is Dojo's sweet spot? 

The Sitepen Blog series on picking a framework

The biggest reason for using Dojo over the years is the data grid component.

They also claim to have the best TypeScript web development experience.

You may also want a component based system with the composition hassles of React.

The composability of components where one team may write components that another uses is a big thing in Dojo where one person doesn't know the entire app you're working on.

Theming systems is another selling point for Dojo.

[00:34:10] Ending the framework wars

Try Dojo out and try out the grid component and then export it to your Angular or React app.

There are a lot of frameworks out there that do a great job for the people who use them. The focus is on how to build applications better, rather than beating out the competition.

Sitepen has build apps with Dojo 2, Angular, React, Dojo + Redux, etc.

[00:39:01] The Virtual DOM used by Dojo

2 years ago or so they were looking for a Virtual DOM library that was small and written in TypeScript. They settled on Maquette.

The more you deal with the DOM directly, the more complex your components and libraries become.

Makes things simpler for cases like server side rendering getting fleshed out in BETA 3.

It also allows you to move toward something like React Native and WebVR components that aren't coupled to the DOM.

They moved away from RxJS because they only wanted observables and shimmed in (or polyfilled) the ES-Next implementation instead of getting the rest of the RxJS  that they're not using.

[00:46:40] What's coming next?

They're finishing Dojo 2. They're polishing the system for build UI components and architecture and structuring the app. They plan to release before the end of the year.

They're also wrapping up development on the Data Grid, which only renders what shows on the screen plus a little instead of millions of rows.

[00:49:08] Testing

They've got intern.

It pulls together unit testing, functional testing, continuous integration hooks, accessibility testing, etc.

It's rewritten in TypeScript to take advantage of modern JavaScript.

The Dojo CLI uses intern as the default test framework.

Kitson build the test-extras library to help with Dojo testing with intern.

Dojo Links

• dojo.io
• github.com/dojo/meta
• sitepen.com/blog
• gitter channel
• github.com/dylans
• twitter.com/dylans
• twitter.com/sitepen
• twitter.com/dojo
• github.com/kitsonk
• twitter.com/kitsonk

Picks

Cory

• Amateur vs Professional

Aimee

• DevFest Florida (use code 'jsjabber')

Chuck

• Taking some time off
• AudioTechnica ATR2100
• How to define your life purpose in 5 minutes

Dylan

• zenhub
• HalfStack Conference
• How to choose a framework series on the Sitepen Blog

Kitson

• Dunbar Number