گاهی شروع کردن سختترین بخش یادگیریه. اما خبر خوب اینه که برای HTML، میتونی بدون نصب هیچ برنامهای همین الان شروع کنی!
🖥️ معرفی CodePen
- CodePen یک وبسایت رایگان به آدرس codepen.io هست.
- نیازی به ساخت حساب کاربری نداری، اما اگر حساب رایگان بسازی، پروژههات ذخیره میشن و بعداً میتونی دوباره بهشون برگردی.
- با کلیک روی دکمهی Create → New Pen یک محیط ویرایشگر باز میشه که شبیه یک برنامهی واقعی عمل میکنه.
✍️ اولین کد HTML در CodePen
در بخش HTML تایپ کن:
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
🔄 همزمان با نوشتن، پایین صفحه پیشنمایش زنده رو میبینی. این یعنی مرورگر داره کد رو تفسیر میکنه و نتیجه رو نمایش میده.
🎮 چرا CodePen عالیه؟
- مثل یک زمین بازی برای تمرین و آزمایش کدهاست.
- هر چیزی که بنویسی، فوراً نتیجهش رو میبینی.
- بخش CSS هم در دسترسه، که در نیمهی دوم دوره برای طراحی و استایلدهی استفاده میکنیم.
⚠️ نکته مهم
- CodePen به فایلهای روی کامپیوترت دسترسی نداره.
- پس اگر بخوای در درسهای بعدی عکس یا فایل محلی اضافه کنی، باید از یک ویرایشگر واقعی روی سیستم استفاده کنی.
🎯 جمعبندی
- برای شروع سریع و ساده: از CodePen استفاده کن.
- برای پروژههای جدیتر: یک ویرایشگر واقعی مثل VS Code یا Sublime Text نصب کن.
- انتخاب با توست؛ میتونی از هر دو ابزار استفاده کنی.