Skip to content

heshanlk/drupal_block_reactive

 
 

Repository files navigation

Drupal Block Reactive (codename Hipster)

Drupal 8 module creates a block with recent comments. Displayed dynamically using React.js.

ES2015 (ES6) is used via Babel and npm scripts.

The goal of the module is to be as simple as possible: minimum dependencies, tools and steps to actually write ES6 code that works. This way, developers can play easily without too much hassle of setting up webpack for example.

Requirements

  • node.js for using npm. The internal API is based on Views.
  • npm for package management (comes with node.js)
  • working Drupal 8 project
  • command line to make your life easier

Installation

  1. Go to the /modules folder in your Drupal 8 project (normally DRUPAL_ROOT/modules)
  2. Clone this repository (or download a zip with the source)
  3. Enable the Drupal module by drush pm-enable drupal_block_reactive or via the UI
  4. Go to the block management page '/admin/structure/block' and find/place the custom module 'Recent comments (reactive)'
  5. Go to the page where you placed the block and you should see 'No comments.' message in a block.

Now, play with the reactivity by splitting the window into 2 and posting a comment from one to the other. The expected modern behavior :)

If you want to modify the /js, run npm install to download dependencies and gulp to write ES6 code.

Demo

ScreenShot

Inspirations

About

Drupal 8, ES2015 (w/ Babel) and React.js

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 80.5%
  • PHP 19.5%