CtrlK
BlogDocsLog inGet started
Tessl Logo

ideogram-local-dev-loop

Configure Ideogram local development with hot reload and testing. Use when setting up a development environment, configuring test workflows, or establishing a fast iteration cycle with Ideogram. Trigger with phrases like "ideogram dev setup", "ideogram local development", "ideogram dev environment", "develop with ideogram".

Install with Tessl CLI

npx tessl i github:jeremylongshore/claude-code-plugins-plus-skills --skill ideogram-local-dev-loop
What are skills?

83

Review — 81%

Does it follow best practices?

Validation — 9 / 11 Passed

Validation for skill structure

SKILL.md
Review
Evals

Ideogram Local Dev Loop

Overview

Set up a fast, reproducible local development workflow for Ideogram.

Prerequisites

  • Completed ideogram-install-auth setup
  • Node.js 18+ with npm/pnpm
  • Code editor with TypeScript support
  • Git for version control

Instructions

Step 1: Create Project Structure

my-ideogram-project/
├── src/
│   ├── ideogram/
│   │   ├── client.ts       # Ideogram client wrapper
│   │   ├── config.ts       # Configuration management
│   │   └── utils.ts        # Helper functions
│   └── index.ts
├── tests/
│   └── ideogram.test.ts
├── .env.local              # Local secrets (git-ignored)
├── .env.example            # Template for team
└── package.json

Step 2: Configure Environment

# Copy environment template
cp .env.example .env.local

# Install dependencies
npm install

# Start development server
npm run dev

Step 3: Setup Hot Reload

{
  "scripts": {
    "dev": "tsx watch src/index.ts",
    "test": "vitest",
    "test:watch": "vitest --watch"
  }
}

Step 4: Configure Testing

import { describe, it, expect, vi } from 'vitest';
import { IdeogramClient } from '../src/ideogram/client';

describe('Ideogram Client', () => {
  it('should initialize with API key', () => {
    const client = new IdeogramClient({ apiKey: 'test-key' });
    expect(client).toBeDefined();
  });
});

Output

  • Working development environment with hot reload
  • Configured test suite with mocking
  • Environment variable management
  • Fast iteration cycle for Ideogram development

Error Handling

ErrorCauseSolution
Module not foundMissing dependencyRun npm install
Port in useAnother processKill process or change port
Env not loadedMissing .env.localCopy from .env.example
Test timeoutSlow networkIncrease test timeout

Examples

Mock Ideogram Responses

vi.mock('@ideogram/sdk', () => ({
  IdeogramClient: vi.fn().mockImplementation(() => ({
    // Mock methods here
  })),
}));

Debug Mode

# Enable verbose logging
DEBUG=IDEOGRAM=* npm run dev

Resources

  • Ideogram SDK Reference
  • Vitest Documentation
  • tsx Documentation

Next Steps

See ideogram-sdk-patterns for production-ready code patterns.

Repository
jeremylongshore/claude-code-plugins-plus-skills
Commit

9659b78

Last updated
Created

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.

Claim skill