PHP, HTML, Javascript ve iyi uygulama yazma

10

Ben ve ekibim için HTML, JavaScript ve PHP kodlaması hakkında bir sözleşme belirtimi yazmak zorunda olduğumu fark ettim.

Web geliştirmede, tıpkı C ++ gibi, kesinlikle bir girinti ve yorum hayranıyım.

Yine de, genellikle işimde aniden baş ağrısını ortaya çıkaran HTML + JavaScript + PHP koduyla karşılaşıyorum.

Kodumu okunabilir hale getirmeye çalışıyorum, ama bana daha iyi gibi görünen (girinti ve yorum yapmak için) takım arkadaşlarımı etkilemiyor gibi görünüyor, bu yüzden "melez yazarken en iyi veya en azından paylaşılan iyi uygulama olup olmadığını merak ediyordum "tıpkı gün geçtikçe daha karmaşık hale gelen günümüz web sayfaları gibi belgeler.

Muhtemelen bugünün web sayfalarının kodunun biraz karmaşık olmasının doğasında olduğunun farkındayım, ancak bu yönlerle ilgili iyi bir sözleşmenin zaten var olup olmadığını merak ediyorum.

— Federico Zancan
kaynak

19

Takip ettiğim bazı genel kurallar:

Genel

Girintiler 4 boşluktur.
Yeni seviyeleri girinti
Yorumlar, girinti düzeyinden <~ 80 karakterdir. İki seviyedeysem (8 boşluk), imleç durağının yaklaşık 88 karakter olacağı anlamına gelir.
Çok satırlı yorumlar kullanın. Görünümü tercih ederim, ancak bu öznel bir nokta.
Neler olup bittiğine dair hiçbir fikriniz olmadığında, daha sonra şimdi yorum yapın.
Allman tarzı parantez . Daha temiz ve daha okunabilir. Öznel .

JavaScript

Bir kütüphane kullanın. Özellikle jQuery çok iyi. Tüm çapraz tarayıcı baş ağrılarını ortadan kaldırır.
Kimliklerin belirli öğeler için, sınıfların stiller için olduğunu anlayın. Kimlikler sayfa başına bir kereden fazla kullanılmamalıdır ve bunlara özel kancalar eklenir. Navigasyon gibi şeyler için sınıfları kullanın.
Kaynak yöntemlere dışarı. Tüm kodu bindaramaya sokmak cazip gelebilir , ancak kendi işlevine koymak kodunuzun esnekliğini artıracaktır.
Kanallar yerine fonksiyonları kullanın. Bunun setTimeout(function(){ /* Do something */ }, 1000);yerinesetTimeout('doSomething', 1000);
İle yerel değişkenleri kullanın var.

HTML

Anlamsal işaretleme. Uygun etiketleri kullanın. <br />Alan eklemek, kenar boşluklarını ve CSS kurallarını ayarlamak için oraya koymayın .
Tüm etiketler küçük harflidir .
Tüm etiketler kapanış etiketi ile bitmeli veya kendiliğinden kapanmalıdır .
Benzer bir düzen için sınıfları kullanın. Gibi önceden tanımlanmış sınıfların bir çift var hide, clear, errorvb
Her şey (komut dosyaları dahil) girmelidir <head>. Bir sorun olduğunda optimizasyonu (hareket ettirme) konusunda endişelenme.
Harici stil sayfaları ve JavaScript kaynağı , sayfaya özgü olmadıkça bir zorunluluktur .

PHP

Çerçeveler iyi, CodeIgniter'ı tavsiye ederim.
Bir çerçeve kullanmak istemiyorsanız, PHP'nin en son sürümünü kullanmayı deneyin. (Bu 5.3 anlamına gelir).
includesAvantajınız için kullanın .
Enjeksiyonları temizleyin veya hazırlanmış ifadeleri kullanın.

Önceden tasarlanmış arıza güvenliği değerlerini kontrol edip etmediklerini gerçekleştirin.

$logged_in = false;
if(check_user($user))
{
     $logged_in = true;
     $user = load_user($_SESSION);
}

Tek ve çift tırnak arasındaki farkı bilir. Mümkünse tek tırnak işareti kullanın.
HTML'yi yankılama.

— Josh K
kaynak

4

Mükemmel bir liste. PHP için 1) şablonlar eklemek istiyorum, php & html (uygulamalarda, en azından) 2) dont mix kullanmak istiyorsunuz fonksiyon çağrıları olarak 3) içerir () mümkün olduğunca çok global kapsam dışında tutmak.

