Edit on Github

Thanks for checking us out! Toolkitchen is in pre-alpha mode and only the daring need apply. Before you dive in, we recommend checking out our FAQ for more information on the project.

Toolkitchen is a new type of library for the web, built on top of Web Components, and designed to leverage the evolving web platform on modern browsers.

Quick start

  1. Clone the project to your app’s root older. See Get the code.

     git clone git://github.com/toolkitchen/toolkit.git --recursive
  2. Fire up a web server in your app’s directory.
  3. Include toolkit.js in your main page:

     <script src="toolkit/toolkit.js"></script>
  4. Read the Getting Started guide.
  5. Learn how to soup-up your web components using the Toolkit kernel.
  6. Play with the toolkit-ui examples (also must be run from a web server).
  7. Join the mailing list! Ask questions and give feedback.

Custom element markup

What is the Toolkitchen?

Toolkitchen is comprised of two efforts:

  • A set of core platform features (Shadow DOM, Custom Elements, MDV). Initially, these core features will be enabled with a set of polyfills. As browsers begin to implement these new primitives, the polyfill platform layer becomes smaller and better over time.
  • A next-generation web application framework built upon these core technologies called the Toolkit.

The architectural stack looks like this:

Architectural Diagram

Guiding principles

The overall aim of the toolkit is to manage the complexity of building web applications. Our principles are:

Everything is a component — Encapsulation is the key to creating scalable, maintainable applications. All Toolkit resources are components, even ones that are non-visual. To construct an app, a developer creates new components, or uses ones the Toolkit provides, and assembles them together. Focusing on individual, composable building blocks allows developers to “think locally” about their application, reducing complexity. With this divide-and-conquer approach, applications can simultaneously be simple and arbitrarily complicated.

Extreme pragmatism — Developers should write the minimum amount of code possible to create their application. Anything repetitive should be re-factored into a component, handled by the Toolkit itself, or added into the browser platform itself. The Toolkit provides simple syntax without reducing features, and avoids boilerplate wherever possible.

Salt to taste — Use as much or as little of the framework as you wish. An application can choose to only load toolkit/platform/platform.js to take advantage of the polyfills, or add toolkit/toolkit.js to provide extra batteries for web components. We call this a “Toolkit component”.