Google Geçen hafta harika ücretsiz Bir aracın kullanımını herkese açtı Project ıx Aslında geçen sene duyurulmuştu ama sadece davetli kullanıcılar kullanabiliyordu Ben de anlatmayı sürekli erteliyorsa da videosunu hazırladım kısaca ne yapıyor bu platform içerisinde güncel birçok yazılım teknolojisi mevcut bu teknolojiler ile proje oluşturmanın geliştirmenizi yayınlamanın ve dağıtmanın html projesi içerisinde olabilecek tüm dosyaları kendi otomatik olarak oluşturuyor yine kendi içerisinde yaptığınızı hemen görebileceğiniz Bir web arayüzü de oluşuyor yine aynı platform içerisinden çıkmadan projenizi yayınlayabilir isterseniz kişisel domain adresinize de bağlayabilir Hepsini yapacağız videoya geçelim ıdx ndv adresine geldim videoda kullanacağım tüm linkleri videonun Açıklama kısmında bulabilirsiniz sol üst köşeden Project ıx ikonuna tıklıyorum bir Google hesabınızın olduğunu ve giriş yaptığınızı varsayıyorum ilk defa giriş yaptığımız için birkaç noktada onay vermemiz gerekiyor accept Check bını işaretliyorum ve continue butonuna tıklıyorum Ceminay aı özelliklerini aktive etmek ister misiniz diye sordu Evet istiyorum ve enable a features butonuna tıklıyorum tekrar continue butonuna tıklıyorum ve Project ıx in içerisindeyim burada videonun girişinde de söylediğim gibi şu şu an aktif olarak birçok yazılım teknolojisini içerisinde barındırıyor hyton flux Note Express Go Astro angler nextjs gibi mobilde flutter Yapay Zeka Entegrasyonu için Tabii ki cemini API var veya gördüğünüz gibi Herhangi bir gitup projesini direkt buraya getirebilirsiniz Linux sanal makinesi üzerinde çalışıyor bu uygulamaları lokalde bilgisayarınızla çalıştırmak için farklı farklı birçok kütüphane indirmelisiniz burada indirmenize gerek yok Hepsi hazır geliyor Bunun yanında bilgisayarınızın gücüne ihtiyaç duymadan gördüğünüz gibi tarayıcı üzerinden kullanabilirsiniz Bu da çok önemli Bir artısı Bence se All template linkine tıklıyorum kategoriler halinde tüm teknolojileri görebiliyorum backend Mobile aı gibi Herhangi birisinin üzerine tıkladığınızda projeyi otomatik olarak sizin için oluşturuyor html ile başlayalım sonra sırasıyla diğer örneklere de bakarız Simple html linkine tıklıyorum çalışmama bir İsim vermem gerekiyor html diyorum çalışma alanının adına create butonuna tıkladım ve şu an dosyalarımı oluşturmaya başladı biraz vakit alıyor Ama ücretsiz olduğu için katlanılabilir süre bunun yanında daha önceki videolarımı izlediyseniz visual Studio Code kullanarak bu dosyaları tek tek ben oluşturuyordu bu süreden daha uzun bir süre değil yani şimdi geldi gördüğünüz gibi tüm dosyalar hazır yapı olarak visual Studio kodun aynısı Google Burada bence Çok akıllıca bir iş yapmış mt'nin Açık Kaynak visual Studio kod yapısını kullanmış bildiğiniz gibi Microsoft da bunu kullanarak bildiğimiz visual Studio kod uygulamasını geliştirmişti hemen sağ tarafta yaptığımız çalışmanın ön izlemesini de görebiliyoruz soldaki Side Bar'a index html main JavaScript ve Style CSS dosyalarının otomatik olarak eklendiğini görebilirsiniz index html dosyasını incelediğinizde Style CSS dosyasına ve main JavaScript dosyasına otomatik bağlandığını görebilirsiniz güzel özelliklerden biri de Gemini Project ıx içerisine Entegre hemen şu sağ alt köşeden Gemini ikonuna tıkladığımda Yapay Zeka aracı açılıyor continue direkt devam ediyorum şöyle bir şey yapalım benim için PlayStation 5 oyunları satan bir eticar sesi yapmasını isteyeyim detaylı hazırladığım bir prompt var girdim prompt umu menüleri footer kullanıcı yorumlarına kadar kendisinin yapmasını istediğim bir prompt gönderdim düşünüyor sonrasında yazmaya başladı bir yerde kesti Neden bilmiyorum hemen chat gpt 4 oyu deneyelim geliyorum chat gpt uygulamasına aynı prompt girip gönderiyorum tamamladı tüm kodları ben öyle istediğim için tek html dosyası içerisine yazmış kodları kopyalıyorum geliyorum ıdx ve index html dosyasının içerisine yapıştırıyorum hemen sağ bölümdeki web penceresinden yaptığımı görebilirim Şuradaki Yenile ikonuna tıkladım ve sitem geldi harika Ben de burada canlı olarak düzenleme yapabilirim Şuradaki ikona tıklayarak siteyi yeni bir tab'e açabilirim tıkladım açılan popup uptan Open butonuna tıklıyorum gayet güzel görünüyor Derli toplu bir site oldu bildiğiniz gibi chat gpt gidip istediğim gibi düzenleyebilirim başka bir şey deneyelim mesela şuraya image olarak bir logo eklemek istiyorum index html dosyasında görsel eklemek İstediğim yere geldim Command ı kısa yoluna bastım windows'da krol ı bir text bo açıldı ters Slash yapıyorum generate komutu çıktı enter'a basıyorum kabul etti şimdi eklemek istediğim nesneyi yani image yazıyorum ve enter'a basıyorum gördüğünüz gibi hemen ekledi kodu biliyor yazmak istemeyebilirsiniz veya bilemeye bilil siniz iki amaçla da kullanabilirsiniz Ben şimdi html için gösterdim ama videonun başında gösterdiğim tüm yazılım teknolojilerinde de cemini a'yı kullanabilirsiniz accept butonuna tıklıyorum ve eklenmiş oldu web sekmesine gelip refresh yapıyorum ve image geldi şu an bu görsel klasörde olmadığı için hatalı görünüyor ama eklemiş oldu geri aldım Başka ne için kullanabilirim cemini desteğini hata ayıklamak için kullanabilirim Örneğin şurada kasıtlı bir hata yapıyorum H1 teginin yanındaki Parantezi siliyorum şurada bir hata oluştu o satırı seçili hale getiriyorum yine Command ı kıs yoluyla cemine ii çağırıyorum ters Slash işaretini girip Fix yazıyorum bakın düşündü ve düzeltilmiş halini yazdı accept butonuna basıp doğru halini eklemesini sağlıyorum web tarafına geçip refresh yapıyorum ve düzeldiğini görebiliyorum hazır dosyalar açıkken başka bir html denemesi yapalım web'de çalışan bir ponk oyunu yapalım Ceminay danan ümidimi kesmek istemiyorum ilk ona soracağım geldim Ceminay sekmesine prompt umu giriyorum klavye tuşlarıyla oynayabileceğim html JavaScript ve CSS kodlarıyla bir ponk Game oyunu yaz abilir misin dedim ve gönderdim bsle başlıyor Ama sonra yarıda kesiyor tam anlayamadım token limiti falan diyeceğim ama öyle bir uyarı da vermiyor Neyse çok önemli değil chat gpe başvuruyorum hemen geldim chat gpt yapıştırdım aynı prompt ve gönderdim chat gpt hızlıca düşünüp yazmaya başladı tamamladı Öncelikle html' kopyaladım geldim ıdx ve index html içerisine yapıştırdım Style CSS kodlarını kopyaladım onları da gelip Style CSS dosyasının içerisine yapıştırdım chat gpt dos dos isimlerini farklı çalıştı ya dosya isimlerini değiştirebilirim ya da index dosyasındaki adresleri değiştirebilirim Ben adresleri değiştiriyorum Style CSS adresini dosyanın adı olan Style CSS yaptım JavaScript dosyasının adresini main JavaScript yaptım chat gpe dönüyorum JavaScript kodlarını kopyalıyorum ıdx gelip main JavaScript dosyasının içerisine yapıştırıyorum web sekmesinde refresh yapıyorum gördüğünüz gibi ponk oyunum geldi harici bir sekmede açıyorum ponk oyunum açıldığı klavye tuşlarım ile hareket ettirebiliyorum güzel oyunum hazır Şimdi bu oyunu Bir web adresi üzerinden yayınlayabilirim bunun için Google firebase platformunu kullanacağım firebase' birçok özelliği ve farklı birçok yeteneği var Biz bugün sadece web hosting özelliğini kullanacağız Hadi oyunumuzu yayınlayalım sidebar daki ıdx butonuna tıklıyorum bakın burada Host web with firebase seçeneği var tıklıyorum buna bir menü açıldı authenticate firebase linkine tıklıyorum bir firebase hesabı açmış olmanıza gerek yok şimdi otomatik olarak her şey Hall olmuş olacak terminal açıldı sabırla bekleyin bir şey yapmanıza gerek yok bazı içeriklerin yüklenmesi vakit alıyor geldi hata raporlarının bilgisinin toplanmasına izin veriyor musunuz diyor istemiyorum Bu sebeple klavyeden Ne yani No diyerek Enter tuşuna basıyorum Siz izin vermek isterseniz y tuşuna basabilirsiniz giriş yapmak için bilgiler geldi 2ci maddede verdiği linke tıklıyorum direkt tıklayamıyorum gördüğünüz gibi giriş yapmak istediğiniz Gmail adresinizi seçiyorsunuz devam et butonuna tıklıyorum istediği izinleri de veriyorum Bu da bir Google hizmeti olduğu için hiç problem yok açılan sayfada verdiği komutun terminalin zde Çalıştığına emin misiniz dedi eminim Çünkü zaten o yönlendirdi Yes Just Run butonuna tıklıyorum terminalde açılan rakam Burada da göründü bakın aynısı 528 95 Yes bu ID benim butonuna tıklıyorum bana bir autorisation kodu verdi bunu kopyalayıp 3 maddede kodu yapıştır dediği yere yapıştırıyorum sonrasında enter'a basıyorum ve success dedi yani login işlemim başarılı şimdi hosting barındırma işlemi başlatacağım ama öncesinde küçük bir işlem yapacağım çalıştığım dosyalarımı bir klasör içerisine yerleştireceğim bunu mutlaka yapmalısınız baştan da yapabilirdiniz böylece kolaylıkla tek bir klasörü firebase' yükleyebileceğim Sağ click yapıyorum ve New folder tıklıyorum yeni bir dosya açılıyor ponk ismini veriyorum oyunumun dosyalarını yani index html main JavaScript ve ve Style CSS dosyalarını seçip sürükleyerek pon klasörünün içerisine bırakıyorum taşımak istediğinize Emin misiniz u yarası çıkıyor ve move butonuna basıp Onaylıyorum hepsi taşındı gördüğünüz gibi şimdi tekrar firebase hosting ayarlarıma dönüyorum initialize firebase hosting linkine tıklıyorum benim için oluşturmaya başladı Birkaç soru soracak Buna göre ayarları tamamlayacak ilk soru geldi hangisini yapmak istiyorsunuz dedi firebase' de var olan bir dosyadan mı devam edeceksiniz yeni bir proje mi oluşturacaksınız ve diğer ayarlarda devam ediyor Ben daha hesabı yeni açtığım için yeni bir proje oluşturacağım klavyeden yön tuşlarıyla ikinci seçeneğe geliyorum Ve enter'a basıyorum şimdi projeye Biricik bir isim ver dedi Türkçe karakter olmadan boşluk olmadan bir isim verebilirsiniz ponk 1980 dedim Ben enter'a bastım projenize ne isim vermek istersiniz dedi aynı isimle devam etsin bu sebeple Bir şey yazmadan enter'a basıyorum projemi oluşturdu bir Framework kullanacak mısınız dedi kullanmayacağız düz html Bu sebeple n yazıp enter'a bastım public yani hangi klasörünüz yayınlanacak dedi asıl Burası için ponk klasörünü oluşturmuştur Aa oluşturduğum klasörün Adını yazıyorum Ben ponk demiştim hatırlarsanız enter'a bastım url'ler yeniden yazılsın mı dedi evet yazılsın y tuşuna bastım sonrasında enter dedim otomatik olarak github'a oluşturulsun mu dedi oluşturulmasını dedim Son soru var olan dosyaların üzerine yazılsın mı dedi no hayır dedi benim gibi dümdüz bir html yayınlamak istiyorsanız buradaki seçimlerin aynısını yapabilirsiniz tamamlandı şimdi soldaki Side Baran deploy to production linkine tıklıyorum ve yayına gönderiyorum Tüm dostları firebase' gönderdi ponk 1980 nwb npp isminde bir link oluşturdu benim için linke tıklıyorum açılmasını onay veriyorum ve açıldı link artık online bunu da kapatmayacağız girip oynarsınız bunu baştan da söylediğim gibi kendi domain adresinize de yönlendirebilirsiniz bunun için farkında olmadan açtığınız firebase hesabınıza gidebilirsiniz cons firebase google.com adresine gidiyorum bakın firebase projeleri arasında Açmış olduğum ponk 1980 projesini görüyorum üzerine tıkladım açılan sayfada deployed linkine tıklıyorum çalışmamın şu an yayınlandığı iki siteyi de görebiliyorum bakın burada bir ADD Custom domain butonu var Buna tıklıyorum açılan pop uptan hangi sitede yayınlamak istiyorsanız onun adresini giriyorsunuz ben Erhan meydan.com girdim continue butonuna bastım domainin satın aldığınız yerden değiştirmeniz gereken ayarları verdi bu ayarları burada olduğu şekilde domainin ie girerseniz yapmış olduğunuz site kendi domainin de çalışacaktır domain hesabınızdan ayarları yaptıktan sonra şuradan verify yaparsanız doğru bağlanıp bağlanmadığını anlayabilirsiniz domain tarafını da göstereyim domain hesabınızdan giriş yapıp ben name.com kullanıyorum DNS kayıtlarını güncelle başlığından firebase' verdiği bilgileri girebilirsiniz son olarak Project ıx projenizi silmezsen dosyalar üzerine yaptığınız değişikliklerde deploy to production komutuyla sitenizde update edebilirsiniz oyun web sitemizi yayınlamış olduk Umarım siz de Hall edebilmiş siin ZD içerik yayınlarsanız linkleri mutlaka benimle de paylaşın merak ediyorum Açıkçası başka bir formatla devam edelim angler Framework de bir proje oluşturalım angular tıklıyorum açılan pop uptan projeme angular Erhan diyorum karışmasın diğerleriyle create butonuna basıyorum ve oluşturmaya başladı açıldı gördüğünüz gibi tüm parçaları kendi yükledi web görünümü de açıldı buradan dilediğim gibi çalışabilirim Tabii ki sıdan da bir dosya açabilirim buradaki link işaretine tıklayarak sayfayı paylaşabilirim QR kod ile hızlıca telefonumdan açabilirim url'sini kopyalayabilirim manage Access linkinden mail adreslerini girerek başka çalışma arkadaşlarımla projeyi paylaşabilirim Böylece direkt onlar da proje üzerinde çalışmaya başlayabilirler Gemini API kullanarak direkt projelerde açabilirim templateler içerisinden Gemini apıa tıklıyorum açıldı Buna da Ceminay Erhan diyorum Web App olarak düşündüğüm için JavaScript olarak bırakıyorum create butonuna tıklıyorum açılmaya başladı 5 tane ücretsiz proje açabilirim yeni eklemek istersem bir tanesini silmeliyim dediğim gibi Project ıdx Şimdilik ücretsiz ama ileride ne olur bilemiyorum açıldı projem görseller hakkında sorgu yapabilen cemini bazlı Bir web sayfası olmuş oldu cemini API anahtarını girerek çalıştırabilirsiniz diyor görseldeki yiyeceklerin tarifini soracağız tam yerine geldi bu arada güzel bir şey şimdi ap anahtarını gir demiş Ama ben bunu Nereye gireceğim main JavaScript dosyasına demiş Ama neresine hemen sağ alt köşeden cemine ii açıyorum prompt umu giriyorum main JavaScript dosyasında API anahtarımı Nereye gireceğim dedim gönderdim Hemen cevap verdi 9 satırdaki to do yerine girmeniz gerekiyor dedi harika gerçek bir öğrenme yardımcısı yanlış 10 satırda tudu 9 dedi bana Ama olur o kadar Tamamdır gireceğim önce ap anlarımı alıp Command tuşuna basılı tutarak Get Api key linkine tıklıyorum beni aı studioya yönlendirdi Get API key butonuna tıklıyorum New Project diyorum ve Api anahtarım oluşturulmaya başladı oluşturdu kopyaladım ıdx geliyorum to yazan yere Api anahtarımı giriyorum Bu arada yorumlarda çok söyleniyor oluşturduğunuz herhangi bir ap anahtarını böyle göstermek doğru değil ben çekimlerden hemen sonra sildiğim için çok önemsemiyorum ama siz projeleri yaparken yayına alırken veya kullanırken mutlaka Api anahtarını gizlemeli nasıl gizleyebilirsiniz anahtarı girince üstteki mesaj gitti demek ki Ak if oldu sorumu Türkçe olarak giriyorum görseldeki ürünün tarifini istedim ikinci görseli yani ekmeği seçiyorum gönderdim cevap geldi ekmek için gerekli malzemeleri verdi nasıl yapacağını da anlattı Google bu arada kendi oluşturacağı github projin içerisine Open in ıdx isminde bir buton ekleyecek Böylece tek tıklamayla ıdx içerisinde açabileceği diğer gitab kullanıcıları da ekler Böylece İşlerimiz daha da hızlanır ve kolaylaşır burada Google'ın oluşturduğu bir kitap projesi var bunun da linkini bırakacağım hemen gelip bahsettiğim openin ıdx butonuna tıklıyorum ve beni ıdx yönlendiriyor flat rap Yani bir mobil projesi ise checkbox işaretleyebilir değil sadece import butonuna basıyorum içerisine çekmeye başladı direkt olarak da github dosyalarını import edebilirim bunu da tekrar hatırlatmak isterim Bu arada proje Açıldı bu ne Ben ne indirdim Hiçbir fikrim yok yine bu aşamada Cemil'den destek alacağım açtım Ceminay prompt umu girdim şu an açık olan Proje nedir açıklayabilir misin ben bu projeyle ne yapabilirim dedim ve gönderdim cevap geldi bir Go projesiyim miş güzel bunu bilmiyordum cemine bölüm bölüm Roman yazdıran bir projeyi güzel severiz Peki nasıl kullanacağım Go hakkında hiçbir bilgim yok Onu da anlatmış çok güzel yerel makineme klonlamada gerek yok Şurada yazıyor Nereye nasıl gireceğiz onu soralım gönderd güzel önce API anahtarını gireceğim Sonra Go Run Hadi bakalım sol üst köşeden menüyü açıyorum terminal başlığından New terminal diyorum ve terminal açılıyor örnek olarak verdiği export Api key satırını yapıştırıyorum örnek API anahtarını siliyorum ve anahtarımı yapıştırıyorum enter'a bastım onayladı çalıştırmak için bir satır kod gireceğim gorun main goo örneğini vermiş ama ben klasörde main goo değil Adventure goo olduğunu görüyorum Bu sebeple Gun Adventure goo yazıp enter'a basıyorum çalışmaya başladı tamamladı ilk cümlesini yazdı What do you want to Dream about Ne hakkında Hayal kurmak istiyorsun dedi Roman yazacak Ya başlangıç cümlesi istedi ı İmagine I Camera bir kamera olduğumu hayal ediyorum dedim yazmaya başladı kendi romanını yazdırabilirsiniz son olarak mobil bir uygulama örneği de göstereyim mobil uygulama frameworkler inden flutter desteği de mevcut yani düşünün ki Project ıdx üzerinden mobil uygulamanızı hem web için hem Android için hem de iOS için aynı anda geliştirebileceğiniz ve bunu sadece tarayıcı üzerinden yapabilmek gerçekten önemli bir özellik Bence Google sunumlarında ios'u da göstermişti ama ben açınca göremedim sevmiyorum yani böyle şeyleri bir şeyi yapacaksan göster göstermeyeceksin yapma yani bana çok anlamsız geliyor ıdx deyim se All templates linkine tıklıyorum açılan sayfada mobil'e geliyorum flatter görüyorum üzerine tıkladım projeye flatter Erhan ismini verdim create butonuna tıkladım biraz vakit aldı ama sonunda açıldı web versiyonu böyle gördüğünüz gibi butona tıklıyorum her tıklama sayısını gösteriyor Buradan da Android'i görebiliyorum öyle emülatör falan kurmanıza gerek yok Hepsi ıdx ile web tarisi üzerinden kullanılabiliyor dediğim gibi iOS henüz gelmedi ama gelirse gerçekten çok iyi olur diye düşünüyorum Örneğin main dart dosyasından title' değiştiriyorum gördüğünüz gibi hem web'de hem Android'de güncellendi yine uygulamanızı tamamlayıp firebase üzerinden dağıtabilirsiniz nasıl Google'ın yeni projesi Project ıx için ne düşünüyorsunuz merak ediyorum düşüncelerinizi yorum olarak yazın lütfen önü açık mı yoksa Google'ın daha önce açtığı ve sonrasında kapattığı 256 projeden Hatta bu da kapanırsa 257 projeden biri mi olacak göreceğiz kişisel fikrim Ben umutluyum önü açık gibi geliyor Ama dediğim gibi göreceğiz bu haftalık Bu kadar sosyal medya hesaplarımı buraya bırakıyorum buralardan beni takip edebilir sorular sorabilirsiniz bir sonraki videoda görüşmek üzere hoşça [Müzik] kalın an