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! 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.
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 - SponsorBuild 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 Notes3:08 - What is a frontend framework?
- JavaScript based
- Controls applications such as:
- Routing
- Rendering
- Data Fetching
- Examples:
- React
- Angular
- VueJS
- Ember
- Backbone
- Svelte
- Controls applications such as:
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
- Example:
- 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
- Scott’s Instagram
- LevelUpTutorials Instagram
- Wes’ Instagram
- Wes’ Twitter
- Wes’ Facebook
- Scott’s Twitter
- Make sure to include @SyntaxFM in your tweets