ElectronJS
ElectronJS ile Pug Kullanımı
Merhabalar, Node.JS derslerimize kaldığımız yerden devam ediyoruz. Bu dersimizde ElectronJS ile Pug templatelerini okumayı anlatacağım.
Daha önceki dersimizde ElectronJS kurulumunu anlatmıştım. Şimdi de Node.JS ile web siteleri yapan kişilerin bildiği Pug ile template hazırlama ve ElectronJS ile bu dosyaları okumayı anlatacağım.
Öncelikle bir tane ElectronJS projesi oluşturalım. ElectronJS projesi oluşturmayı bilmiyorsanız buraya tıklayabilirsiniz.
Proje oluşturduktan sonra Pug kütüphanesini indirip projemize dahil etmemiz gerekiyor. ElectronJS’de Pug kütüphanesini doğrudan kullanamıyoruz, bunun yerine electron-pug isimli kütüphaneyi kullanacağız. electron-pug kütüphanesini projemize dahil etmek için terminali (Windows için CMD) açıp
Kurulumun ardından artık electron-pug kullanacağımız sayfamıza gelerek sayfamıza dahil edelim. Bunuda standart Node.JS eklemeleriyle yapacağız. Yani
Ardından electron-pug kütüphanesini ayarlamamız gerekiyor, yani sayfada çağırsak dahi doğrudan kullanamıyoruz. Ufak bir satır kod ile ayarlamayı yapalım.
Ben örnek olsun diye ufak bir Pug template yazacağım fakat siz istediğiniz gibi şeyler yapabilirsiniz.
ElectronJS’i sayfamızda çağıralım, Pug ayarlamasını yapalım ve son olarakta az önce oluşturduğumuz main.pug dosyasını projemiz çalıştığında açılacak ilk sayfa olarak belirleyelim.
Bu dersimizde bu kadardı, tüm ElectronJS derslerimize buraya tıklayarak ulaşabilirsiniz. Herkese hayırlı günler.
Daha önceki dersimizde ElectronJS kurulumunu anlatmıştım. Şimdi de Node.JS ile web siteleri yapan kişilerin bildiği Pug ile template hazırlama ve ElectronJS ile bu dosyaları okumayı anlatacağım.
Öncelikle bir tane ElectronJS projesi oluşturalım. ElectronJS projesi oluşturmayı bilmiyorsanız buraya tıklayabilirsiniz.
Proje oluşturduktan sonra Pug kütüphanesini indirip projemize dahil etmemiz gerekiyor. ElectronJS’de Pug kütüphanesini doğrudan kullanamıyoruz, bunun yerine electron-pug isimli kütüphaneyi kullanacağız. electron-pug kütüphanesini projemize dahil etmek için terminali (Windows için CMD) açıp
npm i electron-pugkomutunu girelim ve npm’in electron-pug kütüphanesini indirip projemize dahil etmesini bekleyelim.
Kurulumun ardından artık electron-pug kullanacağımız sayfamıza gelerek sayfamıza dahil edelim. Bunuda standart Node.JS eklemeleriyle yapacağız. Yani
const pug = require('electron-pug');kod satırını sayfamızın en başına yazalım.
Ardından electron-pug kütüphanesini ayarlamamız gerekiyor, yani sayfada çağırsak dahi doğrudan kullanamıyoruz. Ufak bir satır kod ile ayarlamayı yapalım.
pug({pretty: tru});Evet artık Pug templateleri hazırlayıp rahatlıkla kullanabiliriz.
Ben örnek olsun diye ufak bir Pug template yazacağım fakat siz istediğiniz gibi şeyler yapabilirsiniz.
html head title Anasayfa meta(charset="utf8") body h1 Burası AnasayfaBu Pug kodunu örneğin main.pug sayfası içine kaydedelim ve artık electron tarafına geçiş yapalım.
ElectronJS’i sayfamızda çağıralım, Pug ayarlamasını yapalım ve son olarakta az önce oluşturduğumuz main.pug dosyasını projemiz çalıştığında açılacak ilk sayfa olarak belirleyelim.
const {app, BrowserWindow} = require('electron'); const pug = require('electron-pug'); app.on('ready', () => { pug({pretty: true}); let window = new BrowserWindow(); window.loadURL(`file://${__dirname}/main.pug`);Eveett, sonrasında projemizi çalıştırdığımızda ElectronJS içerisinde Pug’ın çok güzel çalıştığını görebilirsiniz 🙂
Bu dersimizde bu kadardı, tüm ElectronJS derslerimize buraya tıklayarak ulaşabilirsiniz. Herkese hayırlı günler.
Skorumuz:
Oy Vermek İçin Tıklayın
[Toplam: 0 Ortalama: 0]