Skip to main content
SimilarExport ZIP
100%

DocPad is great.... but so is Grunt. Use grunt-contrib-connect and grunt-contrib-watch instead of docpad's server and watcher.

✓ Published0🌍 Public
HHypercubed
Last edited Oct 6, 2013
Created on Oct 5, 2013

This example shows a Grunt-based build workflow that replaces DocPad’s built-in server and watcher with grunt-contrib-connect and grunt-contrib-watch, enabling live-reload during static site generation. The configuration defines a `docpad` task that watches `src/**/*.*` files and triggers a shell command to regenerate output into the `out` directory, while a separate watch task monitors `out/**/*` for live-reload. The `connect` server serves the generated `out` folder on port 9778 with livereload enabled, and tasks like `generate`, `server`, and `run` orchestrate clean builds and continuous development. The code relies on Grunt’s task registry, `grunt-shell`, `grunt-contrib-watch`, `grunt-contrib-connect`, and `grunt-contrib-clean` to handle file watching, HTTP serving, and cleanup.

AI-generated description

Similar vizzes

Loading thumbnail…

DocPad: rsync Deploy Script

This example shows a shell script that automates deploying a static website via rsync to a remote server. It defines environment variables for the source directory, destination directory, server, and account, then runs `docpad generate` to build the site before syncing files. The script supports a dry-run mode with the `-n` flag and excludes specified patterns like `.git` and `.svn` using a `.deployignore` file. It relies on the `rsync` command-line tool and the `docpad` static site generator, with the deployment target specified as a user@host:path.

HHypercubed
62% match
Loading thumbnail…

Drafting and publishing a blog post (in docpad) using [frontman](https://github.com/Hypercubed/frontman)

This example demonstrates how to draft and publish a blog post using the frontman command-line tool within a DocPad project. It shows the workflow of creating a new post from a draft template and then publishing it to a dated archive directory. The code uses frontman’s `new` and publish commands, with CSON configuration files (`draft_post.cson` and `publish_post.cson`) that specify metadata like layout, status, and output directories. The publish template dynamically computes the current date to set the post’s `date` field and target folder, while the draft template defaults to a `draft` status and `src/drafts/` output.

HHypercubed
57% match
Loading thumbnail…

Gist 467901440093a9904541

This example demonstrates a Gulp task that automates the generation of critical CSS for a WordPress theme. It shows the process of downloading a remote stylesheet, analyzing its rules, and extracting only the styles needed for above-the-fold rendering of a specific page. The task uses the `request` library to fetch the CSS file, `criticalcss` to parse and evaluate the rules against the target URL, and the Node.js `fs` module to write the resulting critical CSS to a local file.

GGolodhros
48% match
Loading thumbnail…

random shell stuff

This example demonstrates a shell-scripting workflow for scaffolding interactive data-visualization projects, showing how to automate the setup of a project directory structure and download essential JavaScript libraries. The script creates nested folders for images, stylesheets, scripts, and CoffeeScript sources, then fetches libraries such as d3.js, polymaps.js, underscore.js, and backbone.js via curl. It also generates a CoffeeScript starter file and a Rakefile with a watch task for compiling CoffeeScript to JavaScript. The visualization itself is not rendered; instead, the code focuses on environment preparation and dependency management.

CCaged
48% match
Loading thumbnail…

Gist 74fe605a7286aaa4f524

This example demonstrates a command-line and file-management reference guide, showing terminal commands for Windows cmd, Putty, and Meteor.js setup alongside a simple to-do list app creation workflow. The visualization presents the commands and directory structures as a static educational cheat sheet, using plain text and formatting to organize the information. No JavaScript libraries or data APIs are employed; the content is rendered directly from the gist’s source code. The data source is the textual documentation authored by Darius9, displaying commands like `cd`, `rm -rf`, and `meteor create` without interactive behavior.

DDarius9
46% match
Loading thumbnail…

Gist fa674a3db25bd721df50e36efa7736b3

This example demonstrates a Dockerized React application configured for development, testing, and production deployment using Dockerfiles and docker-compose. The development setup mounts source code as a volume, enables live reload, and runs tests via a separate service, while the production build uses a multi-stage Dockerfile that compiles the app with `npm run build` and serves static files through Nginx. Travis CI automates the pipeline, building the Docker image, running tests with `npm run test -- --coverage`, and deploying to AWS Elastic Beanstalk. The code leverages React’s development server and Node’s Alpine image for a lightweight containerized workflow, though no external data-viz libraries appear in this configuration.

HHuyAms
46% match
Loading thumbnail…

overall workflow

This example demonstrates the development workflow for creating and publishing interactive data visualizations. It uses a starter template with custom D3.js and lodash utilities, and shows how to generate random data, draw axes, and render circles with tooltips. The code includes a build process with command-line tools like `degit`, `hot-server`, `gistsnap`, and `gistup` for scaffolding, local previewing, screenshotting, and publishing to bl.ocks. The visualization itself is rendered as an SVG with a scatterplot of randomized points.

11wheel
46% match
Loading thumbnail…

Pandoc bash conversion

This visualization demonstrates a user’s workflow of converting and renaming files across directories using shell commands. It shows three distinct bash operations: deleting HTML files in a specific folder, converting sociology files to DOCX via Pandoc, and renaming XML files to HTML using the `rename` utility. The code relies on standard shell scripting constructs and the Pandoc command-line tool, with no graphical or interactive rendering libraries like D3 or Three.js. The data source is the local file system paths referenced in each command, and the rendering approach is purely textual—showing the raw bash scripts rather than any visual output.

CCliffordAnderson
46% match