Introduction

pagio is a drag & drop library that lets you build your own page building application.

pagio is meant for developers who want to render large numbers of pages, using

• their own components
• their own rendering strategy, i.e. SSR
• their own data sources

Basic principles

The main idea behind pagio is a page scaffolding tool that does not get in your way of how your components look, what content source you are using and how pages are finally rendered.

pagio simply produces a Javascript Object, representing a page tree. The page tree holds references to your components, their position relative to each another and their individual properties.

While dragging and dropping components from a component catalog onto the page canvas, successive page tree updates are reported by pagio.

You may decide how you react on these indidual updates - save it in an API, trigger page re-renders, trigger a versioning system and so forth.

Based on the resulting page tree, it is very easy to render a page:

1. take your data source of choice,
2. combine it with your own React components
3. and render it with your framework of choice.

This works well with static site generators as NextJS and Gatsby.