معرفی پنج ادیتور آنلاین Html

آنلاین کد بنویسید و ویرایش کنید ! با ما در استادیو تجرا همراه باشید با معرفی پنج ادیتور آنلاین Html

دیدن آموزش افزایش بازدید سایت

https://codepen.io

Codepen یک محیط توسعه اجتماعی برای توسعه دهندگان وب است که امکان به اشتراک گذاری و همکاری با دیگر کاربران را نیز فراهم می کند.

این ادیتور بسیار ساده است و پنل های جداگانه ای برای HTML، CSS، جاوا اسکریپت و نمایش بلادرنگ تغییرات دارد.

سایز این پنل ها را نیز می توان با درگ لبه ها تنظیم کرد.

در این سایت کاربران می‌توانند پروژه‌هایی به نام pen ایجاد کنند که مکانی برای قرارگیری کدهای مختلف می باشد و با ترکیب چندین پروژه می توان یک مجموعه ایجاد کرد.

ایجاد پروژه های خصوصی و مجموعه ها نیازمند ایجاد حساب کاربری pro است که قیمت آن از ماهیانه 9 دلار شروع شده و قابلیت های دیگری از قبیل هاست، تم های آماده، همکاری بلادرنگ و دسترسی به IDE کامل توسعه وب CodePen را دراختیار کاربر قرار می دهد.

html

https://jsfiddle.net

این سایت امکان به اشتراک گذاری کدهای جاوا اسکریپت، CSS و HTML را فراهم می کند.

مزیت اصلی JSFiddle این است که اجازه اضافه کردن فایل های CSS و HTML خارجی را در HTML را به کاربر می دهد.

علاوه بر این کلید Tidy تورفتگی خطوط را به صورت خودکار اصلاح میکند.

کلید Collaborate امکان ویرایش یک کد را به صورت همزمان با افراد دیگر فراهم می کند.

در نگاه اول ممکن است رابط کاربری آن ساده به نظر برسد، اما ویژگی‌های قدرتمندی همچون شبیه‌ساز Ajax را در اختیارتان قرار می‌دهد.

تنها نکته منفی این است که برای مشاهده نتیجه تغییرات اعال شده باید روی کلید Run کلیک کنید.

html

http://jsbin.com

این سایت در واقع جایگزینی جمع و جورتر برای JSFiddle است که امکان ویرایش ترکیبات مختلف HTML، CSS و جاوا اسکریپت را با جابجایی پنل ها فراهم می کند.

با استفاده از نوار ابزار می توانید پنل نمایش و کنسول را برای انعطاف پذیری بیشتر تغییر دهید.

این سایت بر خلاف JSFiddle امکان لینک کردن منابع خارجی جاواسکریپت و CSS را فراهم نکرده و تنها می توانید از کتابخانه های جاوا اسکریپت از پیش تعریف شده آن استفاده کنید.

با این حال کتابخانه مذکور بسیار غنی بوده و از jQuery گرفته تا React و Angular را شامل می شود.

JSBin در حالت عادی رایگان است اما برای استفاده از embedهای سفارشی، هاست، همگام سازی با دراپ باکس و URL صفحات ساخته شده در این سایت به حساب کاربری PRO نیاز دارید که مستلزم پرداخت هزینه است.

html

https://liveweave.com

این سایت نیز شبیه به ویرایشگر قبلی است اما واسط کاربری آن چشم نوازتر است.

Liveweave هم مانند JSFiddle امکان همکاری بلادرنگ با توسعه دهنده های دیگر را فراهم کرده برای مثال:

● JSBin به شما اجازه لینک کردن مانبع شخص ثالث از قبیل jQuery را می دهد.

علاوه بر این از ویژگی های منحصر به فردی نیز بهره می برد، برای مثال:

● Lorem Ipsum Generator توضیحات فیلد را در مکان نشانگر ایجاد می کند.

CSS Explorer یک ابزار WYSIWYG را برای ایجاد استایل های CSS فراهم کرده و Color Explorer نیز انتخاب رنگ مطلوب برای تم را میسر می سازد.

علاوه بر این Vector Editor به شما اجازه می دهد وکتورهای گرافیکی را برای سایت طراحی کنید.

html

https://html.house

اگر به HTML بیش از CSS و جاوا اسکریپت اهمیت می دهید، این سایت بهترین گزینه است.

طراحی HTMLhouse بسیار ساده و آسان است و صفحه آن به دو قسمت تقسیم میشود:

● سمت چپ کاربر کدها را ویرایش کرده

● سمت راست نیز تغییرات به صورت بلادرنگ به نمایش گذاشته می شوند.

یکی از مزیت های این سایت این است که امکان به اشتراک گذاری صفحه طراحی شده را فراهم می کند.

سادگی و کارایی، دو ویژگی اصلی در ویرایشگرهای HTML آنلاین هستند که این سایت نیز از آنها بهره می برد.

گفتنی است HTMLhouse توسط مدیران سایت Write.as طراحی شده که یک پلتفرم وبلاگ نویسی است.