Görseller, bir web sayfasının yüklenmesi için gereken baytların ortalama %60'ından fazlasını oluşturur. AVIF ile görsellerinizi küçültebilir ve web sitenizin daha hızlı yüklenmesini sağlayabilirsiniz. AVIF, AV1 video bit akışından türetilen bir resim

Bu Codelab'i tamamlamak için birkaç ön koşulu karşılamanız gerekir. Her şart, "Yerel Test" veya "Toplama Hizmeti" için gerekli olup olmadığına göre işaretlenir. Yerel test için Yerel Test Aracı'nın indirilmesi gerekir. Araç, şifrelenmemiş hata

Tahmini tamamlama süresi: 1-2 saat Bu kod laboratuvarını gerçekleştirmenin 2 modu vardır: Yerel Test veya Toplama Hizmeti. Yerel test modu için yerel bir makine ve Chrome tarayıcı gerekir (Google Cloud kaynağı oluşturma/kullanımı yoktur). Aggregation

Bu codelab'de, Dart arka uç hizmeti kullanılarak doğrulanan ve yönetilen bir Flutter uygulamasına uygulama içi satın alma işlemi ekleyeceksiniz.

Bu codelab'de, Cloud Firestore kullanan bir web uygulaması geliştirmeyi öğreneceksiniz.

Bu codelab'de bir sohbet uygulaması oluşturarak Firebase platformunu web'de nasıl kullanacağınızı öğreneceksiniz.

Bu codelab'de, Flutter'da animasyonları nasıl kullanacağınızı öğreneceksiniz. Hem boyutu hem de rengi animasyonlu hale getiren, 3D kart çevirme efekti ekleyen, animasyon paketindeki efektleri kullanan ve Android'in tahmini geri hareket desteğini ekleyen bir widget oluşturacaksınız.

Bu codelab'de rastgele, hoş adlar üreten Flutter uygulamasını nasıl oluşturacağınızı öğreneceksiniz.

Bu kod laboratuvarı, kullanıcıya otomatik ölçeklendirme oluşturucu aracıları da dahil olmak üzere GKE'de Jenkins örneği dağıtacak adımlarda rehberlik eder.

Bu codelab'de, yalnızca birkaç satır kodla Flutter uygulamasına Firebase Authentication'ı nasıl ekleyeceğinizi öğreneceksiniz.

Teklifli Sistem ve Açık Artırma Hizmetleri (T&A), Protected Audience açık artırmasını kolaylaştırmak için alıcılar ve satıcılara sunulan 4 hizmetten oluşur: Alıcı grubu: Satıcı grubu: Bu kod laboratuvarı, uçtan uca kurulumu yerel ortamınızda

Bu codelab'de canlı müşteri temsilcileri ile bot temsilcileri arasındaki karşılıklı görüşmelerin nasıl yönetileceğini öğreneceksiniz. Son olarak, temsilcinizle devam eden tüm görüşmeleri görebileceğiniz ve herhangi bir görüşmeyi canlı aracı olarak değerlendirebileceğiniz temel bir web arayüzüne sahip olacaksınız.

Bu codelab'de, Places API'ye istek göndermeden önce bir web uygulamasını Firebase Uygulama Kontrolü ve reCAPTCHA ile nasıl doğrulayacağınızı öğreneceksiniz.

Bu codelab, Web için Google Pay API 101: Temel Bilgiler codelab'inin devamı niteliğindedir ve bu codelab'de yazılan koda dayanır. Bu codelab'i tamamlamak için önce bu codelab'i tamamladığınızdan emin olun. Bu, ButtonOptions 'a kısa bir genel

Bu codelab'de, gecko@003 modelinin ne olduğunu ve bu modelin gerçek bir kullanım alanını öğreneceksiniz.

Bu codelab'de, ML modeli dağıtmak için Firebase altyapısını nasıl kullanacağınızı öğreneceksiniz. Bu sayede model, TensorFlow.js aracılığıyla web sitenizde kullanılabilecek ve tüketici kullanılabilecektir.

