Atomic — Drupal distribution baked by Atomic Design
Drupal Meetup Basel
Anton Staroverov
19 October 2017
www.wearewondrous.com
meetup.com/basel-drupal-meetup
Drupal
Content Management
System
You know it!
Drupal
Let's continue...
Fractal
Component Library
What?
Fractal
Fractal is a tool to help you build and document web component libraries, and then integrate them into your projects.
https://fractal.build
Requirements
Fractal
Node.js
Template engines
Fractal
- Nunjucks
- Mustache
- Agnostic!
- Twig?!
Twig Adapter
Fractal
https://github.com/frctl/twig
{% include %}
Twig Drupal Adapter
Fractal
https://github.com/WondrousLLC/
fractal-twig-drupal-adapter
UI Patterns
- Layout API
- Block Layout
- Field Layout
- Field Group
- Display Suite
- Views
- ...
both!
{% include %}
UI Patterns
{% include %}
UI Patterns
Organism-like structures?
Fractal
http://bradfrost.com/blog/post/atomic-web-design/#organisms
{% include %}
UI Patterns
Bricks!
More
- Twig helpers
- Default components
- CSS framework integration
- ...
drupal.org/project/atomic
Thank
You.
@tonystarring
Anton Staroverov
anton@wondrous.ch
Atomic — Drupal distribution baked by Atomic Design
By Anton Staroverov
Atomic — Drupal distribution baked by Atomic Design
Original: https://wondrous.slides.com/wondrousllc/drupal-atomic
