This post talks about how to generate folder structure in markdown.
Markdown is a plain text content that is easy to read and converted to html .
Directory structure is a tree navigation of Nested folders and files types.
There is no support for directory structure creation for Markdown standard syntax.
Showing Directory structure in markdown helps users to
- Helps developers to write a documentation or README files in Github.
- Story or bug comments to include structure with markdown syntax in JIRA
- Slack to include comments as nested folder structure
- Stackoverflow can have a support for include question and answers with parent and child structure
There are many ways we can generate windows like folder structure
How to show folder structure in markdown files.
You can generates folder structure manually command
and copy structure and enclose in three backticks symbols in markdown
├── src │ ├── controller │ │ ├── **/*.css │ ├── views │ ├── model │ ├── index.js ├── public │ ├── css │ │ ├── **/*.css │ ├── images │ ├── js │ ├── index.html ├── dist (or build ├── node_modules ├── package.json ├── package-lock.json └── .gitignore
Tree command to generate nested directory structure with markdonw
Tree is an unix command which displays the nested folder and files and outputs to console
First go to application root using
cd nodeapp command where nodeapp is an node application.
Next run tree command
It outputs the colorized(if already configured terminal colors) output
Copy the output to markdown file and enclose in three backticks(```markdown) and end with three backticks.
And another ways is to
pre tag in html which preserves the line breaks and spaces.
Html tags works in html files.
Copied above output the directory strurcture in and tags.
Generate folder structure with npm markdown-notes-tree and copy to documentation file
This is an npm package that works in node projects First install markdown-notes-tree using below command
npm install -D markdown-notes-tree
Once you installed the package, you can use
markdown-notes-tree command to generate in an application
With this, You have full flexibility to add more information to generated folder structure
- You can add ignored files like node_modules
- Can add folder or files descriptions and titles
- Include and exclude any file or folder types
- Easy to generate directory strucutre and copied to documentation or README.md
There is another npm library you can also use
md-file-tree which also generates and copies to markdown file
You can geenrate the folder strucutre with any of the above options and finally copy to documentation markdown files in Github or stackoverflow or jira or slack markdown