راهنمای کامل کد نویسی در محیط براکتس (Brackets)

آموزش کد نویسی سریع و حرفه ای html , css

از ادیتور براکتس می توان برای کد نویسی html,css,jquery,php استفاده کرد. مهمترین ویژگی آن رایگان و کم حجم بودن است که باعث محبوبیت آن در مدت زمان کم شده است. تفاوت بارز آن با ادیتور sublime text پشتیبانی از زبان فارسی می باشد.

اگر شما هم در زمینه طراحی سایت فعالیت دارید، یکی از مهمترین چالش هایی که در ابتدای کار با آن مواجه می شوید، انتخاب یک نرم افزار مناسب برای طراحی وب سایت است. در گذشته Adobe dreamweaver یکی از نرم افزارهای محبوب برای توسعه وب بود. در آن زمان توسط دریم ویور با درگ دراپ کردن می توانستید صفحات وب خود را طراحی کنید. اما نتیجه کارها ممکن بود از نظر کد نویسی زیاد جالب نباشد. به عنوان طراح سایت باید تمام طراحی خود را از طریق کد نویسی انجام دهید. براکتس بهترین گزینه برای کد نویسی سمت کلاینت است. توی این دوره آموزشی با قابلیت ها و پلاگین های مفید آشنا می شویم. آبان وب در دوره آموزش html از این ادیتور برای کد نویسی استفاده میکند.

ادیتور براکتس برای کد نویسی مناسب است چون:

حجم بسیار کمی دارد و سبک است
کاملا رایگان است و نیازی به خرید لایسنس و یا کرک کردن ندارد
از زبان فارسی پشتیبانی میکند و برخلاف SublimeText کاراکتر های فارسی را به درستی نمایش میدهد
پلاگین های بسیار خوبی برای آن نوشته شده است

سرفصل های آموزش براکتس(Brackets)

معرفی ادیتور براکتس و دانلود و نصب آن
معرفی امکانات پیش فرض براکتس و قابلیت بسیار جذاب Live Preview
آموزش نصب پلاگین ها در براکتس و معرفی وآموزش پلاگین Emmet
روش استفاده از پلاگین beautify برای مرتب سازی ساختار کدها
معرفی و نصب پلاگین Open In Browser
آموزش استفاده از پلاگین Color Picker برای انتخاب رنگ
معرفی پلاگین Tree Icon برای قرار دادن آیکن فایل در کنار نام هر فایل

لینک های دانلود

ارسال نظر درباره این موضوع

آرمین (سه شنبه, 10 فروردین 1400 ساعت 11:35:55)
واقعا عالیه این برنامه ولی من نیاز دارم دامنش لوکال هاست باشه تو لایو پرویو، چجوری تغییر بدم؟
- (چهار شنبه, 11 فروردین 1400 ساعت 14:26:50)
  
  بعید بدونم همچین امکانی داشته باشه میتونید از visual studio code استفاده کنید
. (دو شنبه, 11 اسفند 1399 ساعت 10:38:50)
سلام. من همه کارای نیازشو انجام دادم ولی کار نمیکنه برنامه و کد ها رو ثبت نمیکنه
- (چهار شنبه, 13 اسفند 1399 ساعت 15:55:50)
  
  یعنی چی دقیقا؟ کجاش مشکل دارید؟
رضا (دو شنبه, 02 تیر 1399 ساعت 05:02:22)
سلام چرا قابلیت لایو پرویو واسه من کار نمیکنه ارور میده اعصابم خورده چیکار کنم پلییییییییییییییییییییز
- (دو شنبه, 02 تیر 1399 ساعت 09:22:11)
  
  چه اروری میده؟ شما زمانی که بخوای از این قابلیت استفاده کنی باید توی براکتس فایل html باز باشه بعدش دکمه لایو رو بزنی
علي (جمعه, 16 خرداد 1399 ساعت 00:02:42)
سلام، چپ چين يا راست چين كردن متن فارسي چگونه است؟
- (جمعه, 16 خرداد 1399 ساعت 16:32:21)
  
  باید از سی اس اس استفاده کنید دستور text-align:right رو داریم برای این کار
فریبرز جعفرزاده (دو شنبه, 08 اردیبهشت 1399 ساعت 21:17:50)
سلام آقای کشاورز ، شما خیلی خوبی خیلی خوب
- (چهار شنبه, 10 اردیبهشت 1399 ساعت 09:57:48)
  
  سلام آقا فریبرز. نظر لطف شماس خوبی از خودتونه
