Code Module | کد ماژول
1.91K subscribers
357 photos
42 videos
6 files
355 links
Hello World 🌎

<> Earth is programmable if you code it </>

Group 👇🏻
@CodeModuleGap

Contact Us 👇🏻
@MrShahiin
@neoMahan
Download Telegram
فلوچارت چیه و چه کاربردی داره؟

الگوریتم‌ها دارای پیچیدگی‌های مختلفی هستن و پیاده‌سازی کد مربوط به هرکدوم ممکنه کوتاه و یا طولانی و شامل دستورات پیچیده باشه. فلوچارت یک ابزار قدرتمند تجاریه که با طراحی و ساخت مناسب، مراحل یک فرایندو به طور مؤثر و کارآمد منتقل می‌کنه.

‼️نمادهای مهم در رسم فلوچارت چیه؟

🔢 ترمیناتور (Terminator): شروع و پایان فرایندو مشخص میکنه و به شکل بیضی نشون داده می‌شه. هر فلوچارت یک ترمیناتور برای شروع و یکی برای پایان داره.

🔢 فرایند (Process): به شکل مستطیل که برای نمایش دستورات معمولی مثل دستورات محاسباتی و انتسابی استفاده میشه.

🔢 تصمیم (Decision): تصمیم‌گیری برای برقراری شرط هست که با لوزی نشون داده میشه. این مرحله دو خروجی متفاوت وابسته به پاسخ شرط داره.

🔢 ورودی (Data):ورودی‌ها به شکل متوازی الاضلاع نشون داده می‌شن.

🔢 سند (Document): برای نمایش خروجی و گزارش نهایی از چهارضلعی منحنی استفاده می‌شه.

🔢 ارجاع به درون برنامه (On-Page Reference): به شکل دایره که حرفی درون اون قرار گرفته نمایش داده می‌شه و به معنی پایان این مرحله در این فلوچارت و لزوم ادامه اون تو فلوچارت دیگه ای هست.

🔢 تاخیر یا انتظار (Delay or wait): به شکل یک نیمه بیضی که به معنی انتظار و وقفه در انجام فراینده.


🔵 مزایای فلوچارت برنامه‌نویسی:

فلوچارت‌ها روش بهتری برای برقراری ارتباط منطقی سیستم هستن.

فلوچارت‌ها به‌عنوان یک راهنمای برای طرح اولیه در طول طراحی برنامه عمل می‌کنن.

فلوچارت‌ها به فرآیند اشکال‌زدایی کمک می‌کنن.

با کمک فلوچارت می‌توان برنامه‌ها را به‌راحتی تحلیل کرد


⬇️معایب فلوچارت برنامه‌نویسی:

ترسیم فلوچارت برای برنامه‌های بزرگ و پیچیده دشوار است.

در فلوچارت برنامه نویسی هیچ استانداردی برای تعیین میزان جزئیات وجود ندارد.

اصلاح فلوچارت بسیار دشوار است.


#programming #flowchart #basic
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4❤‍🔥22
5 صفت یا attribute برای html که کسی اونا رو بهت نمیگه🔥⬇️


1⃣ صفت Accept

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

<input type="file" name="CodeModule" accept=".jpg,.png,.doc">


🔢 صفت Loading

شما میتونین از صفت loading در تگ <img> برای کنترل نحوه بارگذاری تصویر توسط مرورگر استفاده کنید که شامل دو مقادیره:

مقدار eager: مقدار پیش فرض تگ img هست که همزمان با load صفحه وب، تصویر هم load میشه.

مقدار lazy: زمانی که صفحه وب load شد، تصویر هم با اسکرول شما load میشه.

<img loading="lazy" src="image.jpg" alt="CodeModule" />


🔢 صفت Multiple

شما میتونین از صفت multiple برای تگ های <input> و <select> استفاده کنین تا به کاربران اجازه بدید چند مقدار را همزمان انتخاب کنن.

