Quickstart: Graph Applications & Outlook

This page continues the Quickstart: Hybrid Model & Compliance. You need the my-infra-graph project from the previous steps.

Adding a Simple Application

Goal: Serve a minimal custom web page from the graph that queries and displays live node counts. This demonstrates how rescile-ce can serve static applications directly alongside your graph.

Create the app directory and add a single HTML file:

mkdir -p data/app

data/app/index.html

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>My Infra Graph</title>
  <style>
    body { font-family: sans-serif; max-width: 600px; margin: 4rem auto; }
    #count { font-size: 3rem; font-weight: bold; color: #2563eb; }
  </style>
</head>
<body>
  <h1>Infrastructure Graph</h1>
  <p>Total nodes in graph: <span id="count">…</span></p>
  <script type="module">
    const res = await fetch('/graphql', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ query: '{ countNodes }' }),
    });
    const { data } = await res.json();
    document.getElementById('count').textContent = data.countNodes;
  </script>
</body>
</html>

Restart rescile-ce (or it will hot-reload automatically) and open http://localhost:7600 — the dashboard will show My Infra Graph listed under Module Index. Click the link to see the live node count pulled directly from your graph.

The data/app/ directory is served as a static web application by rescile-ce. Any HTML, CSS, or JavaScript you place here can query the /graphql endpoint to build richer dashboards. For more complex applications (React, Vite, API proxying) see the Application Module Developer Guide.

Outlook

The data/ directory is the heart of every rescile project. Each subdirectory corresponds to a processing phase:

Directory	Phase	Purpose
`data/assets/`	Asset Loading	CSV ground-truth files — one file per resource type
`data/models/`	Model Application	TOML architectural models that derive and connect resources
`data/compliance/`	Compliance Application	TOML governance rules that mutate and enrich the graph
`data/output/`	Output Generation	TOML output definitions that generate structured artifacts

For a deeper explanation of the directory structure and how to modularise it, see The Data Directory.

Rather than writing all blueprints from scratch, you can load reusable Modules — self-contained directories of models, compliance rules, outputs, and optional web apps, defined by a module.toml manifest.

# Load a remote compliance module alongside your local data
rescile-ce serve \
  --module https://github.com/rescile/rescile-ccm-lite.git \
  -d ./my-project/data

Your local data/ directory acts as the final overlay, allowing you to inject local assets or override module logic. For a full introduction to modules, see Using Modules.