Bu codelab'de, değişken yazı tipleri, avantajları, bu özelliklerle tasarım yapma ve Google Fonts API'yi ve CSS'yi kullanarak değişkenleri uygulamayı öğreneceksiniz.

Bu codelab'de, bir web uygulamasında Firebase Performance Monitoring'i kuracak ve uygulamanızın son kullanıcılar için iyi çalışmasını sağlamak amacıyla bu API'yi nasıl kullanacağınızı öğreneceksiniz.

Firebase ile Flutter mobil uygulaması geliştirmeyi öğrenin.

Firebase ve StackBlitz online düzenleyiciyle sıfırdan bir web uygulaması oluşturun. Firebase ile iletişim kurmak için temel HTML ve JavaScript kullanacaksınız. Bu, Firebase konsolunu kullanmaya ve Firebase'i bir uygulamaya entegre etmeye harika bir giriştir. Kapsamlı bilgi birikimi veya yazılım yüklemeleri gerekmez.

Bu codelab'de, bir sohbet uygulamasının kullanıcılarına bildirim göndermek için Cloud Functions for Firebase'i nasıl kullanacağınızı öğreneceksiniz.

Procurement DocAI'ı kullanarak faturaların akıllı bir şekilde ayrıştırılmasını öğreneceksiniz.

Çok öğeli kimlik doğrulamasını uygulamayı ve engelleme işlevleriyle özel kimlik doğrulama gereksinimleri oluşturmayı öğrenin

Bu codelab'de, mevcut bir Firebase web uygulamasını yeni modüler Firebase JS SDK'ya, kullanmadığınız ağaç sallama koduna taşıyacak ve uygulamanın hızlı bir şekilde yüklenmesini sağlayacaksınız.

Bu codelab'in tamamlanmasıyla, çalışan bir Google Pay entegrasyonuna sahip minimum düzeyde uygulanabilir bir web siteniz olacak. Bu proje, işleme alınması için bir ödeme hizmeti sağlayıcıya gönderilebilecek bir ödeme jetonu alır. Google Pay ödeme

Flutter ile oyunlara nasıl ses efekti, arka plan müziği ve dinamik ses ekleyeceğinizi öğrenin.

Flutter ile geliştirme sırasında Firebase Emulator Suite'in nasıl kullanılacağını özetleyen Codelab. Codelab, emülatör kullanımını göstermek için Auth ve Firestore emülatörlerini kullanır.

Yeni başlayanlara uygun bu codelab'de, Angular v14 Bağımsız Bileşenleri kullanarak örnek uygulama derlemeyi öğreneceksiniz.

Artırılmış gerçeklik özelliklerini WebXR Device API ile kullanmayı ve sahne anlama özelliğini kullanarak gerçek dünyaya uygun bir 3D nesne yerleştirmeyi öğrenin.

Angular'ın yeni tepki modeli olan "sinyaller" ile tanışın. Sinyaller, ayrıntılı reaktiflik için daha yüksek kaliteli araçlara sahip olmanızı sağlar.

Bu çerçevede yerleşik olarak bulunan araç setiyle Angular uygulamalarınızda erişilebilirlikle ilgili en iyi uygulamaları nasıl takip edeceğinizi öğrenin.

Önceden oluşturulmuş Materyal Bileşenlerini herhangi bir web çerçevesi için bileşenlere nasıl genişleteceğinizi öğrenin.

Bu codelab'de React kavramlarını Lit'e nasıl çevireceğinizi öğreneceksiniz.

Güvenlik Kuralları ile Firestore verilerinizi nasıl koruyacağınızı öğrenin

Ayrı Materyal Bileşenlerini, baştan başlamak zorunda kalmadan mevcut bir web kodu tabanına nasıl ekleyeceğinizi öğrenin.