<input type="file" id="CodeModule" name="attribute" multiple>
<select name="attribute" id="CodeModule" multiple></select>


🔢 صفت Title

شما میتونین از صفت title برای ارائه اطلاعات اضافی درباره یک تگ استفاده کنید. این اطلاعات معمولا زمانی که کاربر ماوس رو روی یه تگ نگه داره یا اصطلاحا عمل hover کردن و انجام بده، نمایش داده میشه.
این صفت یک global attribute هست.

<p title="Free Web tutorials">CodeModule</p>


🔢 صفت Contenteditable

با استفاده از این این اتربیوت میتونیم مشخص کنیم که محتوای یک تگ قابل ویرایش باشه.


مثلا اگر یک پاراگراف و قابل ویرایش کنیم کاربر میتونه محتوای اون پاراگراف و به سلیقه خودش تغییر بده.
این صفت یک global attribute هست.

<p contenteditable="true">منو ویرایش کن</p>


#html #attribute
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
👌6🔥52❤‍🔥1
Good Night 🌚

"همه‌ی رویاهای ما میتونن به حقیقت بپیوندن، اگر جرات دنبال کردنشون و داشته باشیم"

@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
❤‍🔥7
سواگر (Swagger) در مقابل Postman | کدوم بهتره؟🤔


پلتفرم Swagger و Postman دو راه حل بنیادی هستن که در ساده سازی فرآیندهای پیچیده طراحی، آزمایش و مستندسازی API ها نقش اساسی دارن. هر دو اهداف مشترکی دارن اما ویژگی هایی دارن که اونا رو متمایز میکنه. در این مقاله، تفاوت‌های اصلی بین Swagger و Postman و بررسی می‌کنیم.


برخی نکات مثبت Postman⬇️

توانایی Postman برای برنامه‌ریزی و اجرای مجموعه‌ها در فواصل زمانی از پیش تعریف‌شده، امکان نظارت مستمر API را فراهم می‌کنه و اطمینان حاصل می‌کنه که API‌های شما کارآمد و قابل اعتماد باقی می‌مانند.

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

پشتیبانی Postman از اسکریپت نویسی با استفاده از جاوا اسکریپت به کاربران این امکان و میده که اسکریپت های آزمایشی سفارشی ایجاد کنن و سناریوهای آزمایش API پیچیده را خودکار کنند.

پلتفرم Postman ویژگی های همکاری قوی رو ارائه میده، از جمله توانایی به اشتراک گذاری مجموعه ها و محیط ها، که اونو به ابزاری ارزشمند برای تیم ها تبدیل می کنه. ادغام آن با سیستم های کنترل نسخه، همکاری و مدیریت پروژه را افزایش می دهد.


برخی نکات مثبت Swagger⬇️

فرمت مشخصات Swagger زبان شناس هست و آن را با طیف گسترده ای از زبان های برنامه نویسی سازگار می کند و توسعه API را در زبان انتخابی امکان پذیر می کند. تولید اسناد API بر اساس مشخصات OpenAPI ‌ خودکار می کنه، در زمان صرفه جویی، و خطر قدیمی شدن اسناد و کاهش میده.

ابزار Swagger می‌تونه درخواست‌ها و پاسخ‌های API را در برابر مشخصات مستند تأیید کنه و به شناسایی و اصلاح مشکلات در مراحل اولیه توسعه کمک می‌کنه. این برنامه از تولید کد برای کتابخانه های کلاینت و خرد سرور پشتیبانی می کنه که تضمین میشه برنامه های کلاینتی به خوبی با API هماهنگ هستن و احتمال خطاهای یکپارچه سازی و کاهش میدن.

این نرم افزار با سایر ابزارهای توسعه و آزمایش ادغام میشه، اتوماسیون، پوشش تست و کارایی کلی را در گردش کار توسعه API افزایش میده.

در آخر Swagger یا Postman کدوم کارآمد تره؟ 🤔


