Home

DMN interactives app

The DMN interactives app helps expedite creating and publishing custom stories and interactive features within our house template.

Why an app?

Using an app may seem like a lot of overhead for publishing a single webpage, but consider the entire process of creating and publishing that page.

The purpose of the app is to boil down the often tedius setup and publishing steps into a few simple commands that guarantee consistent production. It encapsulates an entire workflow, from downloading the latest house templates to preparing and optimizing the files to easily publishing the page on our cloud servers.

Here are some of the major features of the app:

• Scaffolds your project's development directory, shortcutting setup time.
• Downloads and bundles your dependencies into single, minified files.
• Compiles SCSS files.
• Bundles and minifies CSS and JS files.
• Populates metatags from a JSON file for SEO.
• Creates responsive image sets optimized for mobile devices.
• Publishes your project to an Amazon S3 bucket (our cloud).
• Creates an archive of your development directory so you or anyone else can pick up your project exactly where you left it.

Who is this app for?

This app is principally designed for people who create "interactive" pages as part of their regular work. It's built with lots of helpers to expedite many of the repetitive tasks they encounter on each project.

That said, anyone with the capacity to learn basic HTML and CSS can learn to use this app to create and publish interactives. In fact, it will be significantly easier to learn to use this app than to learn all the parts of creating and publishing templates without it. That's the point.

Ask a data or interactives team member to help you set up your computer, read this detailed guide carefully before you start a project and keep it handy during your work.

---

Using the app

1. Setting up your computer

2. Starting a new project

3. Working in the development directory

4. Working with HTML templates

5. Working with static files

6. Publishing a project

7. Restarting a project from an archive

Don't forget to checkout the Code Cookbook for copy-paste code blocks.

---

Changelog

0.2.3

• Add jshint to javascript task queues.
• Using custom comparator for image process caching via gulp-changed

0.2.1

• Removes preview and publish directories. All build files rendered into public folder for publishing.
• Uses bower to install dependencies. (You'll need to install bower via npm install -g bower, if you haven't.)
• Caches published files so you won't need to re-upload files that haven't changed on subsequent uploads.
• Uses sourcemaps for minified, uglified javascripts and stylesheets.

---