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!

Stackbit - Sponsor

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.

Show Notes

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

Links

Syntax 039: Is jQuery Dead?

Tweet us your tasty treats!

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