feelinggood (چهار شنبه, 30 بهمن 1398 ساعت 00:32:42)
سلام لینک های دانلود کار نمیکنن
- (چهار شنبه, 30 بهمن 1398 ساعت 09:00:34)
  
  سلام تست شد مشکلی نداشت کدوم لینک مشکل داره؟
کاربر (پنج شنبه, 17 مرداد 1398 ساعت 21:28:11)
سلام ایا به جای افزونه Emmet راهی وجود داره که قابلیت autocomplete مثل ویزوال استودیو یا حتی phpstorm به این ادیتور اضافه بشه؟ منظورم اینه که یه کادر باز بشه و کلمات نشون داده بشن و با استفاده از Tab بشه انتخابشون کرد ادیتور فوق العاده ایه، حیفه که همچین چیزی نداشته باشه
- (جمعه, 18 مرداد 1398 ساعت 09:16:23)
  
  سلام بله. emmet فقط بحث کد نویسی سریع رو پوشش میده. براکتس به دلیل Open Source بودن باعث شده محبوبیت بالایی داشته باشه و همینطور پلاگین های زیادی برای اون نوشته بشه. فقط کافیه اون پلاگینی که مد نظر دارید توی بخش افزونه ها سرچ کنید

آرمین (سه شنبه, 10 فروردین 1400 ساعت 11:35:55)

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

(چهار شنبه, 11 فروردین 1400 ساعت 14:26:50)

بعید بدونم همچین امکانی داشته باشه میتونید از visual studio code استفاده کنید

. (دو شنبه, 11 اسفند 1399 ساعت 10:38:50)

سلام. من همه کارای نیازشو انجام دادم ولی کار نمیکنه برنامه و کد ها رو ثبت نمیکنه

(چهار شنبه, 13 اسفند 1399 ساعت 15:55:50)

یعنی چی دقیقا؟ کجاش مشکل دارید؟

رضا (دو شنبه, 02 تیر 1399 ساعت 05:02:22)

سلام چرا قابلیت لایو پرویو واسه من کار نمیکنه ارور میده اعصابم خورده چیکار کنم پلییییییییییییییییییییز

(دو شنبه, 02 تیر 1399 ساعت 09:22:11)

چه اروری میده؟ شما زمانی که بخوای از این قابلیت استفاده کنی باید توی براکتس فایل html باز باشه بعدش دکمه لایو رو بزنی

علي (جمعه, 16 خرداد 1399 ساعت 00:02:42)

سلام، چپ چين يا راست چين كردن متن فارسي چگونه است؟

(جمعه, 16 خرداد 1399 ساعت 16:32:21)

باید از سی اس اس استفاده کنید دستور text-align:right رو داریم برای این کار

فریبرز جعفرزاده (دو شنبه, 08 اردیبهشت 1399 ساعت 21:17:50)

سلام آقای کشاورز ، شما خیلی خوبی خیلی خوب

(چهار شنبه, 10 اردیبهشت 1399 ساعت 09:57:48)

سلام آقا فریبرز. نظر لطف شماس خوبی از خودتونه

feelinggood (چهار شنبه, 30 بهمن 1398 ساعت 00:32:42)

سلام لینک های دانلود کار نمیکنن

(چهار شنبه, 30 بهمن 1398 ساعت 09:00:34)

سلام تست شد مشکلی نداشت کدوم لینک مشکل داره؟

کاربر (پنج شنبه, 17 مرداد 1398 ساعت 21:28:11)

سلام ایا به جای افزونه Emmet راهی وجود داره که قابلیت autocomplete مثل ویزوال استودیو یا حتی phpstorm به این ادیتور اضافه بشه؟ منظورم اینه که یه کادر باز بشه و کلمات نشون داده بشن و با استفاده از Tab بشه انتخابشون کرد ادیتور فوق العاده ایه، حیفه که همچین چیزی نداشته باشه

(جمعه, 18 مرداد 1398 ساعت 09:16:23)

سلام بله. emmet فقط بحث کد نویسی سریع رو پوشش میده. براکتس به دلیل Open Source بودن باعث شده محبوبیت بالایی داشته باشه و همینطور پلاگین های زیادی برای اون نوشته بشه. فقط کافیه اون پلاگینی که مد نظر دارید توی بخش افزونه ها سرچ کنید