A great dev experience

We want devs to have to write as little repetitive and boilerplate code as possible.

Engineers shouldn't need to ask "what color should this box be" or "how big is this font".

Adhering to standards

The JDS tries to stay close to the native developer experience of HTML and VueJS.

For example, the JDS prefers element composition — think of HTML label and input tags — over passing values as props. Instead, props are used for auxiliary behavior and configuration.

Likewise, the JDS form validation system builds on top of how a developer would simply bind their variables using v-model to HTML input elements, rather than introducing a new paradigm.

Predictable & responsive

The JDS strives to minimize custom type formats and conventions that would require a learning curve.

  • Props are always a single, native data type, such as a string or number. No complex configuration objects.
    • Exception: embedded formats when sensible, such as passing a vue-router-compatible Route.
  • Configuration is always explicitly as narrow and specific as possible. Prefer future versions of the JDS to open up new options or allow more flexibility, rather than support it now.
  • Elements will emit warnings and errors to help developers understand when they're being misused.
JOBILLA DESIGN SYSTEM