Animasyon paketindeki geçişleri kullanarak Yanıtla uygulamasına Material'ın hareket sistemini oluşturun.

Flutter uygulamanızın tasarımını iyileştirin ve Flutter'da gelişmiş bir arka plan menüsü bileşeni ekleyin.

Flutter uygulaması oluşturmak ve düzenlemek için Material'ı nasıl kullanacağınızı öğrenin.

Web'de yapı ve düzen için Materyal'i nasıl kullanacağınızı öğrenin.

Bu laboratuvarda, Keras sınıflandırıcısının nasıl oluşturulacağını öğreneceksiniz. Çiçekleri tanımak için nöral ağ katmanlarının mükemmel kombinasyonunu bulmaya çalışmak yerine, önceden eğitilmiş güçlü bir modeli veri kümemize uyarlamak için önce aktarım öğrenme adlı bir teknik kullanacağız. Bu laboratuvar, nöral ağlarla ilgili gerekli teorik açıklamaları içerir ve derin öğrenme hakkında bilgi edinen geliştiriciler için iyi bir başlangıç noktasıdır.

Firebase Emulator Suite ile nasıl web uygulaması geliştireceğinizi öğrenin.

Bu codelab'de, 5x5 LED ekranında BBC micro:bit panosuyla etkileşim kuran bir web sayfası oluşturacaksınız. Web Serial API hakkında bilgi edinecek ve seri cihazlarla tarayıcı üzerinden iletişim kurmak için okunabilir, yazılabilir ve dönüştürülebilir akışları nasıl kullanacağınızı öğreneceksiniz.

Bu Codelab, kullanıcıya bir komut satırı arayüzü üzerinden DLP API'yi tanıtır. Kullanıcı proje kodunu indirecek ve örnek dizinindeki bazı araçları ve bunların temel işlevlerini inceleyecektir.

Bu codelab'de, yeni olan veya yalnızca bir işaretin ardında bulunan çeşitli web API'leriyle denemeler yapacaksınız.

Bu codelab'de bir web uygulaması oluşturacak, erişimi yalnızca belirli kullanıcı gruplarıyla sınırlandıracak ve kimliği doğrulanmış kullanıcının programdaki kimliğini kullanacaksınız.

Medya ve veri akışını iki tarayıcı arasında nasıl yapacağınızı öğrenin. WebRTC'nin temel API'lerini ve teknolojilerini öğrenin. getUserMedia, CSS ve tuval öğesini kullanarak resimleri yakalayın ve değiştirin. Eşler bağlantısı kurun ve veri kanallarını kullanarak doğrudan tarayıcılar arasında veri alışverişi yapın. Son olarak, Node.js kullanarak bir sinyal sunucusu oluşturun.

Bu codelab'de, 5x5 LED ekranında BBC micro:bit panosuyla etkileşim kuran bir web sayfası oluşturacaksınız. Web Serial API hakkında bilgi edinecek ve seri cihazlarla tarayıcı üzerinden iletişim kurmak için okunabilir, yazılabilir ve dönüştürülebilir akışları nasıl kullanacağınızı öğreneceksiniz.

Google Chrome'daki en yeni API'leri kullanarak web uygulamasına anında gezinme ve sorunsuz sayfa geçişleri eklemeyi öğrenin.

Her kullanıcının belirli bir zamandaki tercihlerini yansıtan özelleştirilmiş bir arayüze sahip olduğu uyarlanabilir web formunu nasıl oluşturacağınızı öğrenin.

Bu codelab'de, flutter uygulamasına AdMob satır içi reklamları (Banner ve Yerel) nasıl ekleyeceğinizi öğreneceksiniz.

Bu codelab'de Accelerated Mobile Pages'ın temel kavramları ve geleneksel HTML dokümanlarından farkları açıklanmaktadır. Bunu, AMP dokümanlarını oluşturup doğrulayarak elde edeceğiz.

