Add AgentMD Integration and Execution Capabilities

AGENTMD_INTEGRATION.md

@@ -0,0 +1,50 @@
+# Integrating AgentMD with AGENTS.md
+
+This document explains how to use AgentMD to execute the commands defined in AGENTS.md files.
+
+## Overview
+
+While AGENTS.md provides instructions for AI coding agents, AgentMD brings these instructions to life by making them executable. Instead of just reading commands, AgentMD can automatically execute them in the proper environment.
+
+## How It Works
+
+1. **Parse**: AgentMD reads the AGENTS.md file and identifies executable commands
+2. **Validate**: Ensures commands are safe and appropriate for execution
+3. **Execute**: Runs the commands in the proper sequence and environment
+
+## Example
+
+This repository contains an AGENTS.md file with development commands. AgentMD can parse and execute these commands automatically:
+
+```bash
+# Install dependencies
+pnpm install
+
+# Execute commands from AGENTS.md
+npx agentmd execute
+```
+
+## Benefits
+
+- **Automatic environment setup**: No need to manually run setup commands
+- **Sequential command execution**: Commands run in the correct order
+- **Error handling and rollback**: Proper error management during execution
+- **Logging and audit trails**: Track what commands were executed and when
+
+## Getting Started
+
+1. Install AgentMD:
+   ```bash
+   npm install -g agentmd
+   ```
+
+2. Navigate to a project with an AGENTS.md file
+
+3. Execute the commands:
+   ```bash
+   agentmd execute
+   ```
+
+## Security
+
+AgentMD includes built-in security measures to prevent execution of potentially harmful commands. Always review commands in AGENTS.md files before execution.

AGENTS.md

@@ -41,3 +41,14 @@ If you add or update dependencies remember to:
 Following these practices ensures that the agent-assisted development workflow stays
 fast and dependable.  When in doubt, restart the dev server rather than running the
 production build.