انتخاب بین Swagger و Postman به نیازهای خاص شما در طیف توسعه و آزمایش API بستگی داره.

پلتفرم Postman به عنوان یک ابزار همه کاره و کاربر پسند که برای تست API، اتوماسیون و همکاری طراحی شده، می درخشد. از طرف دیگه، Swagger که اکنون به عنوان OpenAPI Specification شناخته میشه، در طراحی و مستندسازی API برتری دارد.


#postman #swagger
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
3🔥3❤‍🔥1
دنیای موازی 😂😂😂


#fun
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
😁11
احراز هویت با jwt 🗝🔒

در واقع JSON Web Token یا JWT یک استاندارد وب هست که روشی فشرده و خود شمول (self-contained) رو جهت انتقال امن اطلاعات بین مقصد های مختلف رو توسط یک شی JSON تعریف می‌کنه. این اطلاعات قابل تصدیق و اطمینان هستن، از این‌ رو که به صورت دیجیتال امضا می‌شن. JWT ها توسط یک کلید خصوصی (با استفاده از الگوریتم HMAC) و یا یک جفت  private key یا public key (توسط الگوریتم RSA) قابل امضا شدن هستن.


دو روش کلی و پرکاربرد اعتبارسنجی سمت سرور، برای برنامه‌های سمت کاربر وب وجود داره⬇️


روش اول Cookie-Based:

برای Authentication جزو پرکاربردترین روش ها هست و تو این حالت به ازای هر درخواست، یک کوکی برای اعتبارسنجی کاربر به سمت سرور ارسال میشه (و برعکس).

روش دوم Token-Based:

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


مزیت‌های استفاده‌ی از روش مبتنی بر توکن چیه؟

🔵وابستگی به domain صدورش نداره و اصالتش بر اساس روش‌های رمزنگاری تصدیق می‌شه

🔵در حین کار با توکن‌ها، نیازی به ذخیره‌ اطلاعات داخل session سمت سرور نیست چون توکن، خود شمول (self-contained) هست.

🔵امروزه همینقدر که استاندارد JSON Web Token رو پیاده سازی کرده باشید، امکان کار با انواع و اقسام پلتفرم‌ها و کتابخانه‌ها رو هم دارید.

🔵حین استفاده از روش مبتنی بر توکن، امکان توزیع تمام فایل‌های برنامه (جاوا اسکریپت، تصاویر و غیره) توسط CDN وجود داره.


پ.ن: خود شمول به معنای اینه که payload توکن، شامل تمام اطلاعات مورد نیاز جهت اعتبارسنجی یک کاربره تا دیگه نیازی به کوئری گرفتن هر باره‌ از دیتابیس نباشه ( تو این روش مرسومه که فقط یکبار از دیتابیس کوئری گرفته بشه و اطلاعات مرتبط با کاربر رو امضای دیجیتال، و بعد ارسال می‌کنه )


#jwt #web #token #json
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥5👌42
پردازشگر PostCSS چیه و چه کاربردی
داره؟
🧐

خب PostCSS یک پردازشگر مدرن css هست که وابسته به پلاگین هاییه که با جاوا اسکریپت براش نوشته شده.
میشه گفت PostCss امکانات بیشتری نسبت به Preprocessor ها در اختیار ما قرار میده البته این نکته هم فراموش نشه که شما می تونید PostCss رو به همراه Preprocessor ها هم استفاده کنید.
البته توجه داشته باشید که PostCss یک preprocessor نیست.

برای مثال تو یک پروژه نیاز دارید توی css متغیر بنویسید ، برای این کار یک پلاگین به اسم postcss-simple-vars وجود داره که این امکان رو به css اضافه می کنه.


$dir:    top;
$blue: #056ef0;
$column: 200px;

.menu_link {
background: $blue;
width: $column;
}
.menu {
width: calc(4 * $column);
margin-$(dir): 10px;
}

خروجی کد بالا که به css کامپایل شده:

