Bloğuma enson kişisel birşeyi düğünümden sonra yazmışım (gerçi artık pek kod vs’de paylaşamıyorum) bunun sebebi tahmini işler / güçler (arayüz). Şirket okul vs yorucu geçiyor. Bir şekilde bloğuma girdim ve dolaşmaya başladım, “yeni bir gün” kategorisinde konudan konuya atladım biraz duygulandım.
Mutlu olun yaşadığınız her anın keyfini çıkartın…
İnsanoğlunun hiç bir anı bir anı ile uymuyor, şuan o güzel free günlerimi özlüyorum (Free derken evlilikten felan sıkılmadım, tüzel kişilik .p )
İşin aslı özledim, artık iş düşünmekten, çalışmayı düşünmekten ne bileyim hayat evlenince farklı bir boyut aldı. Eğleniyor musun Aycan ? derseniz evet eğleniyorum yani mesela dün akşam yemeğini evde yemek yerine balık yemeye dışarı gittik .p
İşin şakası bir yana evlenince herşey çok farklı ve inanın çok güzel oluyor (eşinize aşıksanız). Ama evliliğin bir kötü yanı var aslında kötü demeyeyim de şöyle söyleyeyim “Ruhun hadi bunu yap, şunu yap riske gir bunu aç bunu kapat vs vs” diyor ama artık evlisin “hiç sorumluluk sevmeyen” benim artık ciddi sorumluluklarım var. Bu sorumluluklar insanı önce bunaltıyor ama sonradan pişiriyor ve sorumluluklarını yerine getirdikçe mutlu oluyorsun.
Eeeee başka derseniz, bloğum da gezerken (Bu arada bloğum 2008’den bu yana açık) zaman zaman çok karmaşık duygulara bürünmüşüm. Bazen atarlı, bazen duygusal, bazen araştırmacı, bazen sadece iş… Bunları şuan peşpeşe okuyunca insan diyorki neler neler yaşadık neler neler atlattık.
Ve şuan şunu kendime söyleye biliyorum “şuan ki yaşadığım sorunların hepsine 1-2 yıl sonra tekrar düşünce gülüp geçeceğim.” Bakın bu çok önemli, kısacası sorunları büyütüp kendinizi kanser etmeyin.
Eğer yaşadığınız sıkıntının içinden çıkamıyorsanız size 2 özlü sözüm var.
Baktın olmuyor, bakmayacaksın,
Müzik değişirse dans da değişir.
Tembelliği bırakın ve birşeyler yapın…
Geriye doğru bakınca şunu da fark ediyorum, zamanında elimizde çok güzel imkanlar ve zamanlar varmış ve bunu değerlendirememişiz. Buna üzülüyorum, keşke tembelliği birazcık ileri itip daha çok çalışsaymışım.
Burdan yola çıkarak şunu söylemek istiyorum üniversite okuyan arkadaşlar,
Eğlenmek mi istiyorsunuz, dibine kadar eğlenin bu sizin hakkınız.(Hayatınız üniversite okuduğunuz zaman kadardır, gerisi çalışmakla veya sorumluluklarla geçiyor)
Üniversite bittikten sonra iş aramaya başlarsanız hüsranla karşılaşırsınız. Şuana kadar gördüğüm çoğu öğrenci hayatını berbat bir şekilde geçiriyor (tos tos, saman saman, ot geldik ot gidiyoruz der gibi evde oturarak ve hiçbir şey yapmayarak). Eğer siz üniversite 1. sınıfda alanınızı belirlememişseniz hata yaparsınız.
Örnek veriyorum biyoloji okuyabilirsin ama 1. sınıfda yazılımcı olacağım diyorsan başlamalısın işlere, ve iş almalısın her iş seni geliştirecektir. Sonra ufkunu genişletmek için firmalara iş başvurusunda bulunmalısın. Firmalar sizi işe almasalar bile bedava çalışırım diyerek işi öğrenmek amaçlı işe girmelisiniz..
Hepimiz öleceğiz front-end developer’lar bile ölecek…
Velhasıl kelam hayat böyle arkadaşlar geçip gidiyor // Birgün hepimiz öleceğiz bu yüzden hırslarımıza kapılıp çevremizi kırıp dökmeyelim ve bu dünyadaki kısacak ömrümüzü güzel geçirelim ? Ne dersiniz ?
Neyse kendimi birşey sanarak çok nasihat verdim.
Kalın sağlıcakla dostlar, size güzel bir müzik ile veda ediyorum.
Birkaç yıl olmuştur bu kodu yazalı ama arada gidip alıp kullanıyorum, sizinle de paylaşmak istedim umarım işinize yarar. Buraya tıklayarak aşağıdaki kodun ne işe yaradığını anlayabilirsiniz // Sayfada büyük resim olduğu için yüklenmesi uzun sürebilir.
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
$('img').load(function()
{
varparentH=$(this).parent().outerHeight();
varparentW=$(this).parent().outerWidth();
variH=$(this).outerHeight();
variW=$(this).outerWidth();
varrate,newRate=0;
rate=parentW/iW;
newRate=rate*iH;
if(parentH>newRate)
rate=parentH/iH;
$(this).css({
width:rate*iW,
height:rate*iH,
position:'absolute',
top:-(((rate*iH)-parentH)/2),
left:-(((rate*iW)-parentW)/2)
});
}).each(function(){
if(this.complete)$(this).load();
});
Burada asıl önemli olan kısım resmin yüklenip yüklenmediğini kontrol etmek (jquery img load). Burada kullandığım resim yüklenme kodunu stackoverflow‘dan buldum ( Nick Craver )
JavaScript
1
2
3
4
5
6
7
8
$('img').load(function()
{
// Yuklenince yapilacak islemler
}).each(function(){
if(this.complete)$(this).load();
});
Resimlerin kesin yüklendiğini anladıktan sonra, resmin orjinal boyutlarını alıyorum, ondan sonra resmi kapsayan element’in boyutlarını alıp oran / orantı yapıp resme yeni boyutunu ve pozisyonunu veriyorum. Burada img’i kapsayan elementin width, height ve overflow:hiden değerinin olması gerekir.
Jade kolay html yazımını sağlayan ve tag sonlarını kapatmayı unutma ya da hata yapma payını en aza indirgeyen bir node.js eklentisidir. Aynı zamanda html yazım hızınızı da arttırmakta. Tek yapmanız gereken Tab yapısına göre yazıma dikkat etmeniz. Gerisini jade sizin için yapacaktır. Bir örnek üzerinde inceleyecek olursak;
Jade Nasıl Kurulur?
Jade’ yi kurup kullanmanız için 2-3 yöntem mevcuttur.
Birinci Yöntem (Tavsiyem 2. yöntem, bu yöntem biraz karışık);
nodejs ‘yi indirerek bilgisayarınıza kurmanız gerekmektedir. Node’ un basit kurulumunu yaptıktan sonra masa üstüne herhangi bir simge atmadığından program aramasından “Node.js command prompt” yazıp bularak çalıştırmanız gerekmektedir;
Daha sonra;
Açılan pencerede ‘C:/’ yapısına çıkmak için konsola .
DelphiWebScript/DWS
1
cd/
yazıyoruz.
Nodejs’mizin kurulu olduğu dosya yapısına girmek için ise
DelphiWebScript/DWS
1
cdnodejs
komutunu yazıyoruz. Artık nodejs nin kurulu olduğu dosyadayız ve Jade kurulumunu yapmamız için hiç bir sorun yok.
Konsolumuza
DelphiWebScript/DWS
1
npminstalljade-g
veya
DelphiWebScript/DWS
1
npminstalljade--global
yazarak kurulumu başlatıyoruz. Ortalama bilgisayarınızın hızına göre 10-60 saniye sürüyor.
Yükleme tamamlandıktan sonra ekrana jade ile ilgili sürüm bilgileri ve dosya bilgileri gelmektedir.
Ardından konsolumuz nodejs klasörünü gösteriyorken nmp start komutunu çalıştırıyor ve deneme.jade dosyamıza jade kodlarımızı bir editör yardımı ile oluşturuyoruz. örnek kodları yukarıda belirtmiştim. Oluşturduğumuz deneme.jade dosyamızı deneme.html şekline çevirmek için konsolumuzu
DelphiWebScript/DWS
1
jadedeneme.jade
yazmamız yeterli olacaktır. Html çıktısı deneme.jade dosyamızın yanına çıktı olarak kaydedilecek.
Şimdi jade dosyamızı oluştumak için bir txt dosyası açıp uzantısını .jade olarak değiştiriyoruz.
İkinci Yöntem;
Önerdiğim yöntem budur çünkü hiç bir konsolla uğraşmıyor, node.js’yi de kurmanıza gerek kalmıyor ve daha kullanışlı ve basit yapıda. Bu siteden Prepros adlı compiler programımızı indiriyoruz. Bu program .jade uzuntalı bütün dosyalarımızı html çıktısı olarak veriyor. Ayrıca sass, less gibi dosyalarınızı da compile edebilmektedir. Ücretsiz sürümü mevcuttur.
İndirip kurulumu yaptıktan sonra karşımıza çıkan ekranda
+ADD PROJECT butonundan daha önce masa üstümüzde oluşturduğumuz deneme klasörünü seçiyoruz. İçerisinde bulunan .jade uzantılı dosyaları otomatik olarak dönüştürebilmesi için açılan ekranda anaSayfa.jade dosyamızı seçip sağ alt köşedeki Process File butonuna tıklıyoruz ve bütün kurulum bu kadar. Artık kullandığınız txt editöründen projenizi her kaydettiğinizde otomatik olarak html dosyalarınızı değiştirecektir.
Jade Nasıl Kullanılır?
Örnek yazım şeklini en üstteki görselde paylaşmıştım fakat bazı güzelliklerinden bahsetmeye devam edelim;
Php de olduğu gibi header ve footer sayfalarını farklı jade’lere yazarak diğer sayfalarınızın içine çağırmanız mümkün. Yani tek bir header.jade dosyası üzerinde yapacağınız değişiklik diğer html sayfalarınızda bulunan header bölümlerine otomatik olarak yansıtılacaktır. Böylelikle projenizde bulunan onlarca belki yüzlerce sayfadaki headerı değiştirmek zorunda değilsiniz. Aynı durum footer ve javascript dosyaları içinde geçerli.
Örnek olarak gösterecek olursak;
Metalarımızın ve header’ımızın bulunacağı ayrı ayrı iki farklı .jade dosyası hazırlayalım.
(meta.jade)
Metalarımızı şekildeki gibi jade yazım dilini kullanarak oluşturalım.
(header.jade)
Metalarımızı oluşturduğumuz gibi header’ımızıda basit bir yapıda oluşturduk. Burada dikkat etmeniz gereken kısım tab yapısına dikkat etmeniz olacaktır. aksi takdirde prepros programımız sağ alt köşede kırmızı yazılı hata ekranını gösterecektir. Doğru yazım uyguladıysanız ctrl+s kombinasyonu ile dosyanızı kaydettiğinizde yeşil yazılı ekran doğru yaptığınızı gösterecektir. Daha sonra 2 dosyamızı da çağıracağımız asıl sayfamızı yapacak olursak;
(anaSayfa.jade)
include meta.jade ve include header.jade komutlarıyla istediğimiz konumlara meta ve header dosyalarımızı dahil ettik. Bu sayfanın çıktısı ise bize;
(anaSayfa.html)
3 farklı jade dosyasıyla hazırladığımız ana sayfamızın çıktısı şekildeki gibidir. Diğer kullanmak istediğiniz fonksiyonlar için ve daha geniş çaplı kullanımlar için jade‘nin sitesini ziyaret edebilirsiniz.