In: Genel


[name|Friend] 90’larda ilk büyük LEGO setimi aldığımda – efsanevi LEGO 8880 Süper Araba – siz inşa etmeye başlamadan önce 1347 parçayı tasnif etmek için döndürülebilir kapaklı, teknik şemalı ve 14 bölmeli parlak sarı plastik kalıplı büyük bir kara kutu içinde geldi.



Parçaları ayırmanız gereken 14 bölme

Parçaları ayırmanız gereken 14 bölme

O arabayı yıllar içinde onlarca kez yapmış olmalıyım. Böyle harika bir küçük makine. Bağımsız salıncaklı süspansiyon, 4 tekerlekten direksiyon, değişen vitesler, V8 motor. Kalkınan bir mühendisin hayali.

Tüm parçaları bulmak her zaman en kötü kısımdı. Elbette sonunda tüm LEGO koleksiyonumu ezberledim ve daha küçük parçalar bu kutularda birleştirilmiş halde kaldı, ama ah.

2020’de ikinci büyük LEGO setimi aldığımda – Satürn V – LEGO stratejilerini değiştirmişti. 1969 parçaları, numaralandırılmış torbalarla dolu büyük bir kutuda geldi.

Her çanta, talimatların mantıklı bir adımını oluşturmak için tam olarak ihtiyacınız olan parçaları içerir. Bir Satürn V roket aşamasının çekirdeğini veya tam ay inişini tamamlamak gibi.

Organizasyon yok. Çantalar tüm renk, şekil ve boyutlarda parçalar içerir. Minifigler, cilalı dış plakalar ve büyük eski tarz tuğlalarla karıştırılmış mekanik parçalar. Tam bir karmaşa.

Ve işe yarıyor. Asla hiçbir şey aramadan talimatları gözden geçiriyorsunuz. Her çantadaki ~164 parça göz önündedir ve bunları kolayca seçersiniz.

Küçük saman yığınları aramak için hızlıdır.

Aynı prensip kod için de geçerlidir. Bir özellik oluştururken veya bir hatayı düzeltirken, mümkün olan en küçük arama alanını istersiniz.

Çalışmanızı etkileyebilecek daha az kod ve kod ne kadar yakınsa, o kadar hızlı hareket edebilirsiniz ve beyninizde o kadar az bağlam tutmanız gerekir.

Türe göre düzenlenmiş kod

Süper Araba gibi organize edilmiş bir web uygulaması hayal edin:

your-app/

├─ frontend

│ ├─ css/

│ ├─ javascript/

│ ├─ html/

│ ├─ requests/

├─ backend/

│ ├─ types/

│ ├─ models/

│ ├─ db_queries/

│ ├─ controllers/

│ ├─ routes/

│ ├─ json_renderers/

│ ├─ tests/

Klasörler, içerdikleri kod türüne göre düzenli bir şekilde düzenlenirler, diğer dosyalarda kullanılmaları gerektiğinden çoğu işlevi dışa aktaran dosyalar. Veya testlerde.

Yeni bir özellik oluşturmak için tüm bu klasörlere bir dosya ekleyeceksiniz. Nasıl çalıştığını bilmek için, bağlamı 11 dosyanın tamamında kafanızda tutmanız gerekir. Veya yan yana açabilecek kadar büyük bir monitörünüz olsun.

Özelliğe göre düzenlenmiş kod

Şimdi Saturn V gibi organize edilmiş bir web uygulaması hayal edin:

your-app/

├─ frontend

│ ├─ account/

│ ├─ login/

│ ├─ articles/

├─ backend/

│ ├─ account/

│ ├─ login/

│ ├─ articles/

Farklı makinelerde çalıştıkları ve farklı kitaplıklar kullandıkları için ön uç ve arka uç ayrı kalmalıdır. Bunları ayrı depolarda bile tutabilirsiniz.

Ancak, kullanıcı girişi veya listeleme makaleleri ile ilgili kodu nerede bulacağınızı ne kadar çabuk bildiğinize bakın. Klasör adı size söyler! Ortaya çıkan bir en iyi uygulama, URL’yi klasör adıyla bile eşleştirir. URL’yi biliyorsanız, kodu nerede bulacağınızı da bilirsiniz.