.menu_link {
background: #056ef0;
width: 200px;
}
.menu {
width: calc(4 * 200px);
margin-top: 10px;
}


🔵در حال حاضر بیش از ۲۰۰ پلاگین برای PostCSS وجود داره که لیست اون هارو می تونید از تو Github یا سایت postcss.parts ببینید.


چرا باید از PostCSS استفاده کنیم؟


1️⃣سرعت: کامپایل سریعتر نسبت به Preprocessor ها.

2️⃣ماژولار: شما بر اساس نیاز پروژه می تونید پلاگین های مختلفی اضافه کنید.

3️⃣قدرت: وجود بیش از ۲۰۰ پلاگین که این ابزار رو قدرتمند و کاربردی تر می کنه.


⚡️سرعت کامپایل PostCss و در مقایسه با سایر ابزار ها میتونید مشاهده کنید ⬇️

PostCSS 5.0.11: 40 ms
PostCSS 5.0.10: 60ms (1.5 times slower)
Rework: 75 ms (1.9 times slower)
libsass: 76 ms (1.9 times slower)
Less: 147 ms (3.7 times slower)
Stylus: 166 ms (4.1 times slower)
Stylecow: 258 ms (6.4 times slower)
Ruby Sass: 1042 ms (26.0 times slower)


#css #styling
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥7👌42
در کمتر از ۵ دقیقه، پروژتون و روی سرور
اجرا کنید
☁️

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


⬇️مهم ترین ویژگی های لیارا ⬇️


🔵هاست رایگان برای انواع وبسایت

فرقی نداره پروژتون و با Node توسعه دادید یا Next.js و Django، در لیارا می‌تونید به صورت رایگان از تمامی سرویس ها استفاده کنید.


🔵مستنداتی که خواب آور نیست

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


🔵پشتیبانی فنی حرفه‌ای

تو لیارا همیشه متخصصین فنی آماده‌ی پاسخگویی به سوالات شما هستند.


🔵طراحی‌شده برای سادگی

تبدیل پیچیدگی‌ها به سادگی، در DNA تیم لیارا هست. لیارا هر فرآیند سختی رو به فرآیندی لذت‌بخش تبدیل می‌کنه.


🔵زیرساخت همیشه در دسترس

لیارا با استفاده از شیوه‌های مدرن DevOps، زیرساختی طراحی کرده‌ که سرویس‌های شما رو همیشه در دسترس نگه خواهد داشت.


🔵کیفیت و پایداری

معماری زیرساخت لیارا، تشکیل شده از زنجیره‌ای از سرور‌های به‌هم متصل که باعث افزایش کیفیت و پایداری سرویس‌ها می‌شود.


Website 🌐

#liara #host
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4👌32❤‍🔥1
Please open Telegram to view this post
VIEW IN TELEGRAM
💔6🔥3👌3❤‍🔥1
اگ تو توسعه پروژتون نیاز به بک اند و دیتابیس داشتید، اما به هر دلیلی دسترسی به بک اند کار نداشتید، میتونید از ابزاری به نام Json-Server استفاده کنید و Api های مورد نیاز پروژتون و توسعه بدید.


خب JSON Server چیه؟ 🤨

کلمه JSON مخفف عبارت JavaScript Object Notation هست و یک ابزار Node.js سبک و با کاربری آسونه که یک API RESTFUL و با استفاده از یک فایل JSON به عنوان data source شبیه‌سازی می‌کنه. توسعه‌ دهنده های فرانت‌اند با کمک JSON Server می‌تونن APIهای ساختگی و بدون نیاز به نوشتن کدهای پیچیده سمت سرور یا زمانی که API پشتیبان هنوز آماده نیست ایجاد کنن.

این API ساختگی درخواست‌ها رو به endpoint ای که تنظیم میکنید ارسال می‌کنه، به درخواست‌های HTTP پاسخ میده و به این ترتیب کار و برای توسعه سریع برای توسعه‌دهندگان ایده‌آل می‌کنه. JSON Server همچنین توسعه‌دهندگان و قادر می‌سازخ تا عملیات CRUD و انجام بدن و داده‌ها رو در فایل‌های JSON ذخیره کنند.


