#WhatsThat #strapi

●● آشنایی با هدلس CMS جذاب Strapi 🚀 ●●

اِستِرَپی یک Headless CMS محبوب و جذابه که با NodeJS ساخته شده و بهتون این امکان رو میده که به راحتی APIهای سفارشی بسازید و مدیریتشون کنید.

مهم‌ترین ویژگی Strapi انعطاف‌پذیری بالای اون در ایجاد و مدیریت محتواس اگر علاقه مندید خیلی سریع و ساده بکند سایتتون رو بزنید پیشنهاد میکنم ازش استفاده بکنید ⚡

Channel | Group | YouTube

#reactjs #react_icons

●● چرا React Icons یه انتخاب مناسبه ؟ ●●

چون یک لایبرری فوق‌العاده برای React و NextJs هستش که به شما این امکان رو می‌ده تا به سادگی از مجموعه گسترده ای از آیکون‌ها با قابلیت سفارشی‌سازی بالا استفاده کنید.

مهم ترین ویژگیش اینه که مجموعه بزرگی از آیکون های معروف مثل FontAwesome، Material Design و ... رو داخل خودش جمع آوری کرده و جواب هر نیازی رو میده 🚀

🌐 مشاهده داکیومنت React-Icons

Channel | Group | YouTube

برای حمایت ازمون شیر و ری‌اکشن یادتون نره چون بهمون انرژی میده تا پستای بیشتر و با کیفیت تری بزاریم 😊❤️

#PWA

- میدونید PWA چیه ؟؟؟

#WhatsThat #PWA

●● تکنولوژی PWA چیست ؟! ●●

تکنولوژی Progressive Web Application  یا به اختصار PWA نوعی نرم‌افزاره که با استفاده از تکنولوژی‌های وب مثل HTML ،CSS ،JavaScript و Web Assembly ساخته می‌شه، اما تجربه‌ای شبیه به اپلیکیشن‌های موبایل رو بهتون ارائه می‌دهد.

ویژگی های کلیدی 🚀

➊ قابل نصب : کاربران می‌توانند این اپلیکیشن‌ها رو از طریق مرورگر نصب کنند و به آیکونش رو در صفحه اصلی دستگاه خود داشته باشند‌

➋ کارکرد آفلاین : وقتی اینترنت قطع باشه، PWA می‌تونه به کمک "سرویس ورکر"ها (Service Workers) کار بکنه.

➌ به‌روزرسانی خودکار : این اپلیکیشن‌ها همیشه به‌روز هستند و نیازی به آپدیت دستی ندارند.

➍ امنیت بالا : PWA فقط از طریق HTTPS عرضه می‌شه، یعنی ارتباطات بین کاربر و سرور رمزگذاری شده و امن است.

مزایای PWA ✅

➊ صرفه‌جویی در زمان و هزینه : یک بار توسعه برای همه پلتفرم‌ها کافی است.

➋ حجم کم‌تر : نسبت به اپلیکیشن‌های بومی، PWA حجم کمتری داره و سریع‌تر دانلود و نصب می‌شود.

➌ دسترسی آسان : کاربران بدون نیاز به فروشگاه‌های اپلیکیشن، به راحتی می‌تونند اپلکیشن های PWA را نصب و استفاده کنند.

در کل PWA ترکیبی از بهترین ویژگی‌های وب و اپلیکیشن‌های موبایل رو بهتون ارائه می‌دهه و تجربه کاربری رو بهبود می‌بخشه⚡

Channel | Group | YouTube

اگر دوست داشتید با ری‌اکشناتون بهمون انرژی بدید 🔥❤️

#css #animation

●● آشنایی با Keyframes ها در CSS ! ●●

با استفاده از Keyframes ها در CSS میتونید انیمیشن‌های جذاب و کاربردی با دستورای CSS بسازید و خیلی ساده با درصدها یا کلمه کلیدی (from, to) تغییرات استایل را در طول انیمیشن مشخص می‌کند.

نکته مهمی که هست اینه که بعضی از کامپوننت هارو با تیلویند در اختیارتون قرار میده و اگر هم نبود میتونید بدید چت جی‌پی‌تی و بهش بگید تبدیلش کنه به کد tailwind ⚡