Yararlar

Dahili olarak bunların her biri karmaşıklığa bağlı olarak daha fazla bölünebilir.

Bir ön uç bileşeni, stilleri, veri getirmeyi, HTML yapısını ve herhangi bir UI mantığını içeren büyük bir dosyada yaşayabilir. Bir değişiklik yaptığınızda, her şey tam önünüzdedir.

Ve hepsi tek bir dosyada olduğu için, bileşeninizin içinde olması gereken şeyleri dışa aktarmanız gerekmez. Neyin dahili ve neyin arayüz olduğu konusundaki kafa karışıklığını azaltır 😍

Arka uçta bu yaklaşım şu şekilde modellenmiştir: hizmet mimarisi. Her modül, bir işle ilgili sorunu yürüten bağımsız bir hizmet olarak çalışır. Bir arayüzü ortaya çıkarır ve içindekileri gizli tutar. Bu özellik üzerinde çalışırken, yalnızca kendi bağlamını bilmeniz gerekir. Kullandığınızda, nasıl çalıştığını bilmenize gerek yoktur.

Sonuç olarak:

  • aramak için daha az kod
  • anlamak için daha az bağlam
  • düzenlemek için daha az dosya

Ve dosyalar çok büyüdüğünde, aynı dizinde bölünürsünüz. Bu şekilde ilgili kod yakın kalır ve içe aktarma anlamlı olur. Daha fazla yok import Foo from '../../../../models/...'.

Şerefe,
~İsviçre

Bu makaleden hoşlandınız mı?

yayınlandı 5 Eylül 2022 içinde yeniden düzenleme, Yazılım Mühendisliği, Programlama Dersleri,


Cevaplayabileceğimi düşündüğünüz yanan bir sorunuz mu var? bana vur twitter ve elimden geleni yapacağım.

Ben kimim ve kime yardım ediyorum? Ben Swizec Teller ve kodlayıcıları mühendislere dönüştürüyorum. “Yürekten ham ve dürüst!” yazı. Palavra sıkma. Modern bir yazılım mühendisinin kariyerine ve becerilerine ilişkin gerçek bilgiler.

olmak istiyorum doğru Kıdemli mühendis? Sahiplenin, özerkliğe sahip olun ve ekibinizde bir güç çarpanı olun. Kıdemli Mühendis Zihniyeti e-kitabı size yardımcı olabilir 👉 swizec.com/senior-mindset. Bunlar kariyerimin kilidini açan zihniyet değişiklikleri.

Sunucusuz ve modern arka uç hakkında merak mı ediyorsunuz? Ön uç mühendisleri için Sunucusuz El Kitabına göz atın 👉
SunucusuzEl Kitabı.dev

D3 örneklerini kopyalamayı durdurmak ve kendi veri görselleştirmelerinizi oluşturmak ister misiniz? Tüm ekibinizin anlayabileceği ölçeklenebilir dataviz React bileşenlerini nasıl oluşturacağınızı öğrenin Veri Görselleştirme için React

JavaScript, React, Serverless, Fullstack Web veya Indie Hacking ile ilgili en iyi e-postalarımı almak ister misiniz? Ödeme swizec.com/collections

Modern JavaScript sözdizimini tazelemek ister misiniz? Etkileşimli hile sayfama göz atın: es6cheatsheet.com

Harika biri bu mektubu sizinle paylaştı mı? Müthiş! Yazılım mühendisleri için mükemmelliğe giden yolda haftalık mektuplarıma buradan kaydolabilirsiniz: swizec.com/blog

Modern JavaScript sözdiziminizi tazelemek ister misiniz? Etkileşimli hile sayfama göz atın: es6cheatsheet.com

Bu arada, belki bugün henüz kimse söylemedi: Seni sen olduğun için seviyorum ve takdir ediyorum ❤️



Bir cevap yazın

Ready to Grow Your Business?

We Serve our Clients’ Best Interests with the Best Marketing Solutions. Find out More

How Can We Help You?

Need to bounce off ideas for an upcoming project or digital campaign? Looking to transform your business with the implementation of full potential digital marketing?

For any career inquiries, please visit our careers page here.
[contact-form-7 404 "Bulunamadı"]