🎨 ITBlogPros Article Studio

Complete web-based article generation, preview, and publishing workflow

Transform your article creation process from scattered scripts to a beautiful, streamlined web application.

✨ Features

🚀 One-Click Article Generation

Enter keyword → Click generate → Get complete article in 2-3 minutes
Real-time progress tracking with status updates
Quality score calculation (0-100)
Amazon ASIN validation with product verification

👁️ Integrated Preview System

Start local Eleventy preview server with one click
Review articles in full site context before publishing
Navigate entire site to see how new article fits
No manual terminal commands needed

📤 Git Publishing Integration

Publish directly to GitHub from the UI
Automatic commit message generation
Optional Bing IndexNow submission
Track article status (draft/published)

📊 Article Management Dashboard

View all generated articles at a glance
Quality scores, Amazon link counts, creation dates
Filter by status, search by keyword
Delete unwanted articles

🚦 Quick Start

1. Install Dependencies

cd C:\dev\itblogpros\_automation\article-studio
npm install

2. Start the Server

npm start

The server will start on http://localhost:3000

3. Open in Browser

Navigate to: http://localhost:3000

You'll see the Article Studio dashboard! 🎉

📖 How to Use

Generate Your First Article

Enter a Keyword
- Type something like: "AI webcams 2025"
- Or: "WiFi 7 mesh systems"
- Or: "smart home security cameras"
Click "Generate Article"
- Watch the progress bar
- See real-time status updates:
  - Researching Bing queries... (10%)
  - Generating article... (30%)
  - Validating Amazon ASINs... (60%)
  - Calculating quality score... (80%)
  - Saving article... (90%)
  - Complete! (100%)
Review Results
- Quality Score: 80+ is excellent, 60-79 is good, <60 needs work
- Amazon Links: Number of affiliate products included
- Valid Links: How many ASINs are verified

Preview the Article

Start Preview Server
- Click "Start Preview Server" button
- Wait 3 seconds for Eleventy to build site
- Browser automatically opens to http://localhost:8080
Navigate Your Site
- See your new article in context
- Check mobile responsiveness
- Test all links and formatting
- Navigate to homepage, other articles
Make Edits if Needed
- Articles are saved in C:\dev\itblogpros\posts\
- Edit markdown file directly if needed
- Refresh preview to see changes

Publish to GitHub

Click "Publish" on Article
- Opens publish modal
- Default commit message: "Published: [Article Title]"
- Option to submit to Bing IndexNow
Confirm Publish
- Commits article to git
- Pushes to GitHub (triggers Cloudflare deploy)
- Article goes live in 2-3 minutes
Monitor Status
- Article status changes from "draft" to "published"
- Check Cloudflare Pages for deploy status
- Visit itblogpros.com to see live article

🔧 Configuration

Environment Variables

Create a .env file in the article-studio directory:

GEMINI_API_KEY=your_gemini_key_here
BING_WEBMASTER_API_KEY=your_bing_key_here

Or use the existing .env in the root project directory.

File Locations

Articles saved to: C:\dev\itblogpros\posts\
Database: C:\dev\itblogpros\_automation\article-studio\database\articles.db
Server: Runs on port 3000 (configurable in server.js)
Preview: Eleventy serves on port 8080

📊 API Endpoints

The web app provides these REST API endpoints:

Articles

GET /api/articles - Get all articles
GET /api/articles/:id - Get single article
DELETE /api/articles/:id - Delete article

Generation

POST /api/generate - Generate new article
GET /api/jobs/:jobId - Get generation job status

Preview

POST /api/preview/start - Start Eleventy preview
POST /api/preview/stop - Stop preview server

Publishing

POST /api/publish/:articleId - Publish to GitHub
GET /api/git/status - Get git repository status

🗄️ Database Schema

Articles are stored in SQLite database:

`articles` Table

id                INTEGER PRIMARY KEY
keyword           TEXT (original search keyword)
title             TEXT (article title)
content           TEXT (full markdown content)
filename          TEXT (YYYY-MM-DD-slug.md)
quality_score     INTEGER (0-100)
amazon_links      INTEGER (total Amazon links)
valid_amazon_links INTEGER (verified ASINs)
status            TEXT ('draft' or 'published')
created_at        DATETIME
published_at      DATETIME

