2 محیط کدنویسی رایگان برای توسعه React بصورت آنلاین



visibility  
mode_comment   ۰

2 محیط کدنویسی رایگان برای توسعه React بصورت آنلایندر این مطلب میخوام 2 محیط کدنویسی رایگان برای توسعه React بصورت آنلاین رو بهتون معرفی کنم که با استفاده از اونا بتونین با سرعت بیشتری با React کار کنید.

هر کدام از مواردی که در ادامه معرفی میشن دارای مزایا و معایبی هستند که خودتون بسته به نیازتون میتونین از اونا استفاده کنید.

1. سایت CodeSandbox

سایت CodeSandbox یکی از بهترین راه‌ها برای کار کردن با Component ها بصورت آنلاین است. این ابزار بصورت اتوماتیک پیش‌نیازها یا Dependency های پروژتون رو مدیریت میکنه و خودش کدهای JSX و ES6 و ... رو Transpile میکنه شما به راحتی با یک کلیک میتونین پروژه خودتون رو شروع کنید و مواردی رو که میخواید با سرعت تست کنید.

وقتی که کار مورد نظرتون رو انجام دادید به راحتی میتونین با استفاده از امکاناتی که وجود داره، اون رو با دیگران به اشتراک بزارید. با استفاده از این سایت میتونین کارهای زیاد دیگه‌ای هم انجام بدین. میتونین به Github وصل بشید و پروژه‌هاتون رو با استفاده از CodeSandbox تست کنید. این ابزار فقط مخصوص React نیست و با استفاده از اون میتونین Vue و Angular و ... رو نیز تست کنید.

خب فرض کنید من میخوام یک پروژه React رو شروع کنم. برای اینکار در صفحه اول بر روی مکعب آبی رنگ کلیک میکنیم تا React انتخاب بشه:

با اینکار React انتخاب میشه:

میتونین با کلیک بر روی Explore examples میتونین مثالهای مختلفی که کاربرای دیگر به وجود آوردن ببینید و از اونا ایده بگیرید و روی اونا تمرین کنید. همچنین میتونین با کلیک بر روی Open react یک پروژه جدید React رو شروع کنید و کارهای مورد نظرتون رو در اون انجام بدین.

متخصص جاوا اسکریپت
با جاوا اسکریپت جادوگری کنید! آیا می دونید با زبان جاوااسکریپت می تونید، برای فرانت اند و بک اند وبسایت ها برنامه نویسی کنید؟ همینطور اپلیکیشن دسکتاپ و موبایل بسازید؟ اگر دوست داری اینکارها رو انجام بدی و React, ElectronJS, ReactNative, NodeJS,MongoDB و ... رو تو یه دوره یاد بگیری، متخصص جاوااسکریپت سون لرن رو حتما ببین : متخصص جاوا اسکریپت arrow_back

2. سایت StackBlitz

سایت StackBlitz یک IDE آنلاین هست که بر پایه Visual studio code به وجود اومده است. تقریبا مثل CodeSandbox میتونین در اینجا هم پروژه‌های مختلفی رو با ابزارهای React و Vue و ... به وجود بیارید. برای اینکه یک پروژه React رو شروع کنید بر روی React کلیک کنید:

با اینکار یک پروژه React برای شما ساخته میشه:

اگر با Visual studio code کار کرده باشید با محیط این سایت به خوبی ارتباط برقرار خواهید کرد چون این سایت بر پایه VSCode ساخته شده است. با کلیک کردن بر روی هر فایل میتونین محتویات اون رو ببینید و اونا رو ویرایش کنید و در همون لحظه خروجی رو در مرورگر شبیه‌سازی شده سمت راست مشاهده کنید.

در گوشه راست و پایین Console وجود داره و میتونین خروجی‌های مورد نظرتون یا ارورها رو مشاهده کنید.

با استفاده از مورد 1 میتونین پروژه رو دانلود کرده و بر روی سیستم خودتون از اون استفاده کنید. با استفاده از مورد 2 هم میتونین پیش‌نیازها یا Dependencies های دیگه‌ای که نیاز دارید رو به پروژه خودتون اضافه کنید.

در نهایت با استفاده از گزینه Share میتونین کدهایی که نوشتید رو با افراد دیگر یا دوستانتون به اشتراک بزارید. گزینه‌های مختلفی وجود داره که با استفاده از اونا میتونین مشخص کنید که چه بخش‌هایی نشون داده بشه و ...

این سایتها امکانات دیگه‌ای همچون Deploy کردن با استفاده از Google firebase و Hot reloading و ... رو دارن که خودتون با کار کردن با اون بیشتر باهاشون آشنا میشید.

comment دیدگاه کاربران

نیاز به لاگین

برای ارسال دیدگاه و یا پرسیدن سوال خود در این قسمت، باید در سایت لاگین شوید.