The latest articles on DEV Community by Sami Ullah (@sami606713). https://dev.to/sami606713 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4077625%2F0a05548c-0d90-47ab-bce3-7f5c9cde9496.jpg https://dev.to/sami606713 en Sami Ullah Fri, 14 Aug 2026 11:43:24 +0000 https://dev.to/sami606713/i-built-langctl-stop-wasting-2-days-on-agent-project-scaffolding-1g37 https://dev.to/sami606713/i-built-langctl-stop-wasting-2-days-on-agent-project-scaffolding-1g37 <p>Every LangGraph agent project I shipped started the same way:</p> <ol> <li>Set up a LangGraph Agent Server</li> <li>Scaffold a Next.js frontend</li> <li>Figure out CORS between them</li> <li>Hide API keys from the browser</li> <li>Write a proxy</li> <li>Wire up a dev command that runs both</li> </ol> <p>Two days. Every single time. Before writing a single line of agent logic.</p> <p>I got tired of it. So I built <strong>langctl</strong>.</p> <h2> The Solution </h2> <div class="highlight js-code-highlight"> <pre class="highlight shell"><code>pip <span class="nb">install </span>langctl langctl new my-agent <span class="nb">cd </span>my-agent langctl dev </code></pre> </div> <p>That's it. Agent + chat UI running at <code>localhost:3000</code>. No CORS. No exposed API keys.</p> <h2> What You Get </h2> <p><strong>Backend:</strong></p> <ul> <li>LangGraph Agent Server on <code>:2024</code> </li> <li> <code>agent.yaml</code> as single source of truth</li> <li>Long-term memory on by default (SQLite or Postgres)</li> <li>25 model providers (OpenAI, Ollama, OpenRouter, any OpenAI-compatible)</li> <li>Middleware pipeline: cost limits, tool retries, guardrails</li> </ul> <p><strong>Frontend:</strong></p> <ul> <li>LangChain's own <code>agent-chat-ui</code> on <code>:3000</code> </li> <li>Built-in proxy — <code>/api/agent/*</code> routes to the agent server</li> <li>Same origin = zero CORS</li> <li>API keys stay server-side</li> </ul> <h2> All Commands </h2> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Command</th> <th>What it does</th> </tr> </thead> <tbody> <tr> <td><code>langctl new</code></td> <td>Scaffold backend + frontend</td> </tr> <tr> <td><code>langctl dev</code></td> <td>Run both as one app, health-gated</td> </tr> <tr> <td><code>langctl share</code></td> <td>Public tunnel for instant demos</td> </tr> <tr> <td><code>langctl add</code></td> <td>Add tools, memory, middleware</td> </tr> <tr> <td><code>langctl sync</code></td> <td>Regen langgraph.json from agent.yaml</td> </tr> <tr> <td><code>langctl doctor</code></td> <td>Verify setup before failure</td> </tr> </tbody> </table></div> <h2> The Architecture </h2> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>Browser → localhost:3000 (Next.js) ↓ /api/agent/* (proxy) ↓ 127.0.0.1:2024 (LangGraph Agent Server) </code></pre> </div> <p>Same origin. The proxy attaches <code>x-api-key</code> server-side. Moving to production? Change one env variable.</p> <h2> Why Not Existing Templates? </h2> <p>LangChain has <code>langchain-nextjs-template</code> and <code>agent-chat-ui</code>. But:</p> <ul> <li>They require manual CORS config</li> <li>API keys sit in <code>.env.local</code> (frontend)</li> <li>You run two separate dev servers</li> <li>No memory, no middleware, no tunnel</li> </ul> <p>langctl automates all of that into one command.</p> <h2> Install </h2> <div class="highlight js-code-highlight"> <pre class="highlight shell"><code>pip <span class="nb">install </span>langctl </code></pre> </div> <p>Python 3.11+, Node.js 18+</p> <p><strong>GitHub</strong>: <a href="https://github.com/Sami606713/agent_cli" rel="noopener noreferrer">github.com/Sami606713/agent_cli</a><br> <strong>PyPI</strong>: <a href="https://pypi.org/project/langctl/" rel="noopener noreferrer">pypi.org/project/langctl</a><br> <strong>License</strong>: Apache-2.0</p> <p>15 releases in 4 days. PRs and feedback welcome.</p> langgraph ai python opensource