Skip to content

Commit f39c4c0

Browse files
aalhouraalhour
committed
Improve load speed.
1 parent 2d8e9d4 commit f39c4c0

22 files changed

+159
-220
lines changed

‎Makefile‎

Lines changed: 33 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
# Digital Bazaar — Makefile
22
# Simplifies common development tasks
33

4-
.PHONY: help install update build serve clean fonts
4+
.PHONY: help install update build serve clean fonts prod-build serve-drafts images images-webp
55

6-
# Default Ruby path (Homebrew on macOS)
7-
RUBY_PATH := /opt/homebrew/opt/ruby/bin:/opt/homebrew/lib/ruby/gems/3.4.0/bin
8-
SHELL := /bin/bash
9-
export PATH := $(RUBY_PATH):$(PATH)
6+
# Homebrew Ruby paths (macOS)
7+
RUBY_BIN := /opt/homebrew/opt/ruby/bin
8+
GEM_BIN := /opt/homebrew/lib/ruby/gems/3.4.0/bin
9+
BUNDLE := PATH="$(RUBY_BIN):$(GEM_BIN):$$PATH" bundle
1010

1111
# Colors for help output
1212
CYAN := \033[36m
@@ -21,27 +21,48 @@ help: ## Show this help message
2121
@echo ""
2222

2323
install: ## Install Ruby gem dependencies
24-
bundle install
24+
$(BUNDLE) install
2525

2626
update: ## Update all gem dependencies to latest versions
27-
bundle update
27+
$(BUNDLE) update
2828

2929
build: ## Build the static site (output to _site/)
30-
bundle exec jekyll build
30+
$(BUNDLE) exec jekyll build
3131

3232
serve: ## Start local development server at http://localhost:4000
33-
bundle exec jekyll serve --livereload
33+
$(BUNDLE) exec jekyll serve --livereload
3434

3535
serve-drafts: ## Start server with draft posts visible
36-
bundle exec jekyll serve --livereload --drafts
36+
$(BUNDLE) exec jekyll serve --livereload --drafts
3737

3838
clean: ## Remove generated site and caches
39-
bundle exec jekyll clean
39+
$(BUNDLE) exec jekyll clean
4040
rm -rf _site .jekyll-cache .jekyll-metadata
4141

4242
prod-build: ## Build for production (minified, no drafts)
43-
JEKYLL_ENV=production bundle exec jekyll build
43+
JEKYLL_ENV=production $(BUNDLE) exec jekyll build
4444

4545
fonts: ## Download self-hosted fonts (DM Sans + Tajawal)
4646
@chmod +x scripts/download-fonts.sh
4747
@./scripts/download-fonts.sh
48+
49+
images: ## Optimize images (creates web-ready PNG/JPG copies)
50+
@echo "Optimizing images..."
51+
@cd assets/img && \
52+
sips -z 128 128 digital_bazaar_2025.jpg --out logo-128.jpg 2>/dev/null && \
53+
sips -z 256 256 digital_bazaar_2025.jpg --out logo-256.jpg 2>/dev/null && \
54+
sips -z 512 512 digital_bazaar_2025.jpg --out logo-512.jpg 2>/dev/null && \
55+
sips -z 16 16 digital_bazaar_2025.png --out favicon-16.png 2>/dev/null && \
56+
sips -z 32 32 digital_bazaar_2025.png --out favicon-32.png 2>/dev/null && \
57+
sips -z 180 180 digital_bazaar_2025.png --out apple-touch-icon.png 2>/dev/null && \
58+
sips -z 192 192 digital_bazaar_2025.png --out icon-192.png 2>/dev/null
59+
@echo "✓ Optimized images created in assets/img/"
60+
61+
images-webp: ## Convert images to WebP (requires: brew install webp)
62+
@echo "Converting to WebP..."
63+
@cd assets/img && \
64+
cwebp -q 80 logo-128.jpg -o logo-128.webp 2>/dev/null && \
65+
cwebp -q 80 logo-256.jpg -o logo-256.webp 2>/dev/null && \
66+
cwebp -q 80 logo-512.jpg -o logo-512.webp 2>/dev/null && \
67+
echo "✓ WebP images created:" && \
68+
ls -lh logo-*.webp

‎README.md‎

Lines changed: 69 additions & 183 deletions
Original file line numberDiff line numberDiff line change
@@ -4,234 +4,120 @@
44

55
> Where the Arab digital world meets, trades, and grows.
66
7-
## 🚀 Quick Start
7+
## Dependencies
88

9-
### Prerequisites
9+
| Tool | Version | Install (macOS) | Required |
10+
|------|---------|-----------------|----------|
11+
| Ruby | 3.3+ | `brew install ruby` | ✅ |
12+
| Bundler | 2.5+ | `gem install bundler` | ✅ |
13+
| WebP | latest | `brew install webp` | Optional |
1014

11-
- Ruby 3.3+ (install via Homebrew: `brew install ruby`)
12-
- Bundler (`gem install bundler`)
15+
> ⚠️ **macOS users**: Add Homebrew Ruby to PATH — the system Ruby (2.6) won't work.
16+
> ```bash
17+
> echo 'export PATH="/opt/homebrew/opt/ruby/bin:/opt/homebrew/lib/ruby/gems/3.4.0/bin:$PATH"' >> ~/.zshrc && source ~/.zshrc
18+
> ```
1319
14-
### Setup
20+
## Quick Start
1521
1622
```bash
17-
# Clone the repository
1823
git clone https://github.com/DigitalBazaarHub/digitalbazaar.github.io.git
1924
cd digitalbazaar.github.io
20-
21-
# Install dependencies
2225
make install
23-
24-
# Start local development server
2526
make serve
2627
```
2728
28-
Visit [http://localhost:4000](http://localhost:4000) to see the site.
29+
Visit [http://localhost:4000](http://localhost:4000)
2930

30-
## 🛠️ Local Development Environment Setup
31+
## Commands
3132

32-
### System Requirements
33-
34-
| Requirement | Version | Notes |
35-
|-------------|---------|-------|
36-
| **Ruby** | 3.3+ (recommended 3.4.x) | macOS system Ruby (2.6) will NOT work |
37-
| **Bundler** | 2.5+ | Gem dependency manager |
38-
| **Jekyll** | 4.4+ | Static site generator (installed via Bundler) |
39-
| **macOS** | 12+ | Or Linux/WSL2 on Windows |
33+
| Command | Description |
34+
|---------|-------------|
35+
| `make install` | Install dependencies |
36+
| `make serve` | Dev server with live reload |
37+
| `make prod-build` | Production build (run before committing) |
38+
| `make build` | Build static site |
39+
| `make clean` | Remove generated files |
40+
| `make fonts` | Download self-hosted fonts |
41+
| `make images` | Optimize images (PNG/JPG) |
42+
| `make images-webp` | Convert to WebP (requires `webp`) |
4043

41-
### macOS Setup (Homebrew)
44+
## Workflows
4245

43-
The system Ruby on macOS is outdated and won't work. Install Ruby via Homebrew:
46+
### Adding a New Article
4447

4548
```bash
46-
# 1. Install Homebrew (if not installed)
47-
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
48-
49-
# 2. Install Ruby
50-
brew install ruby
51-
52-
# 3. Add Ruby to your PATH (add to ~/.zshrc or ~/.bashrc)
53-
echo 'export PATH="/opt/homebrew/opt/ruby/bin:$PATH"' >> ~/.zshrc
54-
echo 'export PATH="/opt/homebrew/lib/ruby/gems/3.4.0/bin:$PATH"' >> ~/.zshrc
49+
# 1. Create the post file
50+
touch _posts/$(date +%Y-%m-%d)-my-article-slug.md
5551

56-
# 4. Reload your shell
57-
source ~/.zshrc
58-
59-
# 5. Verify Ruby version (should show 3.3+ not 2.6)
60-
ruby --version
61-
# Expected: ruby 3.4.x (2024-xx-xx revision xxxxxxxx)
62-
63-
# 6. Install Bundler
64-
gem install bundler
65-
```
66-
67-
> ⚠️ **Important**: If `ruby --version` still shows `2.6.x`, your PATH is not configured correctly. The Homebrew Ruby must come BEFORE the system Ruby in your PATH.
68-
69-
### Linux Setup (Ubuntu/Debian)
70-
71-
```bash
72-
# Install dependencies
73-
sudo apt update
74-
sudo apt install ruby-full build-essential zlib1g-dev
52+
# 2. Add front matter and content (see template below)
7553

76-
# Add gem path to ~/.bashrc
77-
echo 'export GEM_HOME="$HOME/gems"' >> ~/.bashrc
78-
echo 'export PATH="$HOME/gems/bin:$PATH"' >> ~/.bashrc
79-
source ~/.bashrc
54+
# 3. Preview locally
55+
make serve
8056

81-
# Install Bundler
82-
gem install bundler
57+
# 4. Build and commit
58+
make prod-build
59+
git add .
60+
git commit -m "Add new article: My Article Title"
61+
git push
8362
```
8463

85-
### Project Setup
86-
87-
Once Ruby is properly installed:
64+
### Updating Assets (Logo, Fonts, Images)
8865

8966
```bash
90-
# Clone the repository
91-
git clone https://github.com/DigitalBazaarHub/digitalbazaar.github.io.git
92-
cd digitalbazaar.github.io
67+
# 1. Replace source files in assets/img/ (keep originals)
9368

94-
# Install gem dependencies
95-
make install
69+
# 2. Regenerate optimized versions
70+
make images # Creates resized PNG/JPG
71+
make images-webp # Creates WebP versions
9672

97-
# Download self-hosted fonts (optional but recommended)
73+
# 3. If updating fonts
9874
make fonts
9975

100-
# Start the development server
101-
make serve
102-
```
103-
104-
### Verify Your Environment
105-
106-
```bash
107-
# Check all versions
108-
ruby --version # Should be 3.3+
109-
bundler --version # Should be 2.5+
110-
jekyll --version # Should be 4.4+ (after make install)
111-
112-
# Check Ruby location (should NOT be /usr/bin/ruby)
113-
which ruby
114-
# Expected: /opt/homebrew/opt/ruby/bin/ruby (macOS)
115-
```
116-
117-
### Troubleshooting
118-
119-
| Problem | Solution |
120-
|---------|----------|
121-
| `Could not find 'bundler'` | Wrong Ruby version. Check `which ruby` — must be Homebrew Ruby, not system |
122-
| `bundle: command not found` | Run `gem install bundler` with correct Ruby |
123-
| `Permission denied` on gems | Don't use `sudo`. Fix your PATH or use `GEM_HOME` |
124-
| Fonts not loading | Run `make fonts` to download self-hosted fonts |
125-
| Port 4000 in use | Kill existing: `pkill -f jekyll` or use `--port 4001` |
126-
127-
### Environment Variables
128-
129-
The `Makefile` automatically sets the Ruby PATH for Homebrew installations:
130-
131-
```makefile
132-
RUBY_PATH := /opt/homebrew/opt/ruby/bin:/opt/homebrew/lib/ruby/gems/3.4.0/bin
133-
```
134-
135-
If your Ruby is installed elsewhere, update this path in the `Makefile`.
136-
137-
## 📋 Available Commands
138-
139-
Run `make help` to see all available commands:
140-
141-
| Command | Description |
142-
|---------|-------------|
143-
| `make help` | Show all available commands |
144-
| `make install` | Install Ruby gem dependencies |
145-
| `make update` | Update all gems to latest versions |
146-
| `make serve` | Start local dev server with live reload |
147-
| `make serve-drafts` | Start server with draft posts visible |
148-
| `make build` | Build the static site (output to `_site/`) |
149-
| `make prod-build` | Build for production (minified) |
150-
| `make clean` | Remove generated files and caches |
151-
| `make fonts` | Download self-hosted fonts (DM Sans + Tajawal) |
152-
153-
### ⚠️ Before Committing
154-
155-
Always run a production build before committing your changes:
156-
157-
```bash
76+
# 4. Build and commit
15877
make prod-build
78+
git add .
79+
git commit -m "Update assets"
80+
git push
15981
```
16082

161-
This is especially important when:
162-
- **Changing CSS/SCSS** — Ensures styles are properly compiled and minified
163-
- **Adding new pages or layouts** — Catches Liquid template errors
164-
- **Modifying `_config.yml`** — Validates configuration changes
83+
## Writing Articles
16584

166-
The production build will fail fast on errors that might not appear during `make serve`.
167-
168-
> 💡 **Tip**: Consider adding `make prod-build` to a pre-commit hook for automatic verification.
169-
170-
## 📁 Project Structure
171-
172-
```
173-
├── _config.yml # Jekyll configuration
174-
├── _data/
175-
│ ├── strings_ar.yml # Arabic UI strings
176-
│ ├── strings_en.yml # English UI strings
177-
│ ├── categories.yml # Article categories
178-
│ └── rules.yml # Community rules (bilingual)
179-
├── _docs/ # Design system documentation
180-
├── _includes/ # Reusable components
181-
├── _layouts/ # Page templates
182-
├── _posts/ # Blog articles
183-
├── ar/ # Arabic pages
184-
├── en/ # English pages
185-
├── assets/
186-
│ ├── css/styles.scss # Main stylesheet (Sass)
187-
│ ├── fonts/ # Self-hosted fonts (woff2)
188-
│ └── img/ # Images
189-
├── scripts/
190-
│ └── download-fonts.sh # Font download script
191-
├── .github/workflows/ # GitHub Actions for deployment
192-
├── Gemfile # Ruby dependencies
193-
├── Gemfile.lock # Locked dependency versions
194-
└── Makefile # Development commands
195-
```
196-
197-
## ✍️ Writing Articles
198-
199-
Create a new file in `_posts/` with the format `YYYY-MM-DD-slug.md`:
85+
Create `_posts/YYYY-MM-DD-slug.md`:
20086

20187
```yaml
20288
---
20389
layout: article
204-
title: "Your Article Title"
205-
author: "Author Name"
90+
title: "Your Title"
91+
author: "Name"
20692
date: 2025-01-15
207-
lang: ar # 'ar' or 'en'
208-
category: community # See _data/categories.yml
209-
author_type: team # 'team' or 'member'
93+
lang: ar # 'ar' or 'en'
94+
category: community # See _data/categories.yml
95+
author_type: team # 'team' or 'member'
21096
excerpt: "Brief description"
211-
read_time: 5
97+
read_time: 5 # Minutes
21298
---
21399

214-
Your content here...
100+
Your content here (supports Markdown and HTML)...
215101
```
216102

217-
## 🌐 Deployment
103+
## Project Structure
218104

219-
The site automatically deploys to GitHub Pages when you push to `main`.
220-
221-
- **Live site**: [https://digitalbazaarhub.github.io](https://digitalbazaarhub.github.io)
222-
- **Deployment**: GitHub Actions (see `.github/workflows/jekyll.yml`)
223-
224-
## 🎨 Design System
225-
226-
- **Fonts**: Tajawal (Arabic), DM Sans (English)
227-
- **Colors**: Sand, Saffron, Terracotta, Marigold, Teal, Night
228-
- **RTL/LTR**: Automatic based on language
229-
230-
See `_docs/` for detailed design documentation.
105+
```
106+
_config.yml # Jekyll config
107+
_data/ # Translations & content (strings_ar.yml, strings_en.yml, rules.yml)
108+
_includes/ # Components
109+
_layouts/ # Templates
110+
_posts/ # Articles
111+
ar/, en/ # Language-specific pages
112+
assets/css/ # Styles (SCSS)
113+
assets/fonts/ # Self-hosted fonts
114+
assets/img/ # Images
115+
Makefile # Dev commands
116+
```
231117

232-
## 📜 License
118+
## Deployment
233119

234-
MIT License — see [LICENSE](LICENSE)
120+
Pushes to `main` auto-deploy via GitHub Actions → [digitalbazaarhub.github.io](https://digitalbazaarhub.github.io)
235121

236122
---
237123

‎_data/strings_ar.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ hero:
3939
# Buttons
4040
buttons:
4141
join_whatsapp: "انضم للواتساب"
42-
visit_github: "زر GitHub"
42+
visit_github: "GitHub"
4343
read_more: "اقرأ المزيد"
4444
back_home: "العودة للرئيسية"
4545
back_to_articles: "العودة للمقالات →"

‎_data/strings_en.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ hero:
3939
# Buttons
4040
buttons:
4141
join_whatsapp: "Join WhatsApp"
42-
visit_github: "Visit GitHub"
42+
visit_github: "GitHub"
4343
read_more: "Read More"
4444
back_home: "Back to Home"
4545
back_to_articles: "← Back to Articles"

0 commit comments

Comments
 (0)