JavaScript Frameworks 🖼

iteration

Welcome to Iteration, a weekly podcast about programming, development, and design.

This week — javascript frameworks

What is a JavaScript Framework? How would you explain it?

• John:
  • Concept of a framework, is essentially a collection of best practices and starting points.
  • When you build a fence, you could literally cut down trees and make boards, make nails out of raw iron
    • At Lowe's the other day, they had pre-assembled fence sections. This is what a framework is.
  • Some frameworks offer really prescriptive and complex components, others offer really basic ones. (2x4's vs pre-built fence sections)
  • in JS — It's basically a pre-existing library and collection of JavaScript code you can use to do other things with.
• JP: wrappers around document.querySelector + some sort of state management
  • Programing is all about abstractions —
  • Shared abstractions

Framework vs Library

• Line is blurry here, example: JQuerry, lodash underscore are closer to libraries. These are more collections of useful utilities and functions. Frameworks are more comprehensive. Offer a more end to end solution for back end, front end or both.

JP JavaScript Ecosystem is Frustrating

• https://www.zdnet.com/article/another-one-line-npm-package-breaks-the-javascript-ecosystem/
• This one line change in an npm package broke deploys for one of my sites

The 4 most Popular Frameworks (in order of creation date)

There are SO MANY JS frameworks, feels like new ones every day.

• JQuery:

  • The "Original Gangster". Oldest and biggest project, not the most modern, still heavily used worldwide. Not really a "Framework" with modern JavaScript, it's not really needed, especially if you use one of these other frameworks, it's definitely not needed in my opinion.
  • Github Stars: 53k
  • Initial Release: 2006
    • From JP: https://mootools.net/

• Angular

  • Github Stars: 60k
  • Initial Release: 2010
    • John: It's been years since I've worked in an angular project. It was a previous version of Angular, but it was close to writing HTML, using Vue reminds me of Angular at it's best.
    • JP: Never bothered to touch it! I don't have any opinions on it

• React

  • Github Stars: 148k
  • Initial Release 2013
    • John: I've written a good chunk of react native and react. I've never fallen in love. It's a lot of boiler plate, I don't like JSX and the whole thing just doesn't work the way my brain works. A lot of my projects are perfectly fine with simpler server rendered pages. So I generally don't work in it.
    • JP: On the other hand, I love writing React - I guess as much as any Rails developer can love writing JavaScript. That's right, I said it, I'm a Rails developer.

• Vue.js

  • Github Stars: 164k
  • Initial Release 2014
    • John: I really like Vue because you can just extend existing HTML elements. Handles the data binding and event handling for you. It's lightweight and be brought into all kinds of back ends. Really great for "sprinkles". Don't need a whole SPA but some drag and drop would be good here, or this chat interface needs live reloading.
    • JP: Currently learning Vue and it breaks my brain a little. Let me tell you why...

honorable mentions

• Meteor / Ember / Backbone

Frameworks of Frameworks:

• Next js — New up and coming — Blitz
  • Gatsbty
  • Sails JS

Last Mention

• Stimulus (Mostly for Rails)
  • Initial release 2019
  • John uses heavily, it's like a lightweight Vue customized for Rails.

Tips for Using a JS Framework

• JP: Learn Vanila JavaScript first
• John: Go all in

JP's Pick

https://www.instagram.com/archipics.ig/

John's Pick

Getting back to Basics Beginner JavaScript (Wes Bos Course)

• I'm halfway through a Beginner JavaScript course, 80% of it is really really easy, the other 20% is such good missing pieces.
  • Destructing
  • Methods in JS Objects
  • Understanding Hoisting