Bu codelab'de Accelerated Mobile Pages'ın temel kavramları ve geleneksel HTML dokümanlarından farkları açıklanmaktadır. Bunu, AMP dokümanlarını oluşturup doğrulayarak elde edeceğiz.

Bu codelab'de, (WEB) Measurement Protocol kullanarak harici etkinlikleri GA4'e nasıl göndereceğinizi öğreneceksiniz.

Bu codelab'de, Flutter uygulamasına banner, geçiş reklamı ve ödüllü reklam eklemeyi öğreneceksiniz.

Bu codelab'de iOS veya Android Flutter uygulamanız için bir Ana Ekran widget'ı oluşturacaksınız. Temel bir Flutter haber uygulamasıyla başlarsınız. Ardından widget'ların kullanıcı arayüzünü oluşturmak için yerel çerçeveleri kullanacaksınız. Son olarak, kaynakları nasıl paylaşacağınızı ve widget'larınız ile ana uygulamanız arasında nasıl iletişim kuracağınızı öğreneceksiniz.

Bu codelab'de, Google Compute Engine'de (GCE) Dataproc'u kullanmayı öğreneceksiniz.

Bu codelab'de, Spark ML işlerini Google'ın Dataproc hizmetine göndereceksiniz.

Bu codelab'de, kullanmaya nasıl başlayacağınız ve zengin özellik kümesine nasıl erişeceğiniz dahil olmak üzere Dataproc Serverless hakkında her şeyi öğreneceksiniz.

Flutter'da kullanıcı arayüzü tasarım stilinizi yeniden tasarlamak için Dart 3'ün kalıpları, kayıtları ve diğer yeni özelliklerini kullanın.

Dialogflow; web, Google Asistan, sosyal medya ve telefon ağ geçitleri için birçok entegrasyon içerir. Ancak, chatbot'larınızı mobil cihazlara taşımak istediğinizde özel bir entegrasyon oluşturmanız gerekir. Bu laboratuvarda, Dialogflow Essentials'ı bir Flutter uygulamasına nasıl entegre edeceğiniz açıklanmaktadır.

Bu codelab'de, & sıfırdan bir Web Bileşeni oluşturacak ve daha sonra bunu kademeli olarak Edebiyat Öğesi olacak şekilde iyileştirebileceksiniz.

Bu codelab'de, Google Cloud Composer'da Apache Airflow iş akışını (DAG) tetiklemek için Google Cloud Functions'ın nasıl kullanılacağı gösterilmektedir. Buradaki DAG, BashOperator aracını kullanarak basit bir bash komutu yürütür

Yeni ortaya çıkan Web Bluetooth API'si sayesinde, JavaScript dışında hiçbir şey yapmadan, LED alevsiz mumları kontrol eden bir web uygulaması geliştirin.

Bu codelab'de, Go'da uygulanmış olan Common Expression Language dilinde ifadeler yazacaksınız. Değişkenleri, mantıksal operatörleri ve/veya operatörleri kullanacak, json'ları derleyecek, protolar derleyecek ve ifadelerinizi ayarlayacaksınız.

Bu codelab'de, Dataflow'u kullanarak büyük miktarda veri yüklenirken ve okurken Bigtable yazma/okuma işlemlerini nasıl izleyeceğinizi öğreneceksiniz.

Bu codelab'de, önceden eğitilmiş modelin işleyemediği uç durumları hesaba katmak için yorum spam'ı modelini yeniden eğitmek üzere Model Oluşturucu'yu kullanmayı ve ardından yeni modeli web uygulamasına yeniden dağıtmayı öğreneceksiniz.

Bu codelab'de iOS, Android ve web'de yüksek kaliteli yerel deneyimler oluşturmak için Flutter mobil uygulama SDK'sını kullanarak bir Google Haritalar deneyimi geliştireceksiniz.

Bu codelab'de, TensorFlow.js önceden eğitilmiş modellerinden (COCO-SSD) birini yükleyip kullanmayı ve eğitildiği yaygın nesneleri tanımak için bu modeli nasıl kullanacağınızı öğreneceksiniz.

