Back to list
tsaijamey

frago-view-content-generate-tips-json

by tsaijamey

Multi-runtime automation infrastructure for AI agents. Native CDP browser control, metadata-driven Recipe system, and persistent Run context management.

52🍴 6📅 Jan 24, 2026

SKILL.md


name: frago-view-content-generate-tips-json description: JSON file content generation guide. Use this skill when you need to create JSON files that can be previewed via frago view. Covers formatted display and best practices.

JSON File Content Generation Guide

Preview JSON files via frago view with automatic formatting and syntax highlighting.

Preview Commands

frago view data.json                      # Default theme
frago view config.json --theme monokai    # Specify theme

Rendering Features

Automatic Formatting

  • JSON content automatically beautified (Pretty Print)
  • Indentation aligned
  • Key-value pairs clearly displayed

Syntax Highlighting

ElementColor Example (github-dark)
Key namesPurple #d2a8ff
String valuesBlue #a5d6ff
NumbersCyan #79c0ff
BooleansRed #ff7b72
nullRed #ff7b72
Brackets/commasWhite #c9d1d9

JSON Format Specification

Correct Format

{
    "name": "Project Name",
    "version": "1.0.0",
    "enabled": true,
    "count": 42,
    "tags": ["tag1", "tag2"],
    "config": {
        "nested": "value"
    },
    "nullable": null
}

Common Errors

ErrorExampleFix
Trailing comma{"a": 1,}{"a": 1}
Single quotes{'a': 1}{"a": 1}
Unquoted keys{a: 1}{"a": 1}
Comments// commentComments not supported
undefinedundefinedUse null

Best Practices

1. Indentation

  • Use 2 or 4 spaces for indentation
  • Maintain consistency

2. Key Naming

  • Use snake_case or camelCase
  • Maintain consistency throughout the file
{
    "user_name": "snake_case style",
    "userName": "camelCase style"
}

3. Data Organization

  • Group related fields
  • Place important fields first
{
    "id": "001",
    "name": "Important fields first",
    "metadata": {
        "created_at": "2024-01-01",
        "updated_at": "2024-01-02"
    }
}

4. File Size

  • Single file < 1MB optimal
  • Consider pagination or splitting files for large data

Use Cases

  • API response data preview
  • Configuration file viewing
  • Data structure review
  • Debug data inspection

Display Themes

Same as code files, supports the following themes:

ThemeCommand
github-dark (default)frago view data.json
monokaifrago view data.json --theme monokai
atom-one-darkfrago view data.json --theme atom-one-dark

Notes

IssueCauseSolution
Parse failureJSON format errorUse JSON validator
Truncated displayValue too longUse nested structure
Slow renderingFile too largeSplit or simplify

JSON Validation

Ensure JSON is valid before preview:

# Python validation
python -m json.tool data.json

# jq validation
jq . data.json

  • jq: Command-line JSON processor
  • jsonlint: JSON validator
  • VSCode: JSON editing and formatting

Score

Total Score

75/100

Based on repository quality metrics

SKILL.md

SKILL.mdファイルが含まれている

+20
LICENSE

ライセンスが設定されている

+10
説明文

100文字以上の説明がある

+10
人気

GitHub Stars 100以上

0/15
最近の活動

1ヶ月以内に更新

+10
フォーク

10回以上フォークされている

0/5
Issue管理

オープンIssueが50未満

+5
言語

プログラミング言語が設定されている

+5
タグ

1つ以上のタグが設定されている

+5

Reviews

💬

Reviews coming soon