Statik siteleri severim. Daha doğru olmak için onları inşa etmeyi seviyorum. Ekranın önünde oturmak hakkında saf bir şey var; sadece siz ve metin düzenleyiciniz, düz eski HTML ve CSS'de yazıyor.

Beni yanlış anlamayın, dinamik siteler de eğlencelidir. Tanrı, WordPress hayranı olduğumu ve kullanıcılara sağladığı kullanım kolaylığını bilir. Statik siteler beni geri getiriyor. WYSIWYG yazılımından bir metin editörüne geçmeyi hatırlıyorum. İlk PHP fonksiyonumla geliştirme sürecini düzene koyduğumu hatırlıyorum: içerir. Bunlar iyi günlerdi, ama diğerlerinin aksine, hepsi gitmedi.

Fark şu ki, daha iyisini yapabiliriz. Ön işlemciler gibi Az ve şımarıklık CSS yazma deneyimini büyük ölçüde geliştirdi. Seçtiğimiz HTML’ye karıştırmak için istediğiniz sayıda kodlama dilimiz var. Ve sonra… o zaman insanlar gerçekten ilginç şeyler yaptılar.

Daha önce bahsettim Çekiç Mac için uygulama. Eski bir HTML'ye kendi işlevlerini ve genişlemelerini tanıtan bir uygulama, bir dosyayı başka bir kısma ve diğer iyi şeylere kısmi olarak eklemenize izin veriyor. Sonuçları, herhangi bir yerde barındırılabilecek düzenli bir statik siteye derler. Aslında bundan daha fazla özellik var, ama bu makale Hammer hakkında değil. Niye ya? Sadece Mac platformu için mevcut.

Girmek Arp ...

Arp tanıtımı

Bu bir uygulama değil, daha çok. CSS için önişlemciler içerir. HTML belgeleri için şablon dilleri içerir. Geliştirme için kullanılabilen veya gerçek bir üretim sunucusuna dönüştürülen bir mini sunucu. Node.js.'da çalıştığı için tam bir uygulamaya dönüştürmek için sunucu tarafı JavaScript'i kullanabilirsiniz. Ya da, bir programcı değilseniz, sadece statik sitenizi oluşturabilir ve daha sonra başka bir yere ev sahipliği yapmak için derleyebilirsiniz.

Çünkü Node.js'ye dayanıyor, çapraz platform. Ayrıca MIT lisanslıdır, bu yüzden ücretsizdir. İsterseniz değişiklik yapabilir, yeniden dağıtabilir veya yeniden satabilirsiniz.

Şimdi, gözünü diken eden insanlar, Harp'in türünün tek aracı olmadığını fark etmiş olacaklar. Pek çok kişi, web projelerinin hızlı bir şekilde başlatılması için Düğüm tabanlı araçlar yaratıyor. Bunlarla ilgili temel problemim, genellikle favori CSS framework'ünü, animasyon kütüphanesini veya HTML boilerplate'ini kullanmak istediğinizi varsaymalarıdır. Harp yazmak istediğiniz kod hakkında bir varsayım yapmaz. Sadece size daha hızlı yazabilme araçları veriyor.

Dikkat et, komut satırı üzerinden kurulmalı ve çalıştırılmalıdır. Bunun için GUI yok. Ama bir kere gittikten sonra - ve bu hiç de zor değil - faydalar öğrenme eğrisinden daha ağır basıyor.

Aletler

CSS ön işlemciler

Şimdiye kadar, okuyucularımızın çoğunun web endüstrisinin vanilya CSS'de geliştirmeye çalıştığı yolları bildiğine eminim. Projeniz için mini sunucu çalıştırıldığında, LESS, SASS ve Stylus dosyaları otomatik olarak CSS'ye derlenir.

Derleme her zaman tatmin edici derecede hızlıdır. Tüm testlerimde, web siteme yapılan değişiklikler, dosyamı kaydetmem için gereken süreyi derledikten sonra tarayıcımı yeniledi.

Isınma dilleri

Ayrıca dahil yeşim taşı ve EJS. Bunlar, daha fazla esnekliğe sahip daha gelişmiş HTML belgeleri oluşturmanıza / oluşturmanıza yardımcı olmak için tasarlanmış hem JavaScript şablonlu dillerdir. Temel olarak, HTML şablonları oluşturabilir ve gerçek sayfa içeriğinizi bu şablonlardan ayrı olarak saklayabilirsiniz. CMS kullanmak gibi bir şeydir, sadece veritabanı yoktur (siz istemediğiniz sürece) ve tüm içeriği düz metin dosyalarına yazmanız gerekir.

Asıl avantaj, elbette kod bakımı ve gerçek programcıların gerçek sunucu ve istemci tarafı JavaScript ile yapabileceği tüm havalı şeylerdir. Bunlar ayrıca, bloglar gibi daha gelişmiş sistemler oluşturmanıza olanak tanıyan dillerdir (bordroda bir programlayıcınız varsa).

İkisi arasındaki fark nedir? Çoğunlukla kodunuzu nasıl yazmayı tercih ettiniz.

EJS işleri basit tutar. Zaten HTML'yi biliyorsanız, yalnızca EJS'ye özel etiketler eklemeniz yeterlidir: <% global / header%> öğesini içerir. Orada ne yaptım? Temel olarak, sayfa üstbilgisinde HTML'yi başka bir dosyadan yakaladım ve ana şablonumda kullanmak üzere içe aktardım. Elbette çok daha karmaşık şeyler yapabilirsin. İşte Harp belgelerinin söylemesi gerekenler EJS hakkında.

Jade, HTML'yi tamamen yazmanın çok farklı bir yaklaşımını benimsiyor. Projenin ana sayfasında gösterildiği gibi:

bodyh1 Jade - node template engine#container.colif youAreUsingJadep You are amazingelsep Get on it!p.Jade is pretty cool,

Hepsi HTML ve Javascript'e çevrilir. Bir if / else ifadesinin tam ortasına eklenmesi ve uygun girintiye bağlı olduğuna dikkat edin.

CoffeeScript

Coffeescript, Jade'in HTML'ye ne olduğunu JavaScript'e yönlendirir. Temel olarak, JavaScript'in yazılması için basitleştirilmiş bir biçimdir, bu da daha sonra normal şeylere derlenir. Jade gibi, büyük ölçüde girintiye bağımlıdır ve birçok sözdizimini bırakır.

Şöyle görünüyor (projenin ana sayfasından utanmadan bir başka örnek):

math =root:   Math.sqrtsquare: squarecube:   (x) -> x * square x

Ve çıktı böyle görünüyor:

math = {root: Math.sqrt,square: square,cube: function(x) {return x * square(x);}};

Platform

Harp ile oluşturulan web siteleri elbette her yerde barındırılabilir. Yine de, Harp’ın yaratıcılarının yazılımlarıyla oluşturulmuş şeyler için özel olarak tasarlanmış bir barındırma platformu oluşturduğuna değinmek gerekir. Fiyatlandırma kötü değildir ve sitenize kolay otomatik güncellemeler yapmak için Dropbox ile entegre olur. Buradan kontrol edin: www.harp.io

Sonuç

Harp, önişlemcileri, templasyon dilleri, şeffaf hızı ve çapraz platform iyiliği ile, herhangi bir tasarımcının araç kutusuna sağlam bir ektir. Öğrenme eğrisine değdiğini söylüyorum.