Hasty Treat - Why Use a Frontend Framework at All?

In this Hasty Treat, Scott and Wes talk about frontend frameworks — what they are, when you need one, how to organize your code for maximum efficiency, and more!

Build modern JAMStack websites in minutes. Stackbit lets you combine any theme, site generator and CMS without complicated integrations. Join the beta today by visiting stackbit.com/syntaxfm.

3:08 - What is a frontend framework?

• JavaScript based
  • Controls applications such as:
    • Routing
    • Rendering
    • Data Fetching
  • Examples:
    • React
    • Angular
    • VueJS
    • Ember
    • Backbone
    • Svelte

5:54 - When to use a frontend framework

• The Link between your JavaScript data and the DOM (your HTML) isn’t live
• The use of frameworks makes re-updating the DOM (after the initial variable update) easy
• You need an opinionated way to handle complexity
  • Example:
    • You add an item to a shopping cart, send the event to the backend, and update both the number of items in the cart and the “Add to cart” button
    • Event Handlers - binding and un-binding
• Your client wants a fast, modern experience
• Seamless routing and page transitions
• Fast prototyping
• Access to battle-tested libraries
  • Security
  • Perf

14:24 - When not to use a frontend framework

• When using CMS like WordPress and Drupal
• A medium amount of JavaScript is needed - Vanilla JS will work fine
  • Modals
  • Slideshows
  • Form submits
• Static pages, no JS functionality
• Updating an existing project

17:20 - Why can’t I just use jQuery?

• Vanilla JS contains all of jQuery’s available DOM APIs
• Frameworks provide structure
• Organizes code for big projects

• Syntax 039: Is jQuery Dead?

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets