این آموزش در تاریخ ۱۴۰۲/۰۶/۱۹ آپدیت شده است.
ادیتور آنلاین زبان HTML
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. در ادامه میخوایم با ادیتور آنلاین زبان HTML – فری لرن آشنا شویم، لطفا با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
ادیتور آنلاین زبان HTML
ادیتور به نرم افزار یا محیطی که بتوان در آن کدنویسی کرد گفته میشود، بطور کلی میتونیم بگیم زبان های برنامه نویسی همچون ( PHP , JavaScript یا سی شارپ و دیگر زبان های برنامه نویسی ) همگی باید درون همچین نرم افزارهایی کدنویسی شوند.
خب یک ادیتور میتونه خیلی خیلی ساده باشه مثه نرم افزار NotePad موجود در سیستم عامل های ویندوز و یا نرم افزار TextEdit موجود در سیستم عامل های مک ( Mac ) و هم میتونه خیلی پیشرفته و با امکانات زیادی باشه.
امروزه نرم افزار یا ادیتورهای زیادی برای نوشتن کدهای زبان های مثه HTML , CSS و … وجود دارد که هر کدام نیز برای خودشان امکانات و شرایط خاصی دارند.
ولی خب در مجموع بخوایم حساب کنیم، بنظره شخصی خودم ادیتور زیاد مهم نیست ، مهم خوده شما و میزان دانش شما نسبت به دستورات برنامه نویسی یک زبان می باشد.
Free-Learn
ادیتور آنلاین زبان های HTML , CSS , JavaScript
در ادامه میخوام ادیتور آنلاین زبان های اچ تی ام ال ، سی اس اس و جاوااسکریپت سایت فری لرن رو بهتون معرفی کنم و همچنین با برخی از ویژگی های این ادیتور در ادامه آشنا شویم.
ادیتور در یک نگاه
در ابتدا یک تصویر از ادیتور را مشاهده نمایید ( برای بزرگنمایی لطفا بروی تصویر کلیک کنید )
Free-Learn
حالت های نمایش
ادیتور دارای ۳ حالت نمایش می باشد، که میتوانید به راحتی هر یک از این حالت ها را انتخاب و سپس شروع به کدنویسی کنید.
Free-Learn
با سرعت بالا کدنویسی کنید
شما فقط کافیه ۱ حرف تایپ کنید، ادیتور بطورخودکار با استفاده از کلمات ذخیره و رزرو شده دستوراتی را به شما پیشنهاد خواهد داد که میتوانید آنها را انتخاب و استفاده نمایید.
حتی مقادیر برخی از دستورات نیز بصورت ذخیره شده وجود دارد، مثلا در تگ iframe بصورت خودکار مقدار صفت src آدرس سایت فری لرن می باشد که کافیه با یک کلیک اضافش کنید.
Free-Learn
ذخیره سازی کدها در مرورگر
ادیتور از فناوری ذخیره سازی تحت وب یا local storage یا web storage استفاده میکند ، این یعنی ذخیره سازی دادها بروی مرورگر شما.
یعنی شما اگه کدی نوشتید و بعد به هر دلیلی صفحه ناگهانی بسته شد یا مثلا برق رفت ، نگران نباشید چرا که کدهای شما ذخیره خواهد شد و کافیه دوباره به ادیتور مراجعه کنید.
ولی یادتون باشه اگه کدهای یکی از بخش ها (html,css,js) بطور کامل پاک شود و بعد صفحه رو رفرش کنید صفحه پیش فرض ادیتور به شما نمایش داده خواهد شد، در نتیجه در این حالت کدی از شما ذخیره نخواهد شد.
Free-Learn
کامل کننده کد – ادیتور آنلاین زبان HTML
کافیه یک کلمه از یک دستور را بنویسید، سپس دکمه های Ctrl+E را فشار دهید، بصورت خودکار کلمه مورد نظر تاجایی که امکانش باشد تشخیص و ایجاد میشود.
Free-Learn
اجرای خودکار کدها
بصورت پیش فرض ادیتور در حالت اجرای خودکار قرار دارد، این یعنی کدهای شما درجا و بلافاصله با تایپ شدن در خروجی هم نمایش داده میشوند.
با کلیک بروی منوی اجرای خودکار میتوانید آن را غیرفعال نمایید، سپس باید بروی دکمه ( اجرای کدها ) کلیک نمایید تا کدهای شما اجرا شوند.
همچنین میتوانید از کلیدهای ترکیبی Ctrl+R برای اجرای کدها استفاده نمایید. ( این کلید میانبر فقط در حالتی عمل میکند که اجرای خودکار غیرفعال باشد )
Free-Learn
دانلود کدها
به راحتی با کلیک بروی دکمه دنلود کدها میتوانید تمامی کدهای هر ۳ بخش html,css,js را در قالب یک فایل فشرده zip دانلود نمایید. همچنین میتوانید از کلیدهای ترکیبی Ctrl+D برای دانلود کردن کدها استفاده نمایید.
Free-Learn
مرتب سازی کدها
در حین کدنویسی نگران مرتب بودن کدها نباشید، شما در هرحالتی کدهاتون رو بنویسید و در آخر کار بروی دکمه مرتب سازی کدها کلیک نمایید و کدهای مرتب و تمیز شده تحویل بگیرید.
Free-Learn
کتابخانه های محبوب css و js
از منوی ابزار ، میتوانید کتابخانه های محبوب css و js را مشاهده و در صورت تمایل تنها با یک کلیک آنها را به صفحه اضافه نمایید.
Free-Learn
تگ های پراستفاده از پیش تعریف شده
تعدادی از تگ های پراستفاده HTML را براتون آماده کردم که با یک کلیک میتونید اون تگ رو به صفحه اضافه کنید، فقط قبل از اینکه بروی تگ مورد نظرتون کلیک کنید در قسمت body و اونجایی که میخواید تا اضافه شه کلیک کرده باشید.