feat: add new blog posts, associated images, and automation scripts for content management
This commit is contained in:
Poyraz Avsever
+26
-33
@@ -1,42 +1,35 @@
|
||||
# Medium Yazılarını Kişisel Web Sitesine Taşıma Planı
|
||||
# Medium Yazılarını Arşiv Beklemeden (Hızlı) Taşıma Planı
|
||||
|
||||
Bu plan, Medium üzerindeki içeriklerin poyrazavsever.com (poyraz-portal) altyapısına Markdown formatında, SEO dostu ve kalıcı bir şekilde aktarılması için hazırlanmıştır.
|
||||
Bu plan, Medium'un "Download your information" sürecini beklemeden, yayındaki makaleleri doğrudan URL üzerinden Markdown formatına dönüştürmek için tasarlanmıştır.
|
||||
|
||||
---
|
||||
|
||||
## 1. Hazırlık ve Veri Edinme
|
||||
* **Arşiv Talebi:** Medium Ayarları > Güvenlik > "Download your information" sekmesinden tüm verilerin yedeğini iste.
|
||||
* **Yerel Çalışma Alanı:** Bilgisayarında `medium-migration` adlı geçici bir klasör oluştur ve gelen .zip dosyasını buraya ayıkla.
|
||||
* **İçerik Analizi:** `posts` klasöründeki HTML dosyalarını incele. Hangi yazıların taşınacağına, hangilerinin taslak olarak kalacağına karar ver.
|
||||
## 1. Yöntem Seçimi ve Araç Kurulumu
|
||||
* **CLI (Toplu Çekim):** Tüm yazıları tek seferde çekmek için terminal üzerinden `medium-to-markdown` gibi araçları hazırla.
|
||||
* **Eklenti (Tekil Çekim):** Eğer yazı sayısı az ise, tarayıcıya "MarkDownload" veya "Medium to Markdown" eklentisini kur.
|
||||
* **Klasör Yapısı:** Kendi web siten (poyrazavsever.com) içinde yazılar için geçici bir `/temp-blog` klasörü oluştur.
|
||||
|
||||
## 2. Format Dönüştürme (HTML -> Markdown)
|
||||
* **Araç Seçimi:** HTML dosyalarını Markdown'a (.md) çevirmek için bir kütüphane (Turndown vb.) veya hazır bir CLI aracı belirle.
|
||||
* **Frontmatter Yapılandırması:** Her Markdown dosyasının başına sitenin (Next.js/Astro vb.) okuyabileceği metadata bloklarını ekle:
|
||||
* Başlık (Title)
|
||||
* Yayın Tarihi (Date)
|
||||
* Kategori/Etiketler (Tags)
|
||||
* Kapak Görseli Yolu (Cover Image)
|
||||
* Medium Orijinal Linki (Canonical URL için)
|
||||
* **Slug Temizliği:** Dosya isimlerini URL uyumlu hale getir (Örn: `yazi-basligi.md`).
|
||||
## 2. İçerikleri Otomatik Çekme
|
||||
* **Kullanıcı Yazılarını Listeleme:** Medium profilindeki (medium.com/@kullaniciadi) tüm yazı linklerini bir liste haline getir.
|
||||
* **Dönüştürme Komutunu Çalıştırma:** Terminal kullanarak tüm halka açık yazıları Markdown dosyası olarak yerel bilgisayarına indir.
|
||||
* **Kontrol:** İndirilen dosyaların `.md` uzantılı olduğunu ve içeriklerin (özellikle kod bloklarının) okunaklı olduğunu doğrula.
|
||||
|
||||
## 3. Medya ve Görsel Yönetimi
|
||||
* **Görsel İndirme:** Markdown içindeki Medium kaynaklı (miro.medium.com) görselleri yerel `/public/blog` klasörüne indir.
|
||||
* **Link Güncelleme:** Markdown dosyasındaki uzak görsel linklerini, kendi sitendeki yerel yollarla değiştir.
|
||||
* **Optimizasyon:** İndirilen görselleri WebP formatına çevirerek site hızını artır.
|
||||
## 3. Metadata (Frontmatter) Düzenleme
|
||||
* **Başlık ve Tarih:** Her dosyanın en üstüne sitenin tanıması için gerekli bilgileri ekle (Title, Date, Slug).
|
||||
* **Kategori Atama:** Yazıları Medium'daki etiketlerine göre klasörle veya etiket metadatalarını güncelle.
|
||||
* **Özet (Excerpt):** Yazıların giriş kısmından kısa birer özet oluşturup dosyaların başına ekle.
|
||||
|
||||
## 4. İçerik ve Kod Blokları Kontrolü
|
||||
* **Kod Blokları:** Medium'daki kod bloklarının ve Gist yerleştirmelerinin Markdown'da ` ``` ` içine doğru şekilde girip girmediğini kontrol et.
|
||||
* **Dahili Linkler:** Yazıların içinde başka Medium yazılarına verdiğin linkleri, kendi sitendeki yeni linklerle güncelle.
|
||||
* **Bileşen Dönüştürme:** Eğer sitende özel UI bileşenleri kullanıyorsan (Örn: `poyraz-ui`), Markdown içindeki bazı yapıları bu bileşenlere uyarla.
|
||||
## 4. Görsel ve Medya Optimizasyonu
|
||||
* **Görsel Kaynakları:** Markdown içindeki `https://miro.medium.com/...` ile başlayan görsel linklerini tespit et.
|
||||
* **Yerel Kaydetme:** Bu görselleri manuel veya bir script yardımıyla indirip sitendeki `/public/images/blog` klasörüne taşı.
|
||||
* **Yol Güncelleme:** Markdown dosyalarındaki görsel linklerini kendi sunucundaki yeni yollarla (`/images/blog/yazi1.jpg` gibi) değiştir.
|
||||
|
||||
## 5. SEO ve Yönlendirme Stratejisi
|
||||
* **Canonical URL:** Arama motorlarının kopya içerik algılamaması için, web sitendeki yazıların `<head>` kısmına orijinal Medium linkini "canonical" olarak ekle.
|
||||
* **Medium Güncelleme:** (Opsiyonel) Medium'daki yazılarını silmek yerine, en üstüne "Bu yazı artık poyrazavsever.com adresinde güncellenmektedir" notu ve linki ekle.
|
||||
## 5. Web Sitesine Entegrasyon
|
||||
* **Dosya Transferi:** Hazırlanan `.md` dosyalarını sitenin içerik yönetim sistemine (Content klasörüne) kopyala.
|
||||
* **Link Kontrolü:** Yazı içindeki diğer Medium yazılarına giden linkleri, kendi sitendeki yeni URL yapısına göre (`/blog/yazi-adi`) güncelle.
|
||||
* **SEO Ayarı:** Her yazı için `canonical` etiketini Medium'daki orijinal linki gösterecek şekilde ayarla (Bu adım SEO için kritiktir).
|
||||
|
||||
## 6. Yayınlama ve Test
|
||||
* **Yerel Test:** Yazıları kendi portalında (localhost) render et. Görselleri, linkleri ve kod bloklarını manuel olarak test et.
|
||||
* **Deployment:** İçerikleri GitHub repo'na pushla ve siteni yayına al.
|
||||
* **Dizin Bildirimi:** Yeni URL'leri Google Search Console üzerinden dizine eklenmesi için gönder.
|
||||
|
||||
---
|
||||
**Not:** Bu işlem bir kez yapıldıktan sonra, gelecekte yazacağın yazıları önce kendi sitende yayınlayıp sonra Medium'a "Import" etmen (Cross-posting) iş akışını çok daha kolaylaştıracaktır.
|
||||
## 6. Yayın ve Doğrulama
|
||||
* **Local Build:** Projeyi yerelde çalıştırarak görsellerin ve stilin (UI) doğru göründüğünden emin ol.
|
||||
* **Deployment:** Değişiklikleri ana repo'na gönder ve yayına al.
|
||||
* **Yönlendirme:** (Opsiyonel) Medium profilindeki biyografi kısmına "Yazılarım artık poyrazavsever.com/blog adresinde!" notunu ekle.
|
||||
@@ -0,0 +1,28 @@
|
||||
https://medium.com/@poyrazavsever/frontend-mimarisinde-en-zor-k%C4%B1s%C4%B1m-karar-vermek-b3719c7aaacd
|
||||
https://medium.com/@poyrazavsever/clean-architecture-frontende-nas%C4%B1l-uyarlan%C4%B1r-2db91f7e7c97
|
||||
https://medium.com/@poyrazavsever/frontend-developer-2025-yol-haritas%C4%B1-ki%C5%9Fisel-bak%C4%B1%C5%9F-a%C3%A7%C4%B1s%C4%B1yla-dda276fedfb7
|
||||
https://medium.com/@poyrazavsever/next-js-ile-edge-functions-h%C4%B1zl%C4%B1-web-uygulamalar%C4%B1-nas%C4%B1l-geli%C5%9Ftirilir-d94eafacf50e
|
||||
https://medium.com/@poyrazavsever/rss-ile-bilgi-ak%C4%B1%C5%9F%C4%B1n%C4%B1-algoritmadan-uzakla%C5%9Ft%C4%B1r-a30340175da3
|
||||
https://medium.com/@poyrazavsever/gpt-5-geldi-openainin-yeni-modeli-neler-sunuyor-88d67735a272
|
||||
https://medium.com/@poyrazavsever/deneyimlemeden-%C3%B6%C4%9Frenmeniz-gereken-g%C3%BCvenlik-a%C3%A7%C4%B1klar%C4%B1-55c31f58c2b2
|
||||
https://medium.com/@poyrazavsever/next-js-15-gelmi%C5%9F-neler-de%C4%9Fi%C5%9Fti-peki-651cd716839b
|
||||
https://medium.com/@poyrazavsever/docker-nedir-kahveni-al-docker%C4%B1-konu%C5%9Fuyoruz-de83718255e8
|
||||
https://medium.com/@poyrazavsever/css-frameworkleri-tan%C4%B1yoruz-5-b%C3%B6l%C3%BCm-materialize-5fd3c99862c2
|
||||
https://medium.com/@poyrazavsever/css-frameworkleri-tan%C4%B1yoruz-4-b%C3%B6l%C3%BCm-chakra-ui-529192099789
|
||||
https://medium.com/@poyrazavsever/css-frameworkleri-tan%C4%B1yoruz-3-b%C3%B6l%C3%BCm-bulma-7576b893d449
|
||||
https://medium.com/@poyrazavsever/css-frameworkleri-tan%C4%B1yoruz-2-b%C3%B6l%C3%BCm-foundation-68b08997cea3
|
||||
https://medium.com/@poyrazavsever/css-frameworkleri-tan%C4%B1yoruz-1-b%C3%B6l%C3%BCm-bootstrap-232619268cc8
|
||||
https://medium.com/@poyrazavsever/react-native-nedir-avantajlar%C4%B1-ve-dezavantajlar%C4%B1-4b26608a03cd
|
||||
https://medium.com/@poyrazavsever/three-js-3-boyutlu-d%C3%BCnyaya-merhaba-07b174dd6759
|
||||
https://medium.com/@poyrazavsever/react-ile-dinamik-bir-kullan%C4%B1c%C4%B1-profil-sayfas%C4%B1-nas%C4%B1l-tasarlan%C4%B1r-12d56031c253
|
||||
https://medium.com/@poyrazavsever/yaz%C4%B1l%C4%B1m-geli%C5%9Ftirme-s%C3%BCre%C3%A7lerinde-agile-ve-scrum-45ad7f7b9ce6
|
||||
https://medium.com/@poyrazavsever/yaz%C4%B1l%C4%B1m-d%C3%BCnyas%C4%B1nda-hitabet-sanat%C4%B1n%C4%B1n-g%C3%BCc%C3%BC-i%CC%87leti%C5%9Fimin-yaz%C4%B1l%C4%B1m-d%C3%BCnyas%C4%B1na-e-etkisi-a1a1bbcf6db6
|
||||
https://medium.com/@poyrazavsever/mikro-etkile%C5%9Fimlerde-i%CC%87kon-kullan%C4%B1m%C4%B1-2262a71d9a4a
|
||||
https://medium.com/@poyrazavsever/webpack-vs-vite-frontend-projelerinde-build-ara%C3%A7lar%C4%B1-kar%C5%9F%C4%B1la%C5%9Ft%C4%B1rmas%C4%B1-fb8f24c4d095
|
||||
https://medium.com/@poyrazavsever/ux-tasar%C4%B1m%C4%B1-ve-i%CC%87nsan-psikolojisi-f6570a41ab9b
|
||||
https://medium.com/@poyrazavsever/frontend-testing-ara%C3%A7lar%C4%B1-jest-ve-cypress-ile-ba%C5%9Flamak-82ba26656a01
|
||||
https://medium.com/@poyrazavsever/typescript-ile-javascriptten-tsx-e-ge%C3%A7i%C5%9F-ki%C5%9Fisel-bir-deneyim-308bdb14f1d0
|
||||
https://medium.com/@poyrazavsever/svelte-ile-i%CC%87lk-ad%C4%B1mlar-react-ve-vueya-kar%C5%9F%C4%B1-h%C4%B1zl%C4%B1-m%C4%B1-c5ae640145c9
|
||||
https://medium.com/@poyrazavsever/tailwind-css-ile-tasar%C4%B1m-s%C3%BCrecini-nas%C4%B1l-h%C4%B1zland%C4%B1rabilirsiniz-90ef7fbd9faf
|
||||
https://medium.com/@poyrazavsever/kullan%C4%B1c%C4%B1-ara%C5%9Ft%C4%B1rmas%C4%B1-ve-personas-olu%C5%9Fturma-tasar%C4%B1m%C4%B1n-gizli-kahramanlar%C4%B1-2930cf7dbe13
|
||||
https://medium.com/@poyrazavsever/yaz%C4%B1l%C4%B1m-projelerinde-d%C3%BCzen-ve-verimlilik-i%CC%87%C3%A7in-conventional-commits-nedir-4413e05ffbbf
|
||||
Reference in New Issue
Block a user