Suggestion: Organize Code Snippets by Source Site with Subdirectories

[keatseb7]

To improve the structure and organization of the vue_snippets repository, I propose creating subdirectories for each document source site. This approach will allow us to better manage code snippets sourced from different documentation platforms, starting with vuejs.org.

Proposed Changes:

1. Subdirectory per Source Site:
   Create a subdirectory for each documentation source (e.g., vuejs.org, etc.) to clearly separate snippets from different platforms.

2. One Markdown File per Top-Level Heading:
   For each document source, structure the snippets by creating a single Markdown file for every top-level heading in the documentation. For example, for vuejs.org, we could have files like:

   • /vuejs.org/Essentials.md
   • /vuejs.org/Components.md
   • /vuejs.org/Reactivity.md

   Each file will contain concise and useful code snippets related to that specific section of the documentation, eliminating unnecessary text and focusing solely on code and brief context where required.

Benefits:

• Better Organization: Keeps snippets well-organized and easy to navigate, especially as the number of source sites grows.
• Scalability: This structure will scale better as we include code snippets from other popular UI frameworks or sources in the future.
• Conciseness: By focusing on one Markdown file per top-level heading, we can keep each file concise and to the point, ensuring the repository remains useful and easy to browse for learning.

Next Steps:

• Create a vuejs.org subdirectory in the root folder.
• Populate it with Markdown files, each corresponding to a top-level heading from the official vuejs.org guide.
• Continue this structure for other sources as we incorporate them.

Let me know if this proposal aligns with the project's goals, and I'd be happy to contribute to implementing it!

[mintysolutions]

Hi @keatseb7, great idea! Please work on this issue and update the folder structure.

[mintysolutions]

Let me close this issue.