Skip to content

Latest commit

 

History

History
70 lines (58 loc) · 3.58 KB

CONTRIBUTION.md

File metadata and controls

70 lines (58 loc) · 3.58 KB

Project Structure

.
+--- .editorconfig
+--- .eslintignore
+--- .eslintrc
+--- .git
+--- .gitignore
+--- .npmrc
+--- esbuild.config.mjs
+--- HowToCreatePlugin.md
+--- main.ts                    # Plugin entry point
+--- manifest.json
+--- package-lock.json
+--- package.json
+--- tsconfig.json
+--- styles.css                 # Global styles for the plugin
+--- src                        # Source folder for TypeScript files
|   +--- views                  # Folder for all custom views
|   |   +--- KanbanView.ts      # Kanban view implementation
|   +--- components             # Reusable UI components
|   |   +--- TaskItem.tsx       # Component for individual task items
|   |   +--- Column.tsx         # Component for Kanban columns
|   +--- interfaces             # Folder for TypeScript interfaces and types
|   |   +--- Task.ts            # Interface for task items
|   |   +--- Column.ts          # Interface for Kanban columns
|   +--- services               # Folder for business logic or utility functions
|   |   +--- TaskService.ts     # Service to manage tasks (CRUD operations, markdown parsing, etc.)
|   +--- utils                  # Utility functions, helpers, and constants
|   |   +--- FileUtils.ts       # Utility functions related to file operations
+--- version-bump.mjs
+--- versions.json

Explanation of Each Folder

  1. src Folder: This will contain all the TypeScript files related to the functionality of your plugin. Organizing your code into subfolders like views, components, interfaces, services, and utils helps keep your code modular and maintainable.

  2. views Folder:

    • Store all custom Obsidian views here, such as KanbanView.ts.
    • Each view can have its CSS file within the styles subfolder, ensuring the styles are specific to the view.
  3. components Folder:

    • Use this folder for smaller, reusable UI components such as individual task items (TaskItem.tsx) or columns (Column.tsx).
    • Components help break down the UI into manageable parts, which you can use across different views.
  4. interfaces Folder:

    • Store TypeScript interfaces and types here, e.g., Task.ts for defining the structure of task objects and Column.ts for columns.
    • Keeping interfaces separate improves readability and makes it easy to reuse and update types across the project.
  5. services Folder:

    • This folder should contain logic that performs data processing or business logic, such as managing tasks or parsing markdown files.
    • For example, TaskService.ts could handle loading, creating, updating, and syncing tasks with markdown files.
  6. utils Folder:

    • Utility functions that are commonly used throughout the project, such as file operations (FileUtils.ts), can be stored here.
    • This helps keep your code DRY (Don't Repeat Yourself) by centralizing common logic.
  7. Global Files:

    • styles.css: For global styles that apply across the entire plugin.

Benefits of This Structure

  • Scalability: Easily add new views, components, or services without cluttering the main directory.
  • Maintainability: Each feature or component has a dedicated place, making the code easier to navigate and update.
  • Reusability: Components and services can be reused across different parts of the plugin, reducing duplication.
  • Separation of Concerns: Keeps UI, business logic, and types separate, adhering to best practices for clean code architecture.

Feel free to adjust the structure as needed based on the evolution of your plugin. Let me know if you need further details on setting up any specific part!