+
+## Making This AGENTS.md File Executable
+
+Tools like [AgentMD](https://agentmd.vercel.app/) can automatically execute the commands listed in this file. AgentMD provides:
+
+- Automatic parsing of commands in backticks
+- Safe execution with validation
+- Error handling and rollback capabilities
+- Logging and audit trails
+
+To execute these commands automatically, install AgentMD and run `agentmd execute` in this directory.

README.md

@@ -35,7 +35,7 @@ Below is a minimal example of an AGENTS.md file:
 ## Website
 
 This repository also includes a basic Next.js website hosted at https://agents.md/
-that explains the project’s goals in a simple way, and featuring some examples.
+that explains the project's goals in a simple way, and featuring some examples.
 
 ### Running the app locally
 1. Install dependencies:
@@ -47,3 +47,11 @@ that explains the project’s goals in a simple way, and featuring some examples
    pnpm run dev
    ```
 3. Open your browser and go to http://localhost:3000
+
+## Making AGENTS.md Executable
+
+While AGENTS.md provides instructions for AI coding agents, you can make these instructions executable with tools like [AgentMD](https://agentmd.vercel.app/).
+
+AgentMD reads your AGENTS.md file and automatically executes the setup, test, and build commands listed in the file, streamlining your development workflow.
+
+To learn more about integrating AgentMD with AGENTS.md, see [AGENTMD_INTEGRATION.md](./AGENTMD_INTEGRATION.md).

components/ExecutionDemoSection.tsx

@@ -0,0 +1,80 @@
+import React from "react";
+import Section from "@/components/Section";
+import CodeExample, { HERO_AGENTS_MD } from "@/components/CodeExample";
+
+export default function ExecutionDemoSection() {
+  return (
+    <Section
+      id="execution-demo"
+      title="Making AGENTS.md Executable with AgentMD"
+      className="py-12 bg-blue-50 dark:bg-blue-900/20"
+      center
+      maxWidthClass="max-w-4xl"
+    >
+      <div className="space-y-8 text-left">
+        <div className="text-lg text-gray-700 dark:text-gray-300">
+          <p className="mb-4">
+            While AGENTS.md provides instructions for AI coding agents, AgentMD brings these instructions to life by making them executable. 
+            Instead of just reading commands, AgentMD can automatically execute them in the proper environment.
+          </p>
+
+          <div className="mt-8">
+            <h3 className="text-xl font-semibold text-gray-900 dark:text-white mb-4">
+              Example AGENTS.md Commands:
+            </h3>
+            <div className="border border-gray-200 dark:border-gray-700 rounded-lg overflow-hidden">
+              <CodeExample code={HERO_AGENTS_MD} compact />
+            </div>
+          </div>
+
+          <div className="mt-8 grid grid-cols-1 md:grid-cols-3 gap-6">
+            <div className="bg-white dark:bg-gray-800 p-6 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
+              <div className="text-blue-600 dark:text-blue-400 font-bold text-lg mb-2">1. Parse</div>
+              <p className="text-gray-600 dark:text-gray-400">
+                AgentMD reads the AGENTS.md file and identifies executable commands
+              </p>
+            </div>
+
+            <div className="bg-white dark:bg-gray-800 p-6 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
+              <div className="text-green-600 dark:text-green-400 font-bold text-lg mb-2">2. Validate</div>
+              <p className="text-gray-600 dark:text-gray-400">
+                Ensures commands are safe and appropriate for execution
+              </p>
+            </div>
+
+            <div className="bg-white dark:bg-gray-800 p-6 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
+              <div className="text-purple-600 dark:text-purple-400 font-bold text-lg mb-2">3. Execute</div>
+              <p className="text-gray-600 dark:text-gray-400">
+                Runs the commands in the proper sequence and environment
+              </p>
+            </div>
+          </div>
+
+          <div className="mt-8 p-6 bg-gradient-to-r from-blue-50 to-indigo-50 dark:from-blue-900/30 dark:to-indigo-900/30 rounded-lg border border-blue-200 dark:border-blue-800">
+            <h3 className="text-xl font-semibold text-gray-900 dark:text-white mb-3">
+              With AgentMD Integration:
+            </h3>
+            <ul className="space-y-2 text-gray-700 dark:text-gray-300">
+              <li className="flex items-start">
+                <span className="text-green-500 mr-2">✓</span>
+                <span>Automatic environment setup</span>
+              </li>
+              <li className="flex items-start">
+                <span className="text-green-500 mr-2">✓</span>
+                <span>Sequential command execution</span>
+              </li>
+              <li className="flex items-start">
+                <span className="text-green-500 mr-2">✓</span>
+                <span>Error handling and rollback</span>
+              </li>
+              <li className="flex items-start">
+                <span className="text-green-500 mr-2">✓</span>
+                <span>Logging and audit trails</span>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </Section>
+  );
+}

components/FAQSection.tsx

@@ -24,6 +24,18 @@ export default function FAQ() {
       answer:
         "Yes—if you list them. The agent will attempt to execute relevant programmatic checks and fix failures before finishing the task.",
     },
+    {
+      question: "How can I make AGENTS.md commands actually executable?",
+      answer: (
+        <>\n          <p className="mb-2">
+            While AGENTS.md provides instructions for AI agents, tools like <a href="https://agentmd.vercel.app/" className="text-blue-600 hover:underline">AgentMD</a> can make these instructions executable in your development environment.
+          </p>
+          <p>
+            AgentMD reads your AGENTS.md file and automatically executes the setup, test, and build commands listed in the file, streamlining your development workflow.
+          </p>
+        </>
+      ),
+    },
     {
       question: "Can I update it later?",
       answer: "Absolutely. Treat AGENTS.md as living documentation.",

pages/index.tsx

@@ -9,6 +9,7 @@ import CompatibilitySection from "@/components/CompatibilitySection";
 import { GetStaticProps } from "next";
 import WhySection from "@/components/WhySection";
 import AboutSection from "@/components/AboutSection";
+import ExecutionDemoSection from "@/components/ExecutionDemoSection";
 
 interface LandingPageProps {
   contributorsByRepo: Record<string, { avatars: string[]; total: number }>;
@@ -23,6 +24,7 @@ export default function LandingPage({ contributorsByRepo }: LandingPageProps) {
         <CompatibilitySection />
         <ExamplesSection contributorsByRepo={contributorsByRepo} />
         <HowToUseSection />
+        <ExecutionDemoSection />
         <div className="flex-1 flex flex-col gap-4 mt-16">
           <AboutSection />
           <FAQSection />