Bu eğitim, ilk Chrome Uygulamanızı oluşturmanız konusunda size yol gösterir. Chrome Uygulamaları uzantılara benzer bir şekilde yapılandırılmıştır. Böylece mevcut geliştiriciler, manifest ve sunum yöntemlerini tanırlar. İşiniz bittiğinde, uygulamanızı publish için yalnızca kodunuzun ve öğelerinizin bir zip dosyasını oluşturmanız gerekir.
Bir Chrome Uygulaması şu bileşenleri içerir:
- Manifest, Chrome'a uygulamanız, uygulamanızın ne olduğu, nasıl başlatılacağı ve gerektirdiği ek izinler hakkında bilgi verir.
- Arka plan komut dosyası, uygulama yaşam döngüsünü yönetmekten sorumlu etkinlik sayfasını oluşturmak için kullanılır.
- Tüm kod Chrome uygulaması paketine eklenmelidir. Bunlara HTML, JS, CSS ve Native Client modülleri dahildir.
- Tüm simgeler ve diğer öğeler de pakete dahil edilmelidir.
1. Adım: Manifest dosyasını oluşturun
Önce manifest.json
dosyanızı oluşturun (Formats: Manifest Files bu manifesti ayrıntılı olarak açıklar):
{
"name": "Hello World!",
"description": "My first Chrome App.",
"version": "0.1",
"manifest_version": 2,
"app": {
"background": {
"scripts": ["background.js"]
}
},
"icons": { "16": "calculator-16.png", "128": "calculator-128.png" }
}
2. Adım: Arka plan komut dosyasını oluşturun
Ardından, background.js
adında aşağıdaki içeriğe sahip yeni bir dosya oluşturun:
chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create('window.html', {
'outerBounds': {
'width': 400,
'height': 500
}
});
});
Yukarıdaki örnek kodda, kullanıcı uygulamayı başlattığında onLaunched etkinliği tetiklenir. Ardından hemen, uygulama için belirtilen genişlik ve yükseklikte bir pencere açılır. Arka plan komut dosyanız ek dinleyiciler, pencereler, yayın mesajları ve başlatma verileri içerebilir. Bunların tümü, uygulamayı yönetmek için etkinlik sayfası tarafından kullanılır.
3. Adım: Bir pencere sayfası oluşturun
window.html
dosyanızı oluşturun:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div>Hello, world!</div>
</body>
</html>
4. Adım: Simgeleri oluşturun
Bu simgeleri uygulama klasörünüze kopyalayın:
5. Adım: Uygulamanızı kullanıma sunun
İşaretleri etkinleştir
Chrome Uygulamaları API'lerinin birçoğu hâlâ deneysel aşamada olduğundan deneysel API'ları deneyebilmek için etkinleştirmeniz gerekir:
- chrome://flags sayfasına gidin.
- "Deneysel Uzantı API'ları"nı bulun ve "Etkinleştir" bağlantısını tıklayın.
- Chrome'u yeniden başlatın.
Uygulamanızı yükleyin
Uygulamanızı yüklemek için Chrome ayarları simgesini tıklayıp Araçlar > Uzantılar'ı seçerek uygulama ve uzantı yönetimi sayfasını açın.
Geliştirici modu onay kutusunun işaretli olduğundan emin olun.
Paketlenmemiş uzantı yükle düğmesini tıklayın, uygulamanızın klasörüne gidin ve Tamam'ı tıklayın.
Yeni sekme aç ve başlat
Uygulamanızı yükledikten sonra Yeni Sekme sayfası açın ve yeni uygulama simgenizi tıklayın.
Veya komut satırından yükleyin ve başlatın
Chrome'a aşağıdaki komut satırı seçenekleri, yinelemenizi yapmanıza yardımcı olabilir:
--load-and-launch-app=/path/to/app/
, paketlenmemiş uygulamayı verilen yoldan yükler ve başlatır. Uygulama zaten çalışıyorsa güncellenmiş içerikle yeniden yüklenir.--app-id=ajjhbohkjpincjgiieeomimlgnll
, Chrome'da yüklü olan bir uygulamayı başlatır. Önceden çalışan uygulamaları yeniden başlatmaz, ancak yeni uygulamayı güncellenmiş içerikle başlatır.