JavaScript

  
Last updated December 16, 2021
ThemingModule Development

JavaScript (JS) is an interpreted programming language that is widely used on the web to control web page behavior and interactivity. Drupal core has several JavaScript libraries included, and many websites today use JavaScript in some capacity to improve the website experience.

Example tasks

  • Learn how to use JavaScript to provide client side animation and functionality
  • Understand how to incorporate a third party JavaScript library into a Drupal site
  • Learn about the JavaScript libraries included in Drupal

Confidence

While JavaScript frameworks and utilities are released at a rapid pace, JavaScript itself is a foundational technology. Drupal's interface for working with JavaScript asset libraries and the API provided by Drupal for working with JavaScript are unlikely to change substantially in the near future.

Drupalize.Me resources

Collection

Get Started Using React and Drupal Together

Theming, Module Development, Drupal 10, Drupal 9, Drupal 8
14 tutorials
Loading ...
Topic

JavaScript in Drupal

Theming, Module Development, Drupal 10, Drupal 9, Drupal 8, Drupal 7
More information

JavaScript files are included by a module or a theme by creating an asset library. Using this asset library system you can selectively choose which files to load, overwrite existing files, or customize them to suit your needs.

Tutorial

Overview: JavaScript in Drupal

Theming, Drupal 8, Drupal 9, Drupal 10
More information

JavaScript is used and loaded in special ways within a Drupal site. JavaScript is loaded via asset libraries and Drupal core provides a bunch of different JavaScript libraries that you can load and use in your module or theme. This tutorial provides a brief orientation to some of the JavaScript included in core.

In this tutorial we'll:

More Guides

We have guides on many Drupal skills and topics.

Explore guides

External resources

  • The Modern JavaScript Tutorial (javascript.info/)
    • How it's done now. From the basics to advanced topics with simple, but detailed explanations.
  • MDN JavaScript (developer.mozilla.org)
    • Tutorials for beginners through advanced, along with a wealth of reference materials.
  • Learn JavaScript (codecademy.com)
    • Interactive tutorial site where you can code in the browser as you work through the lessons.
  • HTMLDog JavaScript Tutorials (htmldog.com)
    • A whole set of tutorials for beginner through advanced. They have a full suite of HTML and CSS tutorials as well.
  • Superhero.JS (superherojs.com)
    • A best practice collection of articles, videos, and presentations to help you learn JavaScript.
  • JavaScript for PHP Geeks (symfonycasts.com)
    • A series of video tutorials on JavaScript, specifically with a PHP developer audience in mind. From our friends at SymfonyCasts.

JSX

Learn more about JSX: