loading... Pacem JS

Introduction

Pacem JS is an ecosystem of reusable web components, built on the browser's own Custom Elements. It follows the MVVM pattern, with a binding syntax of its own, and it's written in TypeScript.

There's no root component and no bootstrap call: drop the elements into any page and they bind themselves, on the fly. This is a complete, working piece of Pacem JS:

<pacem-data id="profile" model="{ name: 'Ada' }"></pacem-data>

<pacem-input-text value="{{ #profile.model.name, twoway }}"></pacem-input-text>
<pacem-text text="{{ 'Hello, ' + #profile.model.name }}"></pacem-text>

At a glance

Why another JS framework?

Many reasons. First of all, I (Cristian Merighi) have no more time to spend switching from one technology trend to another, then to yet another, and so on and so forth... That's what happened to me vs JavaScript frameworks over the years. Definitely out of jQuery, and having learned to love the MVVM pattern years before (with WPF and Silverlight), I stumbled upon KnockoutJS: it was good, and I built a piece of my client-side "world" on top of it. Then came AngularJS, which was better: I rebuilt my previous world, plus many others, on top of it. Then came Angular (2+), even better, and cool for having TypeScript as its default language: I rebuilt my whole universe on top of it (one whole month to learn it and migrate the code).

That was it!

Besides, I (always me) couldn't find anything that fitted my desiderata:

Experimenting was another big push, and TypeScript made the decision to start an easy one.

What it is, what it isn't

Pacem JS is meant for internal use at Pacem, in web and cross-platform apps alike. It targets modern, evergreen browsers: no legacy ones, no polyfills.

Pacem JS doesn't want to be adopted: it aims to demonstrate that you can build your own.

Born as a prototype, it has grown into a broad toolbox: forms and scaffolding, charts, maps, 2D and 3D, a theme engine. It isn't perfect, but it's worth playing with.

This documentation site is itself a SPA (and PWA) built with Pacem JS.