Worksona MCP Server

# Worksona Agents Microsite This is the documentation and marketing microsite for the Worksona Agents MCP Server. ## 📁 Structure ``` site/ ├── index.html # Homepage ├── agents.html # Agent directory browser ├── documentation.html # Complete documentation ├── examples.html # Real-world examples ├── css/ │ └── styles.css # Main stylesheet ├── js/ │ ├── main.js # Main JavaScript │ └── agents.js # Agent browser logic └── data/ └── agents.json # Generated agent data ``` ## 🚀 Building the Site ### Generate Agent Data ```bash npm run site:generate ``` This scans the `agents/` directory and generates `site/data/agents.json` with all agent metadata. ### Build the Site ```bash npm run site:build ``` This validates all files and prepares the site for deployment. ### Build for Distribution ```bash npm run site:build:dist ``` Creates a `dist-site/` directory ready for deployment. ### Local Development ```bash npm run site:serve ``` Starts a local server at http://localhost:8080 ## 🌐 Deployment ### GitHub Pages 1. Build the distribution: ```bash npm run site:build:dist ``` 2. Push to `gh-pages` branch: ```bash cd dist-site git init git add -A git commit -m "Deploy site" git push -f git@github.com:worksona/worksona-mcp-server.git main:gh-pages ``` 3. Configure GitHub Pages to serve from `gh-pages` branch ### Netlify 1. Connect your repository to Netlify 2. Set build command: `npm run site:build:dist` 3. Set publish directory: `dist-site` 4. Deploy! **Or use Netlify CLI:** ```bash npm run site:build:dist cd dist-site netlify deploy --prod ``` ### Vercel 1. Install Vercel CLI: `npm i -g vercel` 2. Build and deploy: ```bash npm run site:build:dist cd dist-site vercel --prod ``` ### AWS S3 + CloudFront 1. Create S3 bucket for static hosting 2. Build the site: ```bash npm run site:build:dist ``` 3. Sync to S3: ```bash aws s3 sync dist-site/ s3://your-bucket-name --delete ``` 4. Configure CloudFront distribution ### Custom Server 1. Build the site: ```bash npm run site:build:dist ``` 2. Copy `dist-site/` contents to your web server 3. Configure web server to serve static files ## 🔄 Updating Agent Data Whenever agents are added or modified: ```bash npm run site:generate ``` This will regenerate the `site/data/agents.json` file with the latest agent information. ## 🎨 Customization ### Styling Edit `site/css/styles.css` to customize the look and feel. The site uses CSS custom properties (variables) for easy theming. ### Content - **Homepage**: Edit `site/index.html` - **Documentation**: Edit `site/documentation.html` - **Examples**: Edit `site/examples.html` ### JavaScript - **General functionality**: Edit `site/js/main.js` - **Agent browser**: Edit `site/js/agents.js` ## 📊 Features - **100% Static**: No server-side rendering required - **Fast Loading**: Optimized for performance - **Responsive**: Mobile-first design - **Accessible**: WCAG 2.1 compliant - **SEO Optimized**: Meta tags, semantic HTML, and structured data - **Dark Mode Ready**: Can be easily extended with dark mode ## 🔧 Technologies - **HTML5** - Semantic markup - **CSS3** - Modern styling with custom properties - **Vanilla JavaScript** - No framework dependencies - **JSON** - Agent data format ## 📝 License MIT License - Same as the main project