{"id":32127746,"url":"https://github.com/ran-codes/code-organizer-vscode","last_synced_at":"2026-02-19T02:02:08.903Z","repository":{"id":304983742,"uuid":"1021011520","full_name":"ran-codes/code-organizer-vscode","owner":"ran-codes","description":"VS Code extension for navigating large files using lightweight comment syntax to create instant table-of-contents navigation. Supports multiple programming languages.","archived":false,"fork":false,"pushed_at":"2025-10-28T15:25:30.000Z","size":3229,"stargazers_count":3,"open_issues_count":2,"forks_count":1,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-10-28T15:29:46.338Z","etag":null,"topics":["code-organization","developer-tools","navigation","outline","productivity","vscode-extension"],"latest_commit_sha":null,"homepage":"https://marketplace.visualstudio.com/items?itemName=ran-codes.code-organizer","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ran-codes.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-07-16T18:30:21.000Z","updated_at":"2025-10-28T15:25:43.000Z","dependencies_parsed_at":"2025-09-19T22:25:24.823Z","dependency_job_id":"102de420-7f37-40b1-898e-04a42da02c1e","html_url":"https://github.com/ran-codes/code-organizer-vscode","commit_stats":null,"previous_names":["ran-codes/python-outline-code-sections","ran-codes/friendly-code-outlines-vscode","ran-codes/code-organizer-vscode"],"tags_count":5,"template":false,"template_full_name":null,"purl":"pkg:github/ran-codes/code-organizer-vscode","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ran-codes%2Fcode-organizer-vscode","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ran-codes%2Fcode-organizer-vscode/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ran-codes%2Fcode-organizer-vscode/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ran-codes%2Fcode-organizer-vscode/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ran-codes","download_url":"https://codeload.github.com/ran-codes/code-organizer-vscode/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ran-codes%2Fcode-organizer-vscode/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29600844,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-19T00:59:38.239Z","status":"online","status_checked_at":"2026-02-19T02:00:07.702Z","response_time":117,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["code-organization","developer-tools","navigation","outline","productivity","vscode-extension"],"created_at":"2025-10-21T00:32:14.307Z","updated_at":"2026-02-19T02:02:08.898Z","avatar_url":"https://github.com/ran-codes.png","language":"TypeScript","readme":"# Code Organizer\n\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\"icon_v2.png\" alt=\"Code Organizer Logo\" width=\"128\" height=\"128\"\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cstrong\u003eCode section navigation for VS Code\u003c/strong\u003e\u003cbr\u003e\n  Organize and navigate large files with simple comment patterns\n\u003c/p\u003e\n\n\n## Features\n\nTransform your code files into organized, navigable documents with a table of contents-like structure. Create sections using simple comments, then use VS Code's built-in Outline panel to view and instantly jump to any section with a single click.\n\n- **Simple syntax**: `# Section Name ----`\n- **Table of contents experience**: Comments become navigable outline entries\n- **Hierarchical nesting**: `##`, `###`, `####` for multi-level organization\n- **Multi-language support**: Works with any comment style including JSX `{/* // Section ---- */}`\n- **Lightweight \u0026 fast**: Only responds to simple comments, no complex parsing\n- **VS Code integration**: Seamless outline view, breadcrumbs, and Go to Symbol\n- **Zero configuration**: Works immediately\n  \n\u003cimg src=\"./assets/images/snip_demo_python_v2.png\" alt=\"Code Organizer Snip Demo Python\" \u003e\n\n\n\n\n\n\n## Quick Start\n\n**To use:**\n1. Install the extension\n2. Open any code file (or create a new one)\n3. Add comment sections ending with `----` (4 or more dashes) to trigger code organization\n4. Check the **Outline** panel in VS Code's Explorer sidebar\n5. Click any section to jump to it instantly\n\n**Tip**: Use Command Palette (Ctrl+Shift+P / Cmd+Shift+P) → `Code Organizer: Show Code Organizer` to quickly open the view\n\n![Code Organizer Demo](./assets/images/demo_v2.gif)\n\n\n\n\n\n## Language Support \u0026 Examples\n\n| Language | Example | Nesting |\n|----------|---------|---------|\n| Python, R, Shell | `# Section ----` | `##`, `###`, `####` |\n| JavaScript, TypeScript, C++, Java, Go, Rust | `// Section ----` | `////`, `//////`, `////////` |\n| React JSX, TSX | `{/* // Section ---- */}` | `{/* //// */}`, `{/* ////// */}` |\n| SQL, PostgreSQL | `-- Section ----` | `----`, `------`, `--------` |\n\n**Works with:** Python • JavaScript • TypeScript • **React/JSX** • Java • C# • C++ • Go • Rust • Swift • PHP • SQL • R • Shell • and more...\n\n### Python Example\n\n\n```python\n# 1. Configuration ----\nDATABASE_URL = \"localhost\"\nAPI_KEY = \"secret\"\n\n## 1.1 Database Settings ----\ndef connect():\n    return db.connect(DATABASE_URL)\n\n### 1.1.1 Connection Pool ----\ndef create_pool():\n    return ConnectionPool()\n\n## 1.2 API Settings ----\ndef setup_api():\n    return API(API_KEY)\n\n# 2. Main Application ----\ndef run():\n    db = connect()\n    api = setup_api()\n```\n\n### React/JSX Example\n\n```jsx\n{/* // 1. Component Setup ---- */}\nimport React, { useState, useEffect } from 'react';\n\nfunction TodoApp() {\n  {/* // 1.1 State Management ---- */}\n  const [todos, setTodos] = useState([]);\n  const [filter, setFilter] = useState('all');\n\n  {/* //// 1.1.1 Todo Operations ---- */}\n  const addTodo = (text) =\u003e {\n    setTodos([...todos, { id: Date.now(), text, done: false }]);\n  };\n\n  {/* // 2. Render Logic ---- */}\n  return (\n    \u003cdiv className=\"todo-app\"\u003e\n      {/* // 2.1 Header Section ---- */}\n      \u003cheader\u003e\n        \u003ch1\u003eTodo List\u003c/h1\u003e\n        \u003cTodoInput onAdd={addTodo} /\u003e\n      \u003c/header\u003e\n\n      {/* // 2.2 Main Content ---- */}\n      \u003cmain\u003e\n        \u003cTodoList todos={filteredTodos} /\u003e\n        \u003cTodoFilters currentFilter={filter} onFilterChange={setFilter} /\u003e\n      \u003c/main\u003e\n    \u003c/div\u003e\n  );\n}\n```\n\n### JavaScript Example\n\n```javascript\n// 1. App Configuration ----\nconst config = {\n    apiUrl: 'https://api.example.com',\n    timeout: 5000\n};\n\n//// 1.1 Helper Functions ----\nfunction getData() {\n    return fetch(config.apiUrl);\n}\n\nfunction processData(data) {\n    return data.map(item =\u003e item.value);\n}\n\n// 2. Main Application ----\nclass App {\n    constructor() {\n        this.data = [];\n    }\n    \n    //// 2.1 Event Handlers ----\n    handleClick(event) {\n        console.log('Clicked:', event.target);\n    }\n}\n```\n\n### SQL Example\n\n```sql\n-- 1. Database Setup ----\nCREATE DATABASE myapp;\nUSE myapp;\n\n---- 1.1 Tables ----\nCREATE TABLE users (\n    id INT PRIMARY KEY,\n    name VARCHAR(100),\n    email VARCHAR(255)\n);\n\n------ 1.1.1 Indexes ----\nCREATE INDEX idx_user_email ON users(email);\n\n---- 1.2 Stored Procedures ----\nDELIMITER $$\nCREATE PROCEDURE GetUser(IN user_id INT)\nBEGIN\n    SELECT * FROM users WHERE id = user_id;\nEND$$\nDELIMITER ;\n\n-- 2. Sample Data ----\nINSERT INTO users VALUES (1, 'John Doe', 'john@example.com');\n```\n\n## Why Use This Extension?\n\n### The Problem\n- **Large files are hard to navigate** - scrolling through 1000+ line files\n- **VS Code's outline only shows functions/classes** - not logical code sections\n- **No consistent organization** across different programming languages\n- **Lost context** when jumping between different parts of complex files\n\n### Our Solution\nSimple, universal comment patterns that work everywhere with instant VS Code integration.\n\nPerfect for polyglot developers working across multiple programming languages.\n\n### Comparison with Alternatives\n\n| Feature | **Code Organizer** | Bookmarks | Better Comments | Region Folding |\n|---------|----------------------------|-----------|-----------------|----------------|\n| Automatic structure detection | ✅ | ❌ | ❌ | ❌ |\n| Hierarchical organization | ✅ | ❌ | ❌ | ⚠️ |\n| Multi-language support | ✅ | ✅ | ✅ | ⚠️ |\n| Outline integration | ✅ | ❌ | ❌ | ❌ |\n| Zero configuration | ✅ | ❌ | ❌ | ❌ |\n| Comment-based | ✅ | ❌ | ✅ | ⚠️ |\n\n## Installation\n\n**VS Code Marketplace:** Open Extensions (Ctrl+Shift+X) → Search \"Code Organizer\" → Install\n\n**Command Line:**\n```bash\ncode --install-extension ran-codes.code-organizer-vscode\n```\n\n---\n\n## Release Notes\n\nSee [CHANGELOG.md](CHANGELOG.md) for detailed release information.\n\n### 0.1.0 - Latest\n- **🆕 Custom Activity Bar View**: Dedicated Code Organizer tab with custom icon\n- **🆕 Editor-Outline Sync**: Auto-scroll outline view as you navigate through code\n- **🆕 \"Show Code Organizer\" Command**: Quick access via Command Palette\n- **🆕 High Resolution Icon**: Professional hexagon design for marketplace\n- Enhanced TreeView with caching for reliable navigation\n- Improved section highlighting with visual decorations\n\n### 0.0.5\n- **🆕 Markdown \u0026 Quarto Support**: Native header detection for `.md` and `.qmd` files\n- Smart code chunk handling - ignores headers inside fenced code blocks\n- Language-specific parsing for markdown documents\n- Perfect for data science workflows in Posit/VSCode\n\n### 0.0.4\n- **Cursor Compatibility**: Downgraded VSCode engine to ^1.99.0 for broader editor support\n\n### 0.0.3\n- **🆕 JSX/TSX Support**: Added React JSX comment syntax `{/* // Section ---- */}`\n- Enhanced regex pattern to handle whitespace variations in JSX comments\n- Improved language support for React and TypeScript React developers\n- Comprehensive test coverage for JSX comment detection\n\n### 0.0.1 - Initial Release\n- Support for `#`, `//`, and `--` comment styles\n- Hierarchical section nesting up to 4 levels\n- VS Code outline integration\n- Multi-language support\n- Zero configuration setup\n\n## License\n\nMIT License - see [LICENSE](LICENSE) file for details.\n\n---\n\n\u003cp align=\"center\"\u003e\n  \u003cem\u003eInspired by RStudio's Code Sections • Built with ❤️ for the VS Code community\u003c/em\u003e\n\u003c/p\u003e\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fran-codes%2Fcode-organizer-vscode","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fran-codes%2Fcode-organizer-vscode","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fran-codes%2Fcode-organizer-vscode/lists"}