DEV Community

LeoJulieta
LeoJulieta

Posted on

Flare IDE: Graph‑First, AI‑Powered Coding That Eliminates Copy‑Paste

#flare #graphfirst #aiagents #english

Flare IDE — A Graph‑First, Agent‑Integrated Coding Platform That Supercharges Your Workflow

Introduction

If you’re tired of copy‑pasting AI suggestions and then manually fixing the resulting mess, Flare IDE is the tool you’ve been waiting for. It turns the classic edit‑compile‑run loop into a self‑optimising, graph‑driven pipeline where AI agents are first‑class citizens of your codebase.

In the next few minutes you’ll see how Flare’s architecture differs from traditional IDEs, get a step‑by‑step installation guide, run a real‑world example, and learn how to export the generated dependency graph to Git with an auto‑generated changelog. By the end you’ll know exactly why Flare matters right now and how to plug it into your existing CI/CD workflow.

Core Concepts in a Nutshell

Concept What It Means for You Quick Demo
Graph‑First Project Model Every file, function, and test is a node in flare.graph.json. Dependencies are explicit, so agents can reason about the whole codebase, not just a single file. `cat flare.graph.json \
Agent‑Integrated Editing An LLM‑backed agent watches the graph. When you add a node, the agent can automatically generate boilerplate, write tests, or refactor related nodes. {% raw %}flare agent suggest --node src/api/user.ts
Local‑First Privacy Agents run offline, self‑hosted, or cloud. In offline mode no code ever leaves your machine. flare config set mode offline
Export‑Ready CI A tiny CLI (flare export) serialises the graph, creates a markdown changelog, and pushes everything to Git in a single atomic commit. flare export --git

Installation & First Project

1. Install the CLI (macOS / Linux / Windows) 

# Using Homebrew (macOS / Linux)
brew install flaredev/tap/flare

# Using Scoop (Windows)
scoop bucket add flaredev https://github.com/flaredev/scoop-bucket
scoop install flare
Enter fullscreen mode Exit fullscreen mode

2. Initialise a New Project 

mkdir my‑flare‑app && cd my‑flare‑app
flare init            # scaffolds a minimal graph + config
code .                # open in VS Code (or your favourite editor)
Enter fullscreen mode Exit fullscreen mode

The flare init command creates:

  • flare.graph.json – the canonical graph representation.
  • flare.config.yaml – where you select the LLM provider and privacy mode.
  • A starter src/main.ts node with a tiny “Hello, world!” function.

3. Choose Your LLM Backend 

# flare.config.yaml
llm:
  provider: ollama          # alternatives: openai, anthropic, local
  model: llama3.1:8b
  mode: offline             # local inference, no network traffic
Enter fullscreen mode Exit fullscreen mode

Tip: If you prefer OpenAI’s gpt‑4o, set provider: openai and add your API key under ~/.flare/credentials.yaml.

Hands‑On Example: Building a Tiny REST API

We’ll create a simple CRUD endpoint for a User resource. Watch how Flare’s agent writes the code, the tests, and updates the graph automatically.

4. Add a New Node 

flare node add src/api/user.ts --type module
Enter fullscreen mode Exit fullscreen mode

Flare opens the file in your editor with a comment prompt that the agent reads:

// @flare: generate a basic Express router for CRUD on a User model
Enter fullscreen mode Exit fullscreen mode

Save the file and the agent immediately replies:

import { Router } from "express";

export const userRouter = Router();

userRouter.get("/", (req, res) => {
  // TODO: fetch users from DB
  res.json([]);
});

userRouter.post("/", (req, res) => {
  // TODO: create a new user
  res.status(201).json(req.body);
});
Enter fullscreen mode Exit fullscreen mode

5. Auto‑Generate Tests 

flare test generate --node src/api/user.ts
Enter fullscreen mode Exit fullscreen mode

Result (src/api/user.test.ts):

import request from "supertest";
import { app } from "../app";

describe("User API", () => {
  it("GET /users returns an array", async () => {
    const res = await request(app).get("/users");
    expect(res.status).toBe(200);
    expect(Array.isArray(res.body)).toBe(true);
  });
});
Enter fullscreen mode Exit fullscreen mode

The graph now contains three nodes: the router, its test, and the shared app entry point.

6. Run the Project 

flare run            # starts the dev server, watches the graph for changes
Enter fullscreen mode Exit fullscreen mode

You’ll see the agent log:

[flare] Graph updated – 3 nodes, 2 edges
[flare] Agent: Added missing import in src/app.ts
Enter fullscreen mode Exit fullscreen mode

Exporting the Graph to Git

When you’re ready to commit, Flare can turn the graph into a clean Git history with a generated changelog.

flare export --git \
  --message "Add User CRUD API (auto‑generated)" \
  --changelog
Enter fullscreen mode Exit fullscreen mode

What happens under the hood:

  1. Serialises flare.graph.json into graph/ (one JSON file per node).
  2. Generates CHANGELOG.md by diffing the previous graph version.
  3. Creates a single commit that adds/updates all source files and the graph.

Resulting CHANGELOG.md snippet:

## v0.2.0 – 2024‑08‑25

- Added `src/api/user.ts` – Express router with GET & POST endpoints (generated by Flare agent).
- Added `src/api/user.test.ts` – Supertest suite covering the new routes.
- Updated project graph (`flare.graph.json`) to include the new nodes and their dependencies.
Enter fullscreen mode Exit fullscreen mode

Frequently Asked Questions

Question Answer
Is my source code sent to external servers when agents run? No, as long as you run Flare in offline or self‑hosted mode. In cloud mode only the minimal prompt (node ID + a few lines of context) is transmitted over TLS, and you can disable it completely in flare.config.yaml.
How does Flare’s cost compare to Copilot or Cursor? Flare itself is MIT‑licensed and free. You only pay for the LLM you choose. Using an open‑source model like Llama 3 on your own hardware can be $0, while OpenAI’s gpt‑4o typically costs $5–$10 / developer / month—roughly the same as Copilot but with full control over prompts and the graph.
Can Flare be part of an existing CI/CD pipeline? Absolutely. The flare export command is idempotent and can be invoked from a GitHub Action, GitLab CI, or Jenkins job. Example snippet for GitHub Actions:


yaml\nname: CI\non: [push]\njobs:\n build:\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v3\n - name: Install Flare\n run: brew install flaredev/tap/flare\n - name: Export Graph\n run: flare export --git --changelog\n - name: Run Tests\n run: npm test\n

|
| What languages does Flare support? | Out‑of‑the‑box: JavaScript/TypeScript, Python, Go, Rust, and Java. Adding a new language is just a matter of contributing a small parser to the open‑source repo. |
| Does Flare replace my existing IDE? | No. Flare is an extension layer that works with VS Code, JetBrains, or any editor you prefer. It augments the editor with agent‑driven actions and a graph view panel. |

How Flare Stacks Up Against Traditional IDEs

Feature Flare IDE VS Code + Copilot JetBrains + Cursor
Graph‑first view Built‑in visualizer of flare.graph.json No native graph, requires extensions No
Agent autonomy Agents can create, refactor, and test without explicit prompts Copilot only reacts to inline comments Cursor similar to Copilot
Privacy controls Offline, self‑hosted, or cloud modes Mostly cloud (Copilot) Cloud (Cursor)
CI‑ready export One‑command Git export with changelog Manual scripts needed Manual scripts needed
Cost Free + LLM cost $10 / month per user $10–$20 / month per user

Getting Started in Your Own CI/CD

  1. Add Flare to your repo – commit flare.graph.json and flare.config.yaml. 2

Herramienta mencionada: Groq Cloud

Top comments (0)