ویژگی‌های JSON Server⬇️

🔵راه‌اندازی آسان و سریع

🔵پشتیبانی از CRUD

🔵قدرتمند و ساده

🔵شبیه سازی داده ها


عملکرد Json server مثل یه بک‌اند واقعی هست. از این به بعد به جای استفاده از دیتابیس هایی مثل firebase که تحریم و مشکلاتی داره... میتونید از جیسون سرور، برای توسعه نمونه کار های خودتون استفاده کنید.
بهتون پیشنهاد میکنم نحوه نصب و استفاده رو تو داکیومنتش مطالعه کنید😀


Document 🌐

#json_server #database
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
❤‍🔥53👌2
This media is not supported in your browser
VIEW IN TELEGRAM
خلاصه که دنبال راه میانبر نباشید 😂😔

#fun
@CodeModule
😁4👌3
💻 حذف کامل یک اپلیکیشن در ویندوز

حتما براتون پیش اومده که برنامه ای از روی ویندوز حذف کردید، اما بعد از حذف کردن هنوزم بخشی از هاردتون رو اشغال کرده و یا با نصب دوباره اون برنامه، با مشکل مواجه شدید !
تو این پست می‌خوام برنامه ای و بهتون معرفی کنم، که اپلیکیشن مد نظرتون و از ریشه پاک میکنه.


⚡️ برای حذف کامل یک برنامه، مراحل زیر رو دنبال کنید :


1️⃣ وارد مرورگرتون بشید و Geek for windows و سرچ کنید

2️⃣ برنامش رو دانلود و نصب کنید (حجمش سه مگ بیشتر نیست)

3️⃣ حالا وارد برنامه بشید و اون اپلیکیشنی رو که میخواید پیداش کنید

4️⃣ روش راست کلیک کنید و رو گزینه uninstall کلیک کنید

5️⃣ حالا منتظر باشید تا برنامه پاک بشه ؛ علاوه بر این تمام برنامه هایی که به اون اپ وابسته هستن پاک میشن.


لینک دانلود

#tools
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥53😁1
🔵وب سوکت چیه و چه کاربردی داره؟

وب سوکت یک پروتکل ارتباطیه که کانال های ارتباطی دو طرفه رو از طریق یک اتصال TCP برقرار می کنه. این امکان برقراری ارتباط بی‌ درنگ و رویداد محور بین یک کلاینت و یک سرور و فراهم می‌کنه.

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

مزایای وب سوکت:

◀️ارتباط دوطرفه
◀️کاهش تاخیر
◀️کاهش ترافیک شبکه
◀️افزایش سرعت و کارایی
◀️پشتیبانی از cross-domain

معایب وب سوکت:

◀️پشتیبانی از مرورگر : اگرچه اکثر مرورگرهای مدرن از WebSockets پشتیبانی میکنن، اما بعضی از مرورگرهای قدیمی اینطور نیستن. این میتونه دسترسی برنامه شما رو محدود کنه و به مکانیسم های بازگشتی اضافی برای مرورگر های قدیمی نیاز داشته باشه.

◀️محدودیت‌های پراکسی و فایروال : برخی از سرورهای پراکسی و فایروال‌ها ممکنه اتصالات WebSocket رو مسدود کرده یا در اون اختلال ایجاد کنن.

◀️مقیاس پذیری : سوکت های وب یک ارتباط دائمی بین مشتری و سرور برقرار میکنن، که می تونه منابع سرورو در هنگام برخورد با بسیاری از اتصالات همزمان تحت فشار قرار بده.

◀️حالت Stateful Nature : بر خلاف HTTP سنتی که بدون حالته، WebSocket ها حالت دارن. این به این معنیه که سرور باید وضعیت اتصالو برای هر مشتری حفظ کنه که منجر به افزایش استفاده از حافظه و چالش‌های بالقوه مقیاس‌ پذیری می‌شه.

