Claude Code ve Logto ile özel giriş akışlarını hızla oluşturun
Claude Code'u kullanarak Logto kimlik doğrulamasıyla tam yığın bir uygulamanın nasıl oluşturulacağını öğrenin: giriş ayarından özel giriş panellerine ve sosyal girişlere kadar.
Claude Code'u kullanarak Logto kimlik doğrulamasıyla tam yığın bir uygulamanın nasıl oluşturulacağını öğrenin: giriş ayarından özel giriş panellerine ve sosyal girişlere kadar.
Claude Code, Anthropic tarafından geliştirilen, geliştiricilerin kod yazma, hata ayıklama ve kodu anlama süreçlerini daha verimli hale getirmeye yardımcı olan yapay zeka destekli bir kodlama asistanıdır. Genel sohbet robotlarından farklı olarak, programlama iş akışlarına odaklanır ve geliştirme ortamlarıyla derinlemesine entegre olur. Geliştiriciler, kod parçacıkları üretmek, karmaşık fonksiyonları açıklamak, hataları düzeltmek veya prototiplemeyi hızlandırmak için bu aracı kullanabilirler; hem de araçlar arasında geçiş yapmak zorunda kalmadan ve odaklarını kaybetmeden.
Temelini, güvenlik, güvenilirlik ve yardımcı olma vurgusuyla eğitilmiş Anthropic’in Claude modelleri oluşturuyor. Yani Claude Code sadece hızla ilgili değil, gerçek projelerde güvenilir ve sürdürülebilir kodlar üretmeyi amaçlar.
Piyasada zaten kodlama yardımcıları ve yapay zeka asistanları var, fakat Claude Code bazı önemli noktalarda fark yaratıyor:
Kısacası, diğer araçlar kod tamamlama üzerine yoğunlaşırken, Claude Code hem üretim hem de anlayış arasında denge kuran bir kodlama ortağı olmayı amaçlar.
Claude Code geniş bir kullanıcı kitlesi için tasarlanmıştır:
Özetle, eğer düzenli olarak kod yazıyor, okuyor veya yönetiyorsan; Claude Code geliştirme sürecini daha hızlı, daha açık ve daha güvenilir kılabilir.
Bugün sana, Claude Code kullanarak uygulamana özel giriş eklemeyi anlatan bir eğitim sunacağım; ister profesyonel geliştirici ol ister hobi için kodluyor ol.
Bu örnekte, Claude Code’u bir belge yöneticisi uygulaması yapmak için kullandım.
Önce, Logto Cloud Console adresine gidip tek sayfalık bir uygulama oluşturdum. Karşına çeşitli yapılandırma seçenekleri ve uç noktalar çıkacak, bunları entegrasyon sırasında kullanacağız.

Geri kalanını Claude Code halletti: güncel Logto React SDK sürümünü yükledi, kimlik doğrulama bileşenlerini kurdu ve her şeyi birbirine bağladı.

Yönergelere göre iki önemli bilgi vermem gerekiyordu:
Logto uç noktasını ve App ID’yi projemde gerekli yerlere kopyaladım ve Redirect URI’lerini ve Çıkış sonrası yönlendirme URI’lerini yapılandırdım.

Bu iki bilgiyi doğrudan Claude Code'a iletebilirsin, gerisini otomatik olarak yapılandıracaktır.
Şimdi deneyelim: 'Sign in' butonuna tıkla, Logto'nun barındırılan giriş ekranına yönlendirileceksin.

Bir çıkış sonrası URL ayarladıysan, çıkış yaptıktan sonra o sayfaya yönlendirileceksin.
Logto, Konsol’da özelleştirilebilen, hazır bir giriş akışı sunuyor. Başlamak için Giriş Deneyimi > Giriş & Kayıt sekmesine git, tercih ettiğin giriş yöntemlerini seç (örneğin e-posta, kullanıcı adı, telefon numarası veya sosyal giriş).
Yapılandırma tamamlandığında, giriş akışını tetiklemek kullanıcıları seçtiğin seçeneklerle Logto'nun giriş ekranına yönlendirir. Tüm kimlik doğrulama süreci Logto tarafından yönetilir, kullanıcılar giriş yaptıktan sonra uygulamana döner.
Şimdi bir adım ileri gidip, daha özelleştirilmiş bir giriş deneyimi yapmak istiyorum. Ayrı bir sayfaya yönlendirmek yerine, ürün arayüzünün hemen üzerinde yüzen bir giriş paneli ekleyeceğim. Böylece kullanıcılar bağlamdan kopmaz, altta ise yine Logto'nun kimlik doğrulama akışı çalışır.
Sade bir doğal dil ifadesiyle komut verebilirsin:

Claude Code şunları oluşturacak:
Test kullanıcın ile girişin Logto CIAM platformuna düştüğünü doğrulayabilirsin.

Bu sadece temel bir örnek. Logto şu anda doğrudan IDE’nin içinde çalışan MCP sunucularını geliştiriyor, böylece Logto Konsolu ve Yönetim API’si ile geliştirme ortamını hiç terk etmeden etkileşime geçebileceksin.
Bu yeni yapıyla şunları yapabileceksin:
Yerel araçlar, AI ve Logto altyapısının birleşimiyle; kimlik doğrulama entegrasyonu zahmetli olmaktan çıkıyor, doğal geliştirme iş akışının bir parçası haline geliyor.