Build, Deploy and Integrate via Praxis

Build custom web components powered by Facets APIs, deploy them to GitHub Pages, and integrate them directly into your Facets dashboard — all through a single conversation with Praxis.

---

Overview

Praxis enables you to create custom web components that extend your Facets experience. Instead of writing code manually, you describe what you need in plain language. Praxis handles the entire lifecycle:

1. Build — Scaffolds a web component application using Facets APIs
2. Deploy — Publishes it to GitHub Pages for hosting
3. Integrate — Provides a URL you can embed as a web component in Facets

---

Prerequisites

Before you begin, ensure the following are in place:

Setting Up Your GitHub PAT

If you haven't registered a GitHub PAT with Praxis yet, simply tell Praxis:

"I need to set up my GitHub PAT"

Praxis will guide you through a secure flow to register your token. The token is encrypted and never visible to the agent.

---

Workflow

Step 1: Describe Your Web Component

Start a conversation with Praxis and describe the web component you need. Be specific about:

• What it should display — tables, charts, dashboards, forms, etc.
• Which Facets data it should use — environments, resources, releases, costs, etc.
• Any interactions — filters, drill-downs, actions, etc.

Example prompts:

"Build me a web component that displays a release history timeline for a selected project and environment"

"Create a web component that lists all resources in an environment with their health status"

Praxis will ask clarifying questions if needed — such as preferred UI framework, chart libraries, or specific API fields to include.

---

Step 2: Praxis Builds the Application

Once the requirements are clear, Praxis will:

1. Scaffold the project — Create a web component application (typically using Lit, Stencil, or vanilla Web Components)
2. Integrate Facets APIs — Wire up API calls to fetch the data your component needs
3. Add configuration — Set up build tooling, bundling, and GitHub Pages deployment configuration
4. Push to GitHub — Commit the code to a repository (new or existing) under your GitHub account

You'll see the progress as Praxis works through each step. You can review the generated code and request changes at any point.

---

Step 3: Praxis Deploys to GitHub Pages

After the code is pushed, Praxis will:

1. Configure GitHub Pages — Enable Pages on the repository, set the source branch/directory
2. Trigger the build — Run the GitHub Actions workflow (or direct deployment) to publish the component
3. Verify deployment — Confirm the component is live and accessible

Once complete, Praxis will provide you with the GitHub Pages URL where your web component is hosted.

Example output:

Your web component is live at:
https://<your-org>.github.io/<repo-name>/

You can use this URL to integrate it into Facets.

---

Step 4: Integrate into Facets

Use the GitHub Pages URL to register your web component within the Facets platform. This allows the component to appear directly inside your Facets dashboard.

To integrate:

1. Navigate to your Facets Dashboard
2. Go to Settings → Web Components (or the relevant integration section)
3. Click Add Web Component
4. Provide the following:
   • Name — A display name for your component
   • URL — The GitHub Pages URL provided by Praxis
   • Configuration — Any parameters the component accepts (e.g., project ID, environment name)
5. Save and the component will be available in your dashboard

Alternatively, you can ask Praxis to handle the integration:

"Integrate my web component into Facets using the URL https://my-org.github.io/cost-dashboard/"

---

Updating Your Web Component

Need to make changes after deployment? Just tell Praxis:

"Update my cost pie chart to also include a bar chart view"

Praxis will:

1. Pull the existing repository
2. Apply the requested changes
3. Push and redeploy to GitHub Pages

The URL remains the same — your Facets integration updates automatically.

---

Troubleshooting