How to Print Your App Directory Structure in Terminal

How to Print Your App Directory Structure in Terminal


Terminal CLI Developer Tools File Structure Web Development Productivity

To print your app’s directory structure in the terminal, use one of these commands:

Install tree if not available:

# macOS (with Homebrew)
brew install tree

# Ubuntu/Debian
sudo apt-get install tree

# CentOS/RHEL/Fedora
sudo yum install tree      # or
sudo dnf install tree

Basic usage:

# Show entire project structure
tree

# Show only specific depth (e.g., 2 levels deep)
tree -L 2

# Exclude node_modules, .git, etc.
tree -I 'node_modules|.git|dist|build|.next'

# Show with file sizes
tree -s

# Save to file
tree -I 'node_modules|.git' > structure.txt

Example output:

my-app/
├── public/
│   ├── favicon.ico
│   └── vercel.svg
├── src/
│   ├── components/
│   │   └── Header.tsx
│   ├── pages/
│   │   ├── api/
│   │   └── index.tsx
│   └── styles/
│       └── globals.css
├── package.json
├── tsconfig.json
└── next.config.js

📁 2. Using find (Built-in - No Installation Needed)

# Basic structure (all files)
find . -print | sed -e 's;[^/]*/;|____;g;s;____|; |;g'

# Exclude common directories
find . -type f ! -path "./node_modules/*" ! -path "./.git/*" ! -path "./dist/*" ! -path "./build/*" ! -path "./.next/*"

# With indentation (macOS/Linux)
find . -not -path "*/node_modules/*" -not -path "*/\.git/*" | sort

🔍 3. Quick One-Liners for Common Cases

# Just show directory names (no files)
find . -type d | sort

# Show only source code structure (exclude hidden and build dirs)
ls -R | grep ":$" | sed -e 's/:$//' -e 's/[^-][^\/]*\//--/g' -e 's/^/   /' -e 's/-/|/'

# Simple list with indentation
du -a --max-depth=2

💡 Pro Tips:

  1. Always exclude node_modules – it’s huge and not relevant to your app structure:

    tree -I 'node_modules'
  2. For Next.js projects, also exclude build directories:

    tree -I 'node_modules|.git|.next|out|dist'
  3. Save output to file for documentation:

    tree -I 'node_modules|.git' -o project-structure.txt
  4. Show only specific file types:

    tree -P "*.tsx"  # Only TypeScript React files

Thank you for stopping by

© 2026 - Oktaviardi.com