خواندن ۴ دقیقه·۴ سال پیش

stackblitz

از تازه ترین تجربیاتم میتونم به یافتن ی ادیتور آنلاین به نام Stackblitz برای فریم ورک ها و زبان های برنامه نویسی مثل

Angular
RxJS
React
Typescript
React typescript
Angular JS
JavaScript

و... اشاره کنم، که خودتون میتونید وارد سایت بشین و ببینینش.

استک بلیز چیه؟

استک بلیتز ی ادیتور زبان برنامه نویسی مثل VScode میمونه که اکثرا برنامه نویسا ازش استفاده میکنن، اما تحت وب کار میکنه! ینی شما میتونین وارد سایتش بشین، فریم ورک یا زبان مدنظرتون روو انتخاب کنین و آنلاین شروع کنین به کدنویسی.

چرا وقتی vscode داریم بریم استک بلیز؟

دلیل استفاده من از استک بلیز این بود که چون نمیتونستم package های مربوط به Angular رو نصب کنم، ازش استفاده کردم تا توی مسیر سخت و زمان بر ی پروژه ی انگولار گیر نکنم. کلا برای نصب و استفاده از فریم ورک ها باید با CLI ساختار اپ یا اضافه کردن package ها رو ایجاد کنین.

اما دلایل دیگه ام داره مثل اینکه:

شما میتونین هر لحظه که اراده کنین از پوشه ها و کدهای از پیش نوشته شده داخل استک بلیز برای ساخت ی پروژه برای فریم ورک ها و کتابخونه ها استفاده کنین و به دردسر زیادی نیوفتین?
هر پروژه ای که داخل استک بلیز ایجاد میکنین ی آدرس یا URL داره که میتونین ازش برای انتشار پروژتون استفاده کنین به این صورت که با زدن روی دکمه share در بالای صفحه میتونین از لینک embed شده اپ نهاییتون استفاده و اون لینک رو داخل تگ <embed> یا <iframe> قرار بدین و روی سیستم خودتون اجراش کنین. همچنین ی سری خصوصیات جالب میتونین برای فایلتون بذارین، مثل گزینه ی preview only یا click to load که ی پیش نمایش نشون میده یا تا وقتی کلیک نکنی نمیتونه اپو ببینی.

خودتون برین و با این گزینه ها کار کنین.?

لیست کارکرد هرکدام از تنطیمات لینک فایل تعبیه شده

برای اینکه اپتونو بتونین ببینین باید:

ی فایل txt. ایجاد کنین و کد پایین رو توش paste کنین (البته داخل قسمت " " لینک خودتون رو جایگذاری کنین) و بعدش save as میزنین و فایلتونو این دفه با پسوند html. ذخیره میکنین. حالا میتونین ادیتور استک بلیز و برنامتون رو توی مرورگر ببینین.?

<!DOCTYPE html>

<html>

    <head>

        <title>embed Tag</title>

    </head>

    <body>

        <iframe src=&quothttps://stackblitz.com/edit/angular-ivy-xwmjzh?embed=1&file=src/index.html&quot

	width=&quot100%&quot

	height=&quot1000&quot></iframe>

    </body>

</html>

همین طور ی لینک تنها از برنامه نوشته شده (APP URL) بهتون میده که زمانیکه برنامتون نوشته شده و نمیخواین کسی توش تغییراتی ایجاد کنه میتونین ازش استفاده کنین.

همینطور میتونین فایل هاییو رو که دارین با drag and drop داخل استک بلیز ویرایش کنین یا خروجیشو ببینین

یکی دیگه از مزایای استک بلیز که موجبات شادمانی منو فراهم کرده اینکه کنار کد های که به صورت آنلاین مینویسین ی پنجره مرورگر هست که به صورت آنلاین خروجی کارتون رو بهتون نشون میده?
همچنین وصل شدن و ارتباطش با github استک بلیز رو به ی ادیتور پرطرفدار تبدیل کرده به طوری که میتونه پروژه شما رو commit and push کنه و چند نفر همزمان بتونن روی یک پروژه کار کنن

اینم از تمام نکات و برداشت هایی که من تونستم از استک بلیز داشته باشم?

اما اگه شما نکته یا خصوصیت دیگه ای راجبش میدونین حتما اول ی اکانت ویرگولی بسازین و بعدش توی کامنت ها بهم بگین تا بتونم به نوشتارم اضافه کنم و اطلاعات کاملی رو باهم در اختیار فارسی زبانان بذاریم.?

استک بلیز stackblitz angular react github

Parisa Fro

شاید از این پست‌ها خوشتان بیاید