◀️ملاحظات امنیتی : با اتصال مداوم ایجاد شده توسط WebSockets، نیاز به اقدامات امنیتی مناسب برای محافظت در برابر آسیب‌ پذیری‌ های احتمالی،  (XSS) و (CSRF) وجود داره.

برای یادگیری این تکنولوژی می‌تونید به Reference معتبر زیر مراجعه کنید. ⬇️


Document 🌕

#protocol #websocket #web 
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥42👌2❤‍🔥1
بفرست براش 🌝💙

@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
❤‍🔥5
دنبال ایده یا نمونه پروژه های حرفه ای هستی؟ 🤔

تو repository زیر، فهرستی از زبان های برنامه نویسی قرار داده شده که هر کدوم دارای پروژه های کوچیک و بزرگی هستن. اگه به دنبال ایده یا مشتاق یادگیری هستید پیشنهاد میکنم حتما یه سر به این repository بزنید.


project-based-learnin 🌪


#repository #github
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥3❤‍🔥2👌2
میدونید چرا کیبورد هیچوقت نمیخوابه ؟
چون داره دو شیفت کار میکنه 😂

#fun
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
😁123
پلتفرم Appwrite چیه و چرا باید یادش بگیریم؟

در واقع Appwrite یک پلتفرم متن‌بازه که به توسعه‌ دهنده ها (به خصوص برنامه‌نویسان front-end) این امکانو میده که برنامه‌هاشونو خیلی سریع‌تر از قبل توسعه بدن. هدف اصلی پلتفرم Appwrite جداکردن و ساده‌سازی تسک‌های back-end در توسعه بخش front-end برنامست و همین کار باعث میشه تا روند توسعه برنامه، سرعت قابل توجهی پیدا کنه.

پلتفرم Appwrite به توسعه‌دهنده این امکانو میده که به سادگی بتونه قابلیت‌هایی همچون احراز هویت (Authentication)، پایگاه‌داده‌ها (DataBases)، توابع (Functions) و فضای ذخیره‌سازی (Storage) رو به پروژه‌هاشون اضافه کنه🔥

شعار این پلتفرم محبوب، توسعه back-end برنامه، بدون عذاب و کار اضافیه. این پلتفرم تو کمپانی‌های بزرگی از جمله Apple، oracle، TikTok، intel و bosch مورد استفاده قرار گرفته.

‼️با استفاده از Appwrite، شما قادر خواهید بود که قابلیت‌هایی که پایین قید شده رو به پروژتون اضافه کنید:

◀️احراز هویت کاربر (User Authentication)

◀️روش‌های مختلف ورود و ثبت نام کاربران

◀️دیتابیس برای ذخیره‌سازی و سازماندهی

◀️توابع مختلف در برنامه


اگر طبق مستندات Appwrite جلو بریم، Appwrite برای این طراحی نشده که جایگزین تیم back-end توسعه یک برنامه بشه. بلکه هدف از طراحی این پلتفرم تجربه توسعه بهتر و شروع قوی‌تر پروژه‌های بزرگه.

Document 🌕

#platform #database #appwrite
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥32👌2
به اشتراک گذاشتن localhost با ngrok

ابزار ngrok بهتون کمک می‌کنه تا لوکال هاست خودتون و تو فضای اینترنت ارائه و همچنین میتونید باهاش تونل چند منظوره بسازید‌. این سرویس یک نرم افزار پروکسی معکوسه و در حالی که همه ترافیک‌ها رو برای بازرسی و پخش مجدد ضبط می‌کنه، از یک اندپوینت عمومی، مانند اینترنت به یک سرویس شبکه محلی در حال اجرا تونل‌های امن می‌سازه.