— GrandmasterB

CodeIgniter ve jQuery öneren herkes gözlerimdeki bütünlüğü kaybeder.

— mefisto

4

@teresko: Herhangi bir gerekçe ya da alternatif belirtmeksizin kınıyorsunuz.

— Josh K

+1. Tartışmalı ve tartışmalı noktaların bir listesi, ancak yine de oldukça iyi bir liste.

— haylem

jQuery tüm tarayıcılar arası baş ağrılarını ortadan kaldırır mı?

— James Adam

3

İlham almak için bazı okumalar var:

Zend Framework - php kodlama stili : Maintable php kodu yazma uygulamalarının listesi (PHP Dosya Biçimlendirme, Adlandırma Kuralları, Kodlama Stili: Diziler, Dize, Sınıf, Yöntem örn.).
Google - kod stili kılavuzu : Maintable javascript kodunun nasıl yazılacağı ile ilgili uygulamalar

— tomascejka
kaynak

bu kaynakların ne yaptığı hakkında daha fazla açıklamayı düşünebilir misiniz ve bunları neden sorulan soruya cevap olarak öneriyorsunuz? "Yalnızca bağlantı yanıtları" Stack Exchange'de pek hoş karşılanmıyor

— gnat

1

@gnat düzenle / doğru cevapla

— tomascejka

2

3'ü ayrı tutun. Muhtemelen iyi ölçmek için atılmış bazı SQL ile HTML ve JavaScript çok yankılanan bazı PHP olduğunda her zaman uğraşabilir kod ele.

Hepsini ayrı tutmak, kodun bakımını çok daha kolaylaştıracak ve ayrıca uygulamanın yalnızca HTML / CSS ile çalışması gereken tasarımcı gibi farklı bölümlerinde çalışan kişiler varsa işleri çok daha akıcı hale getirecektir.

— GSTO
kaynak

2

Bir php web uygulaması kodlamak için en kolay yolu kesinlikle birlikte her şeyi püre etmektir. Ancak bu şekilde bir şeyler yaparsanız, çabucak sürdürülemez bir karmaşa ile sarılırsınız.

İşte bazı iyi uygulamalar:

1) JavaScript'inizi bir belgenin <head> kısmına (veya daha iyisi, kafada belirtilen ayrı dosyalara) koyun. Olay dinleyicilerini html'nize dağıtmak yerine bir document.onload olayında nasıl bağlayacağınızı öğrenin. (Daha da iyisi, Jquery gibi bir çerçeve kullanmayı öğrenin; JavaScript'inizi çok daha güzel hale getirecektir).

2) MVC gibi tasarım modellerine bakın. PHP ile yazılmış iş mantığınızı HTML'nizden olabildiğince ayırmak istiyorsunuz. İdeal olarak, HTML sayfalarınızı bir araya getirmek için güzel bir şablon dili kullanırsınız; en azından, HTML'nizdeki PHP tersine çevrilmelidir - esas olarak değişkenleri çağırmak ve başka bir yerde oluşturulmuş listeler arasında geçiş yapmak.

3) Yorum, girinti ... bu şeyler sadece temel programlama en iyi uygulamaları olduğunu. HTML yazarken satır uzunluğumun 80 karakterin üzerine çıkmasına izin veriyorum, çünkü dil çok ayrıntılı olduğundan, ancak kaymanız gereken tek geleneksel uygulama hakkında - ekibin geri kalanı özensiz ise, emip şekillendirmeleri gerekiyor.

— Yama
kaynak

Güzel yorum! Bir yazım hatası var: "JavaScript'inizi bir belgenin içine koyun"

— DL

Whoops. Teşekkür ederim. (Köşeli parantezlerle kodlamayı unuttum. Aptal beni.)

— Yama

1

Performans nedeniyle Javascript sayfanızın sonuna gitmelidir.

— Toby

0

İşte birkaç çerez:

Javascript: varDeğişkenleri başlatırken kullanın .

HTML: Son yüklenmeleri için dosyanın altına komut dosyaları ekleyin.

PHP: Dosyaları ayırın. Tüm sınıflarınızı, normal C ++ geliştirmesinde olduğu gibi tek bir dosyaya koymayın. Mümkün olduğunca yorum yapın ve ayrıca işlevlerinizin / sınıflarınızın amacını yazın.

— Harry
kaynak

Google Javascript Stil Kılavuzu'nu izlemeye çalışıyorum: google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml

— Fosco