https://github.com/sdras/vue-directory-tree

A visualization of relevant files for vue repo, along with notes
https://github.com/sdras/vue-directory-tree

code-structure directory-tree tree vue vue-core-visualization vue-directory-tree vuejs vuejs-documentation

Last synced: about 2 months ago
JSON representation

A visualization of relevant files for vue repo, along with notes

• Host: GitHub
• URL: https://github.com/sdras/vue-directory-tree
• Owner: sdras
• License: mit
• Created: 2018-04-07T21:47:02.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2018-10-12T21:55:35.000Z (about 6 years ago)
• Last Synced: 2024-10-11T15:45:27.299Z (2 months ago)
• Topics: code-structure, directory-tree, tree, vue, vue-core-visualization, vue-directory-tree, vuejs, vuejs-documentation
• Language: JavaScript
• Homepage: https://sdras.github.io/vue-directory-tree/
• Size: 405 KB
• Stars: 163
• Watchers: 8
• Forks: 8
• Open Issues: 6
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Vue Core Directory Visualization

🎋 Often when we're excited about contributing to a project, it takes a little while to understand the codebase even before we get started. It's estimated that developers spend 70% of their time reading code and only 30% writing. This project documents how Vue.js is set up with special notes taken from a Vue core meeting with Evan You. This should help guide people through the directory structure and give context to how and why things are set up the way that they are so that they can get set up to contribute as soon as possible.

Shows the whole Vue.js repo directory structure, with only the sections with notes shown initially. Any files that we have more info on have a note (exposed on hover). All notes and open directories are in the Vuex store.

![demo-image](https://s3-us-west-2.amazonaws.com/s.cdpn.io/28963/vue-directory.png)

🎋 Demo site! [https://sdras.github.io/vue-directory-tree/](https://sdras.github.io/vue-directory-tree/)

When I first created this, I wrote this [bit of code](https://gist.github.com/sdras/f5665c5bcd98b48b4a3a9aed1312fd37) to create the tree.

🎋 After it was done, I thought it might be best for everyone to create a CLI tool to generate this kind of documentation. You can find this project and use it here: [Project-Explorer](https://github.com/sdras/project-explorer)

```

yarn

yarn serve

```