Flutter, Google'ın tek bir kod tabanından mobil, web ve masaüstü için yerel olarak derlenmiş, güzel uygulamalar geliştirmeye yönelik kullanıcı arayüzü araç setidir. Bu codelab'de sade bir müzik uygulamasıyla başlayacak ve (Material 3'ü kullanarak) tüm platformlar için daha güzel ve duyarlı hale getireceksiniz.

Bu codelab'de, Flutter'ın desteklediği Android, iOS, web, Windows, macOS ve Linux olmak üzere altı platforma da uyum sağlayan bir Flutter uygulaması oluşturacaksınız.

Bu codelab'de, Flutter'ın desteklediği altı platformun hepsinde Material 3 ile akıcı bir şekilde animasyon yapan uyarlanabilir tasarıma sahip bir uygulama derleme konusunda deneyim kazanacaksınız.

Bu codelab'de basit bir Flutter uygulaması derleyip test edeceksiniz.

Bu codelab'de, mevcut bir yerel C kitaplığından yararlanmak için FFI kullanarak hem mobil hem de masaüstü platformlara yönelik bir Flutter eklentisi oluşturacaksınız.

Bu codelab'de, webview_flutter eklentisini bir Flutter uygulamasına nasıl ekleyeceğinizi öğreneceksiniz.

2D fizik motoru olan Forge2D ile Flutter ve Flame oyunlarında oyun mekaniği oluşturmayı öğrenin.

Bu codelab'de, Flutter üzerine kurulmuş bir oyun motoru olan Flame'i nasıl kullanacağınızı öğreneceksiniz. Flame'in bileşenleri ve efektlerinin yanı sıra Flame'i Flutter'ın durum yönetimiyle nasıl entegre edeceğinizle ilgili bilgi edineceksiniz.

Flutter'ın altı platformunun tümünde çalışan animasyonlar, gölgelendiriciler ve parçacık efektleriyle Flutter kullanıcı arayüzlerini nasıl oluşturacağınızı öğrenin.

Yoğun bilgi işlem gerektiren Flutter uygulamasını nasıl geliştireceğinizi ve aynı zamanda Flutter'ın akıcı etkileşim düzeyini nasıl sürdüreceğinizi öğrenin.

Temel bileşenlere sahip basit bir uygulama oluşturarak web için Malzeme Bileşenleri'ni kullanma ile ilgili temel bilgileri öğrenin.

Material Flutter kitaplığının, ürününüzü farklılaştırmayı ve markanızı tasarım aracılığıyla ifade etmeyi nasıl kolaylaştırdığını keşfedin.

Basit bir Flutter uygulaması için giriş sayfası oluşturarak Malzeme Bileşenleri'ni kullanmayla ilgili temel bilgileri öğrenin.

Web için Materyal Bileşenlerin ürününüzü farklılaştırmayı ve tasarım yoluyla markanızı ifade etmeyi nasıl kolaylaştırdığını keşfedin.

Bu codelab'de, SavedModel biçimindeki mevcut Python ML modelini alıp TensorFlow.js biçimine dönüştürerek web tarayıcısında çalıştırılabilmesini ve dönüşümlerde oluşabilecek yaygın sorunların nasıl giderileceğini öğreneceksiniz.

Bu codelab'de, web uygulamanıza push bildirimlerini nasıl ekleyeceğinizi öğreneceksiniz.

This codelab is intended to help you understand how to create your first 3D Map using Photorealistic 3D Maps in Maps JavaScript. You will learn the basics about loading the right components of the Maps Javascript API, displaying your first 3D Map and

This tutorial explores how to add and style 3D markers in your application. You'll also learn how to animate your application by flying to and around specific locations. This tutorial builds on the concepts covered in the first codelab. If you

In this codelab, you learn everything that you need to get started with the vis.gl/react-google-map library for the Google Maps JavaScript API, which lets you add a Google map to a React app. You learn how to get set up, load the Maps JavaScript API,

In this codelab we’ll build together a real-time web application with Firebase and Angular.

Progressive Web Applications (PWAs) are a type of application software delivered through the web, built using common web technologies including HTML, CSS, and JavaScript. They are intended to work on any platform that uses a standards-compliant

Maps can be a very powerful tool when visualizing the patterns in a dataset that are related to location in some way. This relation could be the name of a place, a specific latitude and longitude value, or the name of an area that has a specific

Imagine you have many places to put on a map and you want users to be able to see where these places are and identify which place they want to visit. Common examples of this include: In this codelab, you will create a locator that draws from a live

Learn how to create a simple website that classifies images with TensorFlow Serving.

Learn how to build Perspective API.

Learn to build a location-based web app using the Maps JavaScript API and PLaces Library to perform a Nearby Search.

Learn how to train a comment-spam detection model with TensorFlow Lite Model Maker.

Learn how to retrain the spam-detection model to detect specific types of spam with TensorFlow Lite Model Maker.

In this codelab, you’ll build an image-slider,, which works independently of Angular framework, can be imported in any framework, and is very easy to integrate.

In this lab, you'll take an existing web application and make it work offline. This is the first in a series of companion codelabs for the Progressive Web App workshop. There are seven more codelabs in this series. Start by either cloning or

Whether you are embarking on a road trip, planning your daily commute, or navigating a bustling city, getting from point A to point B is more than just knowing where you want to go. A reliable route generation tool is essential. With Google Maps

In this codelab, you learn everything you need to get started using Google Maps Platform for the web. You learn all the basics, from getting set up to loading the Maps JavaScript API, displaying your first map, working with markers and marker

Learn how to build an app to get video and take snapshots with your webcam, and share them peer-to-peer with WebRTC.

In this codelab, you’ll add second-factor authentication to your site or web app with a security key.

In this lab, you'll take website with an existing service worker and convert it to using Workbox. This is the second in a series of companion codelabs for the Progressive Web App workshop. The previous codelab was Going Offline. There are six more

In this lab, you'll take an existing Progressive Web App that you have deployed and wrap it in an app for distribution in Google's Play store. Bubblewrap is a tool to make wrapping your Progressive Web App into an Android App Bundle as easy as

Learn how to build a Flutter app that classifies texts and displays the results in its UI.

In this codelab, you’ll learn how to build a simple web page that has commenting ability akin to a blog post article and integrate it with a pre trained machine learning model to detect comment spam posts, enabling you to filter these out before they even get stored in any backend database, reducing server processing time and cost.

This codelab teaches you how to use the WebGL-powered features of the Maps JavaScript API to control and render on the vector map in three dimensions. This codelab assumes you have intermediate knowledge of JavaScript and the Maps JavaScript API. To

One of the most common features of a website is displaying a Google map that highlights one or more locations for a business, establishment, or some other entity with a physical presence. How these maps are implemented can vary greatly depending on

This codelab teaches you how to create a high-volume geospatial data visualization using the Maps JavaScript API and deck.gl, an open-source, WebGL-accelerated, data-visualization framework. If you haven't used Google Maps Platform before, follow

Learn how to build a website with a simple reauthentication functionality that uses a fingerprint sensor.

In this codelab you’ll learn how to use Model Maker to retrain a comment spam model to account for edge cases the pre-trained model could not handle, and then re-deploy the new model to the web application.

Learn how to secure your online information, identify phishing attacks, enable Advanced Protections for Google Accounts, and stay safe on social media.

In this codelab, you’ll build a GitHub client in Flutter for desktop.

Learn how to create a theme and brand that’s accessible and personalized with Material 3.

Learn how to use adaptive design principles in Material Design to achieve consistency across screen sizes. In this codelab, you take a mobile design to tablet format, and learn about the responsive grid, adaptive composition patterns, and the correct components.