`amazon_links` Table

id            INTEGER PRIMARY KEY
article_id    INTEGER (foreign key)
asin          TEXT (Amazon product ID)
product_name  TEXT
is_valid      BOOLEAN
last_checked  DATETIME

🎯 Quality Score Breakdown

The quality score (0-100) is calculated from:

Word Count (30 points): 1200-1500 words = 30pts
Front Matter (10 points): Valid layout + title = 10pts
Post Tag (10 points): "post" first in tags = 10pts
Amazon Links (20 points): 3+ links = 20pts
Valid ASINs (10 points): 100% valid = 10pts
FAQ Section (10 points): Present = 10pts
Affiliate Disclosure (10 points): Top + bottom = 10pts
Headers (5 points): 5+ H2 headers = 5pts
No Meta-Commentary (5 points): Clean content = 5pts

Score Interpretation:

80-100: Excellent - Ready to publish
60-79: Good - Minor improvements needed
<60: Needs work - Review content

🛠️ Development Mode

Run with automatic restart on file changes:

npm install -g nodemon
npm run dev

📁 Project Structure

article-studio/
├── server.js                 # Express server
├── package.json              # Dependencies
├── public/
│   ├── index.html           # Main UI
│   ├── styles.css           # Styling
│   └── app.js               # Frontend logic
├── services/
│   ├── article-generator.js # Gemini integration
│   ├── amazon-validator.js  # ASIN validation
│   ├── bing-submitter.js    # Bing IndexNow
│   ├── git-publisher.js     # Git operations
│   └── database.js          # SQLite database
└── database/
    └── articles.db          # Article storage

🚀 Workflow Comparison

Before (Manual Process)

Research Bing keywords manually
Run node gemini-article-generator.js
Wait, check for errors
Manually validate Amazon ASINs
Build site: npx @11ty/eleventy --serve
Open browser, navigate to article
Make edits if needed
Stop server
Git add, commit, push manually
Wait for Cloudflare deploy
Submit to Bing manually

Total Time: 15-20 minutes
Steps: 11
Terminal Commands: 4-5

After (Article Studio)

Enter keyword in web UI
Click "Generate Article"
Wait 2-3 minutes (coffee break ☕)
Click "Preview Article"
Click "Publish"

Total Time: 5-7 minutes
Steps: 5
Terminal Commands: 0

🐛 Troubleshooting

Server Won't Start

# Check if port 3000 is in use
netstat -ano | findstr :3000

# Kill process if needed
taskkill /PID <process_id> /F

# Try different port
# Edit server.js line: const PORT = 3001;

Preview Server Stuck

# Stop preview server from UI
# Or manually kill Eleventy:
taskkill /F /IM node.exe

Database Locked

# Close all Article Studio instances
# Delete database lock file:
del C:\dev\itblogpros\_automation\article-studio\database\articles.db-journal

Git Push Fails

# Check git status manually:
cd C:\dev\itblogpros
git status

# If conflicts, resolve manually
git pull
git push

Amazon Validation Slow

Amazon rate limits HEAD requests
Validation may take 30-60 seconds for 3-5 products
Consider caching validated ASINs in database

🔮 Future Enhancements

Planned Features

[ ] Bulk article generation (queue multiple keywords)
[ ] Article templates (different formats)
[ ] A/B testing for titles
[ ] Performance analytics integration
[ ] Automated ASIN lookup from product names
[ ] Content calendar planning
[ ] SEO competitor analysis
[ ] Auto-posting to social media
[ ] Email notifications on publish
[ ] Multi-user support with authentication

📞 Support

Questions? Open an issue or email [email protected]

Bugs? Check article-studio/logs/ directory

Ideas? Submit a feature request!

📝 License

MIT License - Use freely for your ITBlogPros projects!

Built with ❤️ for ITBlogPros by Claude & Grahamm

Making article creation effortless since 2025 ✨