Platframe

Structured, scalable and modular frontend platform.

Gist

Foundation

Build your frontend or static project on a foundation that is designed to scale. Markup, style and logic are organized in a modular, extensible manner. Resources are structured, resulting in a tree-like file hierarchy that speeds up development through inheritance.

Workflow

Platframe ships with a pre-configured build system, allowing you to focus on development while it takes care of the menial tasks. Provision a development server with live-reload, crank out a build that's optimized for production or extend its configuration to your needs.

Reuse

Bundle your project's common functionality according to the component recipe. Let's cover the implementation steps of a typical component. We'll activate nav-1:

⒈  Call the markup, passing a modifier

+nav-1("next")

⒉  Call the styles, accepting the defaults

nav-1()

⒊  Import and activate the JavaScript

import nav from 'navigation/1/_';

Features

Scalable

The architecture is designed to facilitate growth. Follow the recipe for structuring your frontend assets and scale seamlessly.

Modular

Markup, styles and scripts are modular. Reusable functionality is encapsulated, easing development and maintenance.

Fast

Platframe aims to increase efficiency in both development and production. Hit the ground running with a nimble platform.

Adaptable

With a modular architecture and minimal prescription, choose the amount of framework that best suit your needs.

Stack

Pug

Define document structure with Pug, a performant template engine with JS support and a flexible syntax allowing for terse, modular HTML.

Stylus

Use Stylus for presentation - A CSS superset with unique syntactic flexibility and programmatic features for powerful abstractions.

SVG

Take advantage of support for SVG sprites. Choose between a symbol or a view-based sprite workflow, or use them side-by-side.

Babel

Baked-in Babel support allows you to write next generation JavaScript today, allowing for better, future-proof code.

Rollup

Encapsulate discrete functionality with native ES6 modules and allow Rollup to produce a browser-ready bundle for production.

Grunt

Workflow automation is handled by Grunt. Hit the ground running with the default configuration and modify it as you go.