README_SCRIPTS.mdโข4.78 kB
# ๐ Documentation Scripts Guide
**Automated setup and management for your documentation website**
---
## ๐ฏ Available Scripts
### **๐ setup-website.sh** (Advanced Bash Script)
**Full-featured script with error checking, colored output, and deployment guidance**
```bash
./setup-website.sh [command]
```
**Commands:**
- `setup` - Install dependencies and check prerequisites
- `dev` - Start development server with hot reload
- `build` - Build static site for production
- `preview` - Preview built site locally
- `deploy` - Deployment guidance for GitHub Pages
- `clean` - Clean build artifacts and cache
- `help` - Show detailed help
### **๐ฆ npm Scripts** (Simple & Cross-Platform)
**Quick npm-based commands for common tasks**
```bash
npm run [command]
```
**Commands:**
- `setup` - Quick dependency installation
- `dev` - Start development server
- `build` - Build for production
- `deploy` - Build + deployment info
- `clean` - Clean build artifacts
---
## ๐ When to Use Which
### **Use npm Scripts When:**
โ
You want simple, cross-platform commands
โ
You're familiar with npm workflow
โ
You don't need detailed progress feedback
โ
You're on Windows or prefer npm
### **Use Bash Script When:**
โ
You want detailed progress information
โ
You need comprehensive error checking
โ
You want deployment guidance
โ
You prefer rich terminal output
โ
You're on macOS/Linux
---
## โก Quick Reference
### **First Time Setup**
```bash
# Option A: npm (simple)
cd docs
npm run setup
# Option B: script (detailed)
cd docs
./setup-website.sh setup
```
### **Development**
```bash
# Option A: npm
npm run dev
# Option B: script
./setup-website.sh dev
```
### **Production Build**
```bash
# Option A: npm
npm run build
# Option B: script
./setup-website.sh build
```
### **Deployment**
```bash
# Option A: npm (just builds)
npm run deploy
# Option B: script (guidance + git integration)
./setup-website.sh deploy
```
---
## ๐จ Script Features
### **setup-website.sh Features:**
- ๐จ **Colored output** with emojis for better UX
- โ
**Prerequisites checking** (Node.js version, location)
- ๐ **Build statistics** (file count, size)
- ๐ **Git integration** for deployment
- ๐งน **Interactive cleanup** with confirmations
- โ **Error handling** with helpful messages
### **npm Scripts Features:**
- โก **Fast execution** with minimal overhead
- ๐ **Cross-platform** compatibility
- ๐ **Simple output** with status emojis
- ๐ **Standard npm workflow** integration
---
## ๐ ๏ธ Customization
### **Adding New Commands**
**To npm scripts** (edit `package.json`):
```json
"scripts": {
"your-command": "echo '๐ฏ Your command' && your-actual-command"
}
```
**To bash script** (edit `setup-website.sh`):
```bash
# Add to the case statement
"your-command")
your_function
;;
```
### **Modifying Existing Commands**
- **npm scripts**: Edit the `scripts` section in `package.json`
- **bash script**: Edit the corresponding function in `setup-website.sh`
---
## ๐ง Troubleshooting Scripts
### **Script Permission Issues**
```bash
chmod +x setup-website.sh
```
### **npm Scripts Not Working**
```bash
# Verify package.json exists
ls -la package.json
# Reinstall if needed
rm -rf node_modules package-lock.json
npm install
```
### **Script Path Issues**
```bash
# Ensure you're in the docs directory
pwd # Should end with /docs
cd docs # If not
```
---
## ๐ Performance Comparison
| Task | npm Scripts | Bash Script | Winner |
|------|-------------|-------------|---------|
| **Speed** | โก Fast | ๐ Slower (checks) | npm |
| **Feedback** | ๐ Basic | ๐จ Rich | Script |
| **Error Handling** | โ Basic | โ
Comprehensive | Script |
| **Cross-Platform** | โ
Yes | โ ๏ธ Unix only | npm |
| **Deployment Help** | ๐ Basic | ๐ Guided | Script |
---
## ๐ฏ Recommended Workflow
### **For Developers:**
```bash
# Daily development
npm run dev
# Building for production
./setup-website.sh build # Better feedback
# Deploying
./setup-website.sh deploy # Guided process
```
### **For CI/CD:**
```bash
# Automated builds (use npm for consistency)
npm run setup
npm run build
```
### **For New Contributors:**
```bash
# First time (use script for guidance)
./setup-website.sh setup
./setup-website.sh help
```
---
## ๐ Related Documentation
- **[QUICK_START.md](QUICK_START.md)** - Fastest way to get started
- **[WEBSITE_SETUP.md](WEBSITE_SETUP.md)** - Complete setup documentation
- **[package.json](package.json)** - npm scripts configuration
- **[setup-website.sh](setup-website.sh)** - Bash script source code
---
**๐ Both approaches get you to the same amazing documentation website - choose the one that fits your workflow best!**