Read in: English | 한국어 | Deutsch | 中文 | Türkçe
Bu, hafif bir terminal tarzı kişisel web sayfası şablonudur. Herhangi bir derleme aracına (build tool) ihtiyaç duymayan basit bir statik site olarak oluşturulmuştur: Sadece saf HTML, CSS ve JavaScript.
Bu depoyu kendi portföyünüz için bir şablon (template) olarak kullanabilirsiniz. Bunun için birkaç yapılandırma değerini manuel olarak düzenleyebilir veya yerleşik yapılandırma oluşturucuyu (config generator) kullanabilirsiniz.
💡 Daktilo animasyonunu ve etkileşimli komutları canlı olarak deneyimleyin.
⚙️ Kodlara hiç dokunmadan kişiselleştirilmiş yapılandırma dosyanızı görsel olarak oluşturun!
Geliştirici: PythonToGo
Terminal portföyünüzü saniyeler içinde çalışır hale getirin. Aşağıdaki komutları kopyalayıp terminalinize yapıştırın:
# 1. Depoyu klonlayın
git clone [https://github.com/PythonToGo/terminal-portfolio-template.git](https://github.com/PythonToGo/terminal-portfolio-template.git)
# 2. Dizin içerisine girin
cd terminal-portfolio-template
# 3. index.html dosyasını varsayılan web tarayıcınızda açın
# (macOS için 'open', Windows için 'start', Linux için 'xdg-open' kullanın)
open index.html
Açıldıktan sonra, aşağıdaki yöntemlerden birini kullanarak özelleştirebilirsiniz:
- A Seçeneği (Manuel): Doğrudan
js/commands.jsdosyasını düzenleyin. - B Seçeneği (Önerilen):
terminal-config.jsdosyanızı kolayca oluşturmak için Yapılandırma Oluşturucuyu (Config Generator) kullanın.
Not: Yalnızca portföy kullanımı için derleme araçları veya
npmgerekmez.npmyalnızca şablon kodunu değiştirirken veya katkıda bulunurken gereklidir.
Temel dosya ve dizinlere kısa bir bakış:
.
├── index.html # Ana terminal sayfası
├── terminal-config.js # Kişisel yapılandırmanız (isteğe bağlı, oluşturucu ile üretilir)
├── js/ # Çekirdek mantık (komutlar, GitHub API, vb.)
├── css/ # Çeşitli terminal renk temaları
└── generator/ # Web tabanlı yapılandırma oluşturucu aracı
├── index.html # Yapılandırma oluşturucu formu
├── main.js # Form mantığı ve yapılandırma oluşturma
└── style.css # Oluşturucu stilleri
js/commands.js dosyasını açın ve dosyanın en üstündeki sabit değerleri düzenleyin:
GITHUB_USERNAME,EMAIL_ADDRESSlinkedin,github,blog(bağlantılar bölümünden gizlemek için boş""bırakın)linksOthers– Şu formatı kullanarak özel bağlantılar ekleyin:{ "twitter": { name: "Twitter", url: "..." } }CLAUDE_OWNER_NAME(yedek isim)about,links,projects,help,welcomeMsg,bannerthemes– Tema adlarını ilgili CSS dosya yollarına eşlerallCommands– Tab (Sekme) otomatik tamamlama için kullanılan listeyi tanımlar
Not: Bu en basit moddur ve hiçbir derleme adımı veya harici yapılandırma dosyası gerektirmez.
Tarayıcıda generator/index.html dosyasını açın veya barındırılan oluşturucuyu ziyaret edin.
| Bölüm | Alanlar |
|---|---|
| Profile (Profil) | Tam ad, e-posta, GitHub kullanıcı adı, blog başlığı, Giriş/Hakkımda metni (isteğe bağlı) |
| Links (Bağlantılar) | GitHub URL, LinkedIn URL (isteğe bağlı), Blog URL (isteğe bağlı), Diğerleri (isteğe bağlı: Her satıra bir Ad ve URL, ` |
| Theme (Tema) | Varsayılan tema |
| Banner (Afiş) | Afiş metni, Afiş yazı tipi stili (block, dotted, light, minimal, shadow), canlı önizleme |
Oluşturucu, aşağıdaki gibi görünen bir window.TERMINAL_CONFIG nesnesi üretir:
{
profile: { name, email, githubUsername, blogTitle },
links: { github, linkedin?, blog?, others? },
theme: { defaultTheme, bannerText, bannerFont },
content: { aboutLines? }
}| Yapılandırma Yolu | Kullanım Amacı |
|---|---|
profile.name |
Afiş metni (theme.bannerText boşsa), terminal komut satırı, yedek about metni, CLAUDE_OWNER_NAME |
profile.email |
email komutunu çalıştırırken kullanılır |
profile.githubUsername |
GitHub bağlantısını oluşturur ve projects komutu için depoları (repo) çeker |
links.github |
links tablosunda gösterilir, github komutu tarafından kullanılır |
links.linkedin |
links tablosunda gösterilir, linkedin komutu tarafından kullanılır (boşsa gizlenir) |
links.blog |
links tablosunda gösterilir (boşsa gizlenir) |
links.others |
links tablosunda gösterilir ve özel komutlar oluşturur (Örn: Twitter eklendiğinde twitter yazabilirsiniz) |
theme.defaultTheme |
Sayfa yüklendiğinde uygulanacak başlangıç renk temasını ayarlar |
theme.bannerText |
ASCII afiş (banner) olarak oluşturulacak metin |
theme.bannerFont |
Afiş stili (block, dotted, light, minimal, shadow) |
content.aboutLines |
about komutunun çıktı içeriği (Yedek değer: "Hi there, I am {Tam Ad}") |
| Komut | Açıklama |
|---|---|
help |
Kullanılabilir tüm komutları listeler |
about |
Giriş/hakkımda metnini gösterir |
links |
GitHub, LinkedIn, blog ve özel bağlantıları içeren bir tablo gösterir |
projects |
GitHub API aracılığıyla GitHub depolarını (repo) çeker ve gösterir |
email |
Varsayılan e-posta istemcisini açar (mailto:) |
linkedin, github |
İlgili URL'leri yeni bir sekmede açar (yapılandırılmamışsa linkedin gizlenir) |
theme ls |
Kullanılabilir tüm temaları listeler |
theme set <name> |
Mevcut temayı değiştirir |
theme random |
Rastgele bir tema uygular |
banner |
ASCII afişi (banner) gösterir |
clear |
Terminal çıktı ekranını temizler |
history |
Komut geçmişini gösterir |
echo <text> |
Girilen metni terminalde aynen yazdırır |
ping <host> |
Sahte ping simülasyonu çalıştırır |
explain, run, edit |
Claude tarzı sürpriz yumurtalar (easter eggs) |
ls, cd |
Sahte dosya sistemi gezinme komutları |
vi, vim, nvim, emacs |
Metin düzenleyici şakaları |
sudo |
Erişim engellendi mesajı + sürpriz yumurta |
Not: links.others içine eklenen özel bağlantılar otomatik olarak komut haline gelir. (Örn: Twitter|https://... olarak yapılandırmak twitter komutunu etkinleştirir).
Aşağıdaki temalar varsayılan olarak mevcuttur:
lila (varsayılan), midnight, chocolate, og (orijinal), rainbow, orange, olive, bluescreen
- Yazı tipi stilleri: block, dotted, light, minimal, shadow
- Metin formatı: Hem büyük hem de küçük harfler desteklenir.
- Yapılandırma:
theme.bannerText(veya yedek olarakprofile.name) vetheme.bannerFontaracılığıyla yönetilir.
Her şeyin doğru çalışmasını sağlamak için, komut dosyaları (script) şu sırayla yüklenir:
terminal-config.js(isteğe bağlı, oluşturucu çıktısı)js/github.jsjs/caret.jsjs/ascii_banner.jsjs/commands.jsjs/main.js
- Hiçbir derleme aracına (Webpack, Vite, Node.js) ihtiyaç yoktur.
- Tarayıcınızda doğrudan
index.htmldosyasını açın veya herhangi bir basit yerel web sunucusunu (örn.python -m http.server) kullanarak klasörü sunun.
Şablonu fork ettiğinizde veya değiştirdiğinizde CI otomatik olarak çalışır:
- Testler (
npm test): Birim testleri (örn.completeQuery, oluşturucu çıktı doğrulaması). - Lint (
npm run lint): Kod kalitesi için ESLint. - Denetim (
npm audit): Bağımlılık güvenlik kontrolü.
Yerel çalıştırma: npm install → npm test → npm run lint
Bu şablon, sitenizi otomatik olarak yayınlamak (deploy) için .github/workflows/deploy-pages.yml konumunda kullanıma hazır bir GitHub Actions iş akışı içerir.
- Bu şablonu kullanarak yeni bir depo oluşturun (veya Fork/Clone yapın).
- Yaptığınız özelleştirmeleri varsayılan dalınıza (branch -
mainveyamaster) pushlayın. - GitHub deponuzda Settings (Ayarlar) → Pages (Sayfalar) bölümüne gidin.
- Source (Kaynak) açılır menüsünü GitHub Actions olarak ayarlayın.
"Deploy terminal portfolio to GitHub Pages" adlı GitHub Action ilk kez başarıyla çalıştıktan sonra, canlı sitenize şu adresten erişilebilecektir:
https://<github-kullanici-adiniz>.github.io/<repo-adiniz>/
Pull Request (PR) gönderimleri, hata bildirimleri (bug report) ve iyileştirme önerileri her zaman kabul edilir!
- Orijinal terminal portföyü konsepti ve şablonu PythonToGo tarafından oluşturulmuştur.