به عبارت دیگر برنامه ngrok برنامه‌ای هست که دسترسی خارجی (یا همون دسترسی از طریق اینترنت) به سیستم‌های شخصی که پشت یک NAT یا فایروال پنهان شدن، امکان‌پذیر می‌کنه. این برنامه اساسا یک تونل TCP ساده و رمزگذاری‌شده هست؛ این تونل یک آدرس اینترنتی و فراهم می‌کنه که هرکسی می‌تونه به اون دسترسی داشته باشه، و سپس سمت دیگه تونل به سرویسی متصل بشه که به صورت محلی (local) در حال اجراست.

ایجاد تونل‌های امن به لوکال هاست با استفاده از ngrok 🔥

همونطور که گفتم ngrok یک ابزار سبک و فوق‌العاده هست، یک تونل امن روی دستگاه لوکال شما ایجاد می‌کنه و یک URL عمومی به شما میده که می‌تونید از اون برای دستیابی به سایت لوکال خود استفاده کنید.

زمانی که ngrok در حال اجرا هست، به همان پورتی که سرور لوکال وب شما روش اجرا میشه گوش می‌کنه و درخواست‌های خارجی رو به دستگاه لوکال شما پروکسی خواهد کرد.

بعد از دانلود ngrok، یک فایل آرشیو دریافت می‌کنید که باید اونو extract کنید. بعد از این که محل ذخیره اونو انتخاب کردید، یک گام ساده باقی میمونه تا اونو وادار کنید که به وب سرور شما گوش بده. باید بهش بگید که شما وب سرور لوکال خودتون و روی پورت ۸۰۸۰ تنظیم کرده‌اید. برای این کار کافیه در ترمینال تایپ کنید: ngrok http 8080. این باعث میشه که این نرم‌افزار شروع به گوش دادن روی پورت ۸۰۸۰ کرده و یک تونل امن ایجاد کنه.


Download 🌐

#ngrok #localhost
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥42❤‍🔥1
Good Night 🌚

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

@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
❤‍🔥43👎1
با Autoprefixer بیشتر آشنا بشید🔵

از ابزار Autoprefixer برای افزودن پیشوندهای مرورگر (vendor prefixes) به کدهای CSS به منظور حمایت از مرورگرهای قدیمی و جلوگیری از مشکلات سازگاری مرورگرها استفاده میشه. این ابزار به طور خودکار پیشوندهای مرورگرها رو به کدهای CSS شما اضافه می‌کنه.

کد زیر و در نظر بگیرید:

div { 
transition: all 1s ease;
}


برای اینکه این استایل بهترین پشتیبانی و در مرورگرهای مختلف داشته باشه باید به صورت زیر پیشوندگذاری بشه:

div {   
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease; ‌ -o-transition: all 1s ease;
transition: all 1s ease;
}


قبلنا برای اینکه مجبور به نوشتن پیشوندها به صورت دستی نباشیم از ابزارهایی مثل پلاگین های Sublime استفاده می کردیم. به مرور با بوجود آمدن پیش پردازنده هایی (preprocessor) مثل Sass و Less یا Stylus می تونستیم از mixin ها برای اضافه کردن پیشوندها استفاده کنیم.

اما این روزها بازار ابزارهایی مثل Grunt و Gulp داغ هست و میشه از بسته هایی که برای این ابزارها نوشته شده برای کارهای مختلف استفاده کرد. یکی از این بسته ها Autoprefixer هست که معروف ترین ابزار این روزها برای نوشتن پیشوندها هست و گوگل استفاده از این ابزار و توصیه می کنه 💀

برتری که Autoprefixer نسبت به دیگر ابزارهای پیشوندگذاری داره اینه که بر اساس تنظیماتی که ما براش در نظر می گیریم و بر اساس آماری که از سایت caniuse داره، عملیات پیشوندگذاری و انجام میده.


اطلاعات بیشتر و نحوه استفاده از این ابزار و میتونید تو این مقاله مطالعه کنید⚡️


#autoprefixer #css
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
3🔥2
🌾 همه چیز راجب وب سرور Nginx

در واقع Nginx که به صورت engine-ex تلفظ میشه، یک وب سرور اوپن سورسه‌ که از زمان ارائه موفق و اولیه خود به عنوان وب سرور، کاربرد داشته و امروزه به عنوان پروکسی معکوس، حافظه کش HTTP و سیستم(Load Balancing) تو انواع سرور مجازی هم استفاده میشه.

تفاوتی نداره که شما سرور مجازی آلمان رو دارید یا سرور مجازی ایران، در همه موارد می‌تونید از Nginx استفاده کنید.

با پیشرفت تکنولوژی های در بستر وب، وب سرور NGINX هم همراه با اون رشد کرده و امروزه از تمام اجزای وب مدرن، از جمله WebSocket، HTTP / 2، gRPC و پخش چند فرمت ویدیویی (HDS، HLS، RTMP و سایر موارد) هم پشتیبانی میکنه. همچنین در صورت نیاز به خرید ssl هم می‌تونید به راحتی روی سرور nginx اونو نصب کنید.


چند تا از مزایای Nginx


🔢 تجربهٔ‌ کاربری بهتر

استفاده از انجین ایکس زمان انتظار کاربران برای بارگذاری وب‌سایت رو کاهش میده و اینجوری تجربۀ کاربری ارزشمندی برای اونا میسازه.

🔢 سرعت بالاتر

با هدایت ترافیک به سرورهای مختلف، علاوه‌بر افزایش سرعت وب‌سایت، عملکرد اون هم ارتقا پیدا می‌کنه. سرعت بالا به‌جز برای سئو سایت در ساختن تجربه کاربری بهتر هم موثره.

🔢 قیمت به‌صرفه و خوب

این وب‌سرور نسبت به سایر وب‌سرورها قیمت معقول تری داره.

🔢 مدیریت درخواست‌های زیاد

همونطور که بالاتر ذکر کردیم، یکی از مهم‌ترین مزیت‌های انجین ایکس رسیدگی همزمان به تعداد زیاد درخواست‌هاست.

🔢 ارتقا در زمان اجرا

اگر از nginx به‌عنوان وب‌سرور استفاده می‌کنید،‌ نیازی نیست نگران اختلال‌های احتمالی در زمان ارتقا باشید. این وب‌سرور در هنگام ارتقا تو عملکردش اختلالی ایجاد نمیشه.


چند تا از معایب Nginx


از nginx انتظار ندارید که گل بی‌خار باشه! انجین ایکس هم مثل همه وب‌سرورهای دیگه معایبی داره مثل:

🔢 به‌روزرسانی‌های کم و ویژگی‌های محدود

از آنجایی که افراد کمتری از این وب‌سرور استفاده می‌کنند، به‌روزرسانی‌هایی که این سازمان ارائه می‌کند نسبت به سایر رقبا کمتر است و ویژگی‌های کمتری روی وب‌سرور در اختیار کاربران قرار می‌گیرد.

🔢 نیاز به دانش فنی بالا

کار کردن با وب سرور انجین ایکس کار هر کسی نیست! تنها افرادی که اطلاعات فنی نسبتاً خوبی دارن می‌تونن از کار کردن با این وب‌سرور لذت ببرن.

⚡️به عنوان جانشین Nginx از چه وب سرور هایی میشه استفاده کرد؟

🔵وب سرور MS IIS
🔵وب سرور Apache
🔵وب سرور lite speed

اگر سایت بزرگ و پربازدیدی دارید، Nginx همون وب‌سروریه که به کار شما میاد؛ چرا که می‌تونه به‌طور هم‌زمان هزاران درخواست مخاطبان وب‌سایت شمارو پردازش کنه، بدون اینکه سرعت وب‌سایت کاهش پیدا کنه.


#nginx #webserver #web
@CodeModule
Please open Telegram to view this post
VIEW IN TELEGRAM
4🔥3