🆔 Channel | Group | YouTube

#fun

- این قشنگ بود 🤣

🔸 پنج شنبه ها برای شادی روح اموات این کد رو ران بکنید

if(!mom.isAlive && !dad.isAlive){
     GOD.amorzesh([mom, dad])
}

#golden_sentence

💎 جمله طلایی امروز 💎

🔸Any fool can write code that a computer can understand. Good programmers write code that humans can understand.

هر کسی می‌تونه کدی بنویسه که یک کامپیوتر بتونه اون رو را اجرا کنه، اما برنامه‌نویسان خوب کسانی هستند که میتونن کدی بنویسند که برای انسان‌ها هم قابل فهم باشد 🚀

Martin Fowler

- به نظرتون چجوری میتونیم به همچین کسی تبدیل بشیم ؟

Channel | Group | YouTube

#javanoscript  #js_trick

●● نزار بیشتر از یک بار کلیک کنه ❌ ●●

برای اطمینان از اینکه یک ایونتی فقط یک بار اجرا بشه داخل جاوااسکریپت، میتونید از ویژگی once توی ارگومان سوم ایونتتون استفاده کنید.

button.addEventListener('click',() => {
  alert('سلام رفیق 👋');
}, { once: true });

🌐 مشاده آنلاین مثال استفاده واقعی

🆔 Channel | Group | YouTube

سلام رفقا امیدوارم حالتون عالی باشه 🔥

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

برای همین گفتم یه نظر سنجی بزارم که اگر به یه حد خوبی رسید و اکثریت دوست داشتن برم تو کارش

نکته : حتما اگر دوست داشتید ویدیوش رو بسازم شرکت کنید تو نظر سنجی تا به حد نصاب برسه

پس منتظر ویدیوش باشید 🔥
به زودی منتشر میشه

#javanoscript #js_trick

●● اطلاعات کامل باتری با جاوااسکریپت🔋●●

با استفاده از Battery Status Api میتونید سطح باتری، وضعیت شارژ شدن و دیگر اطلاعات مرتبط با باتری رو به دست بیارید و ازشون استفاده کنید.

نمونه کد 🚀

navigator.getBattery().then(battery => {
    console.log(`Battery level: ${battery.level * 100}%`);
    console.log(`Is charging: ${battery.charging ? 'Yes' : 'No'}`);
});

🌐 استفاده واقعی در وبسایت

🆔 Channel | Group | YouTube

#fun

- ممد میگن هوش مصنوعی قراره دنیا رو فتح کنه و جای آدما رو بگیره 😱

همچنان هوش مصنوعی :

🆔 Channel | Group | YouTube

البته از حق نگذریم داره روز به روز بهتره میشه 😂🔥
ولی قطعاً جای کار داره

رفقا 333 رو زدیم ⛳😎

کولی کدرا دارن روز به روز بیشتر میشن، میریم برای 1111 🚀❤️

راستی ضبط ویدیو جدید همین الان تموم شد نصفه شبی 😎😂
منتظرش باشید به زودی منتشر میشه، خبرشو بهتون میدم 🚀

#tools | #vscode | #extension

🎯 CSS Peek

مشاهده و ویرایش مستقیم استایل‌های CSS متصل به یک المنت HTML بدون نیاز به جستجو در فایل‌های CSS.

🌐 دانلود
🚀 Tabnine

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

🌐 دانلود
🛜 Thunder Client

یک ابزار قدرتمند برای تست APIها به صورت مستقیم از وی‌اس‌کد و جایگزینی خوب برای Postman.

🌐 دانلود
🎨 Color Highlight

نمایش رنگ‌های استفاده شده در CSS به صورت بصری در کنار کد، به صورت بک‌گراند کد رنگی.

🌐 دانلود
📊 Git Graph

نمایش گرافیکی و تصویری تاریخچه گیت و شاخه‌های مختلف پروژه با امکان مدیریت کامیت‌ها و شاخه‌ها.

🌐 دانلود

🆔 Channel | Group | YouTube