تخفیف ویژه

9 ویرایشگر برای ساخت کد HTML و CSS و Javascript آنلاین

دسته بندی: جاوا اسکریپت
زمان مطالعه: 3 دقیقه
۰۸ تیر ۱۳۹۹

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

Editor‌های آنلاین

همان‌طور که پیش‌تر گفتیم Editor‌های آنلاین امکانات زیادی را در اختیار ما  قرار می‌دهند. برای مثال ساخت کد html آنلاین را برای ما راحت می‌کنند. تا بتوانیم کد را به صورت آنلاین تست کنیم. لازم به ذکر است، برای استفاده از بعضی از این سایت‌ها نیاز است در ابتدا در سایت ثبت نام کنید. یکی از مزیت هایی که می‌توان برای ویرایشگر‌های آنلاین نام برد، قابلیت save کردن می‌باشد. به این صورت که کد‌ها را در بخش‌های مورد نظر قرار داده و از آن‌ها خروجی می‌گیریم. با این کار سایت لینکی را در اختیار ما قرار می‌دهد که با استفاده از آن می‌توانیم کد‌های خود را به اشتراک بگذاریم. تعداد این ادیتور‌های آنلاین بسیار زیاد است که ما در ادامه بهترین آن‌ها را به شما معرفی می‌کنیم.

CodePen

CodePen یکی از محبوب‌ترین ابزار‌های آنلاین برای نوشتن کدهای CSS ،HTML و JS است که همزمان با نوشتن کد می‌توانید خروجی کد را نیز مشاهده کنید.

ویرایشگر آنلاین html

CodeSandBox

CodeSandBox یک ادیتور آنلاین قدرتمند است که محیطی مانند محیط IDE دارد و می‌توانید از پروژه‌ی خود  خروجی ZIP نیز دریافت کنید. همچنین می‌توانید پروژه‌های مختلفی را با React ،Angular ،Vue ،Node HTTP Server و ... بنویسید.

HTMLCodeEditor

HTMLCodeEditor یک ادیتور آنلاین برای نوشتن کد‌های HTML است که ابزار‌های مفیدی را نیز در اختیار شما قرار  می‌دهد.

HTMLhouse

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

Liveweave

Liveweave یکی دیگر از ادیتور‌های آنلاین است که مانند ادیتور‌های قبل می‌توانید به زبان‌های CSS ،HTML و JS کد بزنید. همچنین یک Tab به نام Library دارد که می‌توانید کتابخانه‌هایی مانند Bootstrap، jQuery، Three JS و ... را در پروژه‌ی خود استفاده کنید.

PlayCode

PlayCode نیز امکاناتی شبیه به Liveweave دارد.

JSFiddle

JSFiddle یکی از  ادیتورهای محبوب آنلاین است که مانند سایر ادیتور‌های آنلاین می‌توانید در آن به زبان‌های تحت وب CSS ،HTML و JS کد بزنید.

jsfiddle سایت برنامه نویسی انلاین

Repl.it

Repl.it محیطی را فراهم می‌کند که می‌توانید علاوه بر زبان‌های تحت وب، به زبان‌های دیگر مانند ++Java، C، C و ... نیز کد بزنید.

ساخت کد html آنلاین

JSBin

JSBin نیز مانند سایر ادیتور‌های آنلاین است و امکانات متعددی را در اختیار شما قرار می‌دهد.

کد نویسی انلاین - ساخت کد html آنلاین

جمع‌بندی:

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

اگر به یادگیری بیشتر در زمینه HTML , CSS و طراحی وب علاقه مند هستی با شرکت در دوره متخصص طراحی وب ، در کمتر از یکسال به یک طراح وب همه فن حریف تبدیل می‌شوی که آماده‌ی استخدام ، دریافت پروژه و کسب درآمد هستی.

 

 

چه امتیازی به این مقاله می دید؟
نویسنده فاطمه افشار
وقتی به برنامه نویسی فکر می کنم ، می رسم به این جمله -> " عشق چیز عجیبیه جدا ! "

نظرات کاربران

افشین زندی

خیلی ممنون از جوابتون. تست کردم الان. تقریبا همون چیزیه که مد نظرمه
فقط اینکه این سرویس محدودیتی برای آی پی ایران که نداره؟
و اینکه من میخوام کاربر بتونه تو همون پست سایت اون کد ها رو ویرایش و نتیجه تغییر رو ببینه؟ میشه برای این مورد هم راهنمایی کنید؟

محمد اسفندیاری

برای ایران محدودیتی نداره ولی اگر بخواید کاری کنید که کاربران بتونن اون رو ویرایش کنن و … باید پول پرداخت کنید و اکانت Codepen خودتون رو Professional کنید
با Pro کردن اکانت امکانات زیاد دیگه ای هم در اختیارتون قرار داده میشه که خیلی بدرد بخور هست
در این لینک میتونین اطلاعات بیشتری بدست بیارید
http://codepen.io/pro/

افشین زندی

خیلی ممنون آقای اسفندیاری. سرویسشون ارزشش رو داره اما الان برای سایت نوپا نمیصرفه. اگه پلاگینی چیزی پیدا کردید لطفا اون رو هم معرفی کنید
تشکر

محمد اسفندیاری

بله پیدا کردم چشم
موفق باشید

افشین زندی

سلام
ممنون بابت مقاله خوبتون
ببخشید برای سایتای وردپرسی همچین پلاگینی وجود داره؟ که بشه تو محتوا، مثلا همین صفحه کد های مختلف رو گذاشت و پیش نمایش اون رو هم دید و یا کاربر بتونه کد ها رو ویرایش کنه؟

محمد اسفندیاری

منظورتون رو دقیقا متوجه نشدم ولی شما مثلا میتونین یک کد رو درون Codepen بنویسید و اون رو درون سایت خودتون Embed کنید تا دیگر کاربران اون رو ببینن.

eli

سلام واقعا مطالب عالی است.ممنون

ارسال دیدگاه
خوشحال میشیم دیدگاه و یا تجربیات خودتون رو با ما در میون بذارید :