کد تمیز چیه؟ چرا انقدر مهمه؟

نوشتن کد تمیز یعنی طوری کدنویسی کنین که هم خودتون، هم بقیه بتونن به‌راحتی بخونن، بفهمن و گسترشش بدن.

مثل دفتر خوش‌خط مدرسه‌ست؛ به چشم میاد و دردسر درست نمی‌کنه!

یکی از مهمترین نکاتی که باید رعایت کنیم تا کدمون تمیز بشه، استفاده کردن از اسم های عمومی و قابل فهمه؛ .

چرا؟؟ چون اگه یک نفر یا حتی خودتون بعد یک ماه بشینید و بخواید کداتون رو بررسی کنید، دیگه فکر نمیکنین وایییییی!!! این متغیر چیکار میکرد؛ به خاطر اسم گذاری درست، میتونین راحت تر کداتون رو بررسی کنین

اول از همه میریم سراغ کد های کثیف و تمیز html و مقایسه اونها با هم دیگه...

HTML

<div><h1>سلام</h1><p style="color:red">به سایتم خوش اومدی</p></div>

همه چی ریخته رو هم، از تگ معنایی استفاده نشده، استایل هم مستقیمه!

<section>
  <h1>سلام</h1>
  <p class="welcome-text">به سایتم خوش اومدی</p>
</section>

تگ معنایی (`section`) و کلاس منظم باعث خوندن بهتر و سئوی قوی‌تر می‌شه.

CSS

div.box {color: red;
  background-color: red;font-size: 14px;
}
.box2{background-color:red;
width:100px;padding:20px;
height:325px;}div.box {display:flex;
  padding: 10px;
  text-align:center
}

خب توی این کد، خصوصیت ها نامنظمن و به جای اینکه کدهارو توی یک کلاس مستقیم بنویسیم، اون رو تو دوتا کلاس مختلف نوشتیم که نتیجه این کد فقط شلوغ شدن و بیشتر شدن تعداد خط کدامون هستش.،

.box {
  color: red;
  background-color: red;
  font-size: 14px;
  display: flex;
  padding: 10px;
  text-align: center;
}
.box2{
  background-color: red;
  width: 100px;
  padding: 20px;
  height: 325px;
}

همه چیز تو یک کلاس هدف‌دار جمع شده و دیگه کدهای تکراریو الکی نمیزنیم.

JavaScript

let x = document.getElementById("btn");
x.onclick = function() {
  alert("سلام");
}

اسم متغیری که انتخاب کردیم، بی معنیه و از روش های قدیمی نوشتاری جاوااسکریپت استفاده کردیم

const welcomeButton = document.getElementById("welcomeBtn");
welcomeButton.addEventListener("click", () => {
  alert("سلام! خوش اومدی");
});

اسمی که برای متغیرمون انتخاب کردیم قابل فهم تره و از روش جدید جاوااسکریپت کردیم.

PHP

$c = new PDO("mysql:host=localhost;dbname=test", "root", "");
$q = $c->query("SELECT * FROM users");
while($r = $q->fetch()) {
  echo $r[1];
}

همه چیز فشرده، بی‌امنیت و مبهم.

$pdo = new PDO("mysql:host=localhost;dbname=test", "root", "");
$query = $pdo->query("SELECT name FROM users");
while($user = $query->fetch()) {
  echo htmlspecialchars($user['name']);
}

متغیرها واضح، داده‌ها امن، کد قابل فهم.

خب تو این مقاله یکسری کدهای کثیف رو بررسی کردیم و گفتیم اشکالاتشون چیه و باهم درستش رو نوشتیم.

حالا تو بخش بعدی قراره پرتکرارترین سوالایی که ممکنه براتون پیش بیاد رو جواب بدیم

نتیجه‌گیری

• کد تمیز راحت‌تر فهمیده و توسعه داده می‌شه.
• اشکال‌یابی و تغییر دادن رو سریع‌تر می‌کنه.
• باعث می‌شه خودت و تیمت آرامش بیشتری داشته باشید.