This media is not supported in your browser
VIEW IN TELEGRAM
⚜️ میلاد ختم الرسول پیامبر مهربانی حضرت محمد (ص)
⚜️ میلاد جامع علم و عمل و عبادت پرچم دار شاهراه ولایت علوى
حضرت امام جعفر صادق(ع)
بر همگان تبریک و تهنیت باد
#️⃣#event
👥@IR_javascript_group
🆔@IR_javascript
⚜️ میلاد جامع علم و عمل و عبادت پرچم دار شاهراه ولایت علوى
حضرت امام جعفر صادق(ع)
بر همگان تبریک و تهنیت باد
#️⃣#event
👥@IR_javascript_group
🆔@IR_javascript
❤7👍1🤔1
معماری برنامه های مدرن فرانت اند [+لینک]
ویدیو دوبله شده در مورد معماری فرانت اند
در این ویدیو به 5 نوع معماری اپلیکیشن frontend خواهیم پرداخت. بیایید در مورد مزایا و معایب، در مورد زمان استفاده از یک یا نوع دیگری از معماری برنامه های کاربردی frontend صحبت کنیم.
🔗https://www.aparat.com/v/nja14g2
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
ویدیو دوبله شده در مورد معماری فرانت اند
در این ویدیو به 5 نوع معماری اپلیکیشن frontend خواهیم پرداخت. بیایید در مورد مزایا و معایب، در مورد زمان استفاده از یک یا نوع دیگری از معماری برنامه های کاربردی frontend صحبت کنیم.
🔗https://www.aparat.com/v/nja14g2
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
❤2
امکانات CSS: ویژگی mix-blend-mode به ما اجازه میدهد تا پسزمینه سفید یک تصویر را "حذف" کنیم.
در این حالت، خود تصویر رنگ پسزمینه پشت تصویر را به خود میگیرد.
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
امکانات CSS: ویژگی mix-blend-mode به ما اجازه میدهد تا پسزمینه سفید یک تصویر را "حذف" کنیم.
.hide-background {
mix-blend-mode: multiply;
filter: contrast(1);
}
در این حالت، خود تصویر رنگ پسزمینه پشت تصویر را به خود میگیرد.
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
👍7❤1
در سال گذشته، دنیای API development ecosystem (که postman در این دسته قرار داره) دچار تحولی چشمگیر شده است.
نرمافزار Yaak (React, Tauri) به صورت منبع باز منتشر شد، Bruno (Next.js, Tauri) نیز عرضه و با سرعت در حال پیشرفت است، و در نهایت نسخه دسکتاپ Hoppscotch (Vue 3, Tauri) نیز به بازار آمده است.
هنوز Hoppscotch در مرحله آلفا قرار دارد، اما عملکرد بسیار خوبی دارد و مشکلات مربوط به پروکسی درخواستها نیز برطرف شده است. حجم این نرمافزار تنها ۱۰ مگابایت است (در مقایسه با ۱۲۰ مگابایت برای Yaak و ۴۰ مگابایت برای Bruno). در تصویر میتوانید مشاهده کنید که هر کدام از این برنامهها در حالت بیکار چه میزان از حافظه استفاده میکنند. اینجا یک نمایش ویژه از قدرت Tauri داریم.
Yaak و Bruno بهطور کامل آفلاین هستند، بنابراین رابط کاربری آنها با سرعت بالایی کار میکند. از سوی دیگر، Hoppscotch دادهها را در فضای ابری همگامسازی میکند که کمی تأخیر به همراه دارد، اما همچنان تجربه کاربری خوبی ارائه میدهد.
از نظر قابلیتها، Hoppscotch پیشتاز است و پس از آن Bruno قرار دارد.
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
نرمافزار Yaak (React, Tauri) به صورت منبع باز منتشر شد، Bruno (Next.js, Tauri) نیز عرضه و با سرعت در حال پیشرفت است، و در نهایت نسخه دسکتاپ Hoppscotch (Vue 3, Tauri) نیز به بازار آمده است.
هنوز Hoppscotch در مرحله آلفا قرار دارد، اما عملکرد بسیار خوبی دارد و مشکلات مربوط به پروکسی درخواستها نیز برطرف شده است. حجم این نرمافزار تنها ۱۰ مگابایت است (در مقایسه با ۱۲۰ مگابایت برای Yaak و ۴۰ مگابایت برای Bruno). در تصویر میتوانید مشاهده کنید که هر کدام از این برنامهها در حالت بیکار چه میزان از حافظه استفاده میکنند. اینجا یک نمایش ویژه از قدرت Tauri داریم.
Yaak و Bruno بهطور کامل آفلاین هستند، بنابراین رابط کاربری آنها با سرعت بالایی کار میکند. از سوی دیگر، Hoppscotch دادهها را در فضای ابری همگامسازی میکند که کمی تأخیر به همراه دارد، اما همچنان تجربه کاربری خوبی ارائه میدهد.
از نظر قابلیتها، Hoppscotch پیشتاز است و پس از آن Bruno قرار دارد.
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
👍2❤1
ویدیو دوبله شده در مورد الگوهای معماری کلاینت [+لینک]
معماری کلاینت نقش مهمی در طراحی و توسعه نرمافزارهای مدرن دارد و تعیین میکند که چگونه برنامههای کاربردی سمت کلاینت (مانند اپلیکیشنهای وب، موبایل و دسکتاپ) دادهها را مدیریت، نمایش و با سرور ارتباط برقرار میکنند. انتخاب الگوی مناسب برای معماری کلاینت میتواند بر عملکرد، مقیاسپذیری و کارایی برنامه تأثیر بگذارد. در ادامه، به بررسی مهمترین الگوهای معماری کلاینت پرداخته و مزایا و معایب هر یک را بیان میکنیم.
🔗https://aparat.com/v/lumz08e
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
معماری کلاینت نقش مهمی در طراحی و توسعه نرمافزارهای مدرن دارد و تعیین میکند که چگونه برنامههای کاربردی سمت کلاینت (مانند اپلیکیشنهای وب، موبایل و دسکتاپ) دادهها را مدیریت، نمایش و با سرور ارتباط برقرار میکنند. انتخاب الگوی مناسب برای معماری کلاینت میتواند بر عملکرد، مقیاسپذیری و کارایی برنامه تأثیر بگذارد. در ادامه، به بررسی مهمترین الگوهای معماری کلاینت پرداخته و مزایا و معایب هر یک را بیان میکنیم.
🔗https://aparat.com/v/lumz08e
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
❤1👍1
ابزار بررسی کنتراست رنگ (Color Contrast Checker) — بررسی کنتراست رنگها
این ابزار عالی برای طراحان در انتخاب پالت رنگ است. شما رنگها را وارد میکنید و سرویس نشان میدهد که آیا ترکیب انتخابی برای پسزمینه و متن مناسب است یا نه.
کنتراست مناسب برای متنهای کوچک حدود ۱۸ است. کنتراست عالی برای متنهای بزرگ بالاتر از ۱۸ و برای متنهای بولد بالاتر از ۱۴ است.
🔗https://coolors.co/contrast-checker/112a46-acc8e5
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
این ابزار عالی برای طراحان در انتخاب پالت رنگ است. شما رنگها را وارد میکنید و سرویس نشان میدهد که آیا ترکیب انتخابی برای پسزمینه و متن مناسب است یا نه.
کنتراست مناسب برای متنهای کوچک حدود ۱۸ است. کنتراست عالی برای متنهای بزرگ بالاتر از ۱۸ و برای متنهای بولد بالاتر از ۱۴ است.
🔗https://coolors.co/contrast-checker/112a46-acc8e5
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
❤1👍1
ویدیو دوبله شده در مورد معماری MVC و MVVM [+لینک]
در این ویدیو درباره الگوهای معماری MVC و MVVM صحبت خواهیم کرد. بحث خواهیم کرد که معماری MVC چه نیازی دارد و چه مشکلاتی را حل میکند. با مثالهایی به بررسی MVC در نود و جاوااسکریپت خواهیم پرداخت.
🔗https://www.aparat.com/v/uspxz58
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
در این ویدیو درباره الگوهای معماری MVC و MVVM صحبت خواهیم کرد. بحث خواهیم کرد که معماری MVC چه نیازی دارد و چه مشکلاتی را حل میکند. با مثالهایی به بررسی MVC در نود و جاوااسکریپت خواهیم پرداخت.
🔗https://www.aparat.com/v/uspxz58
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
👍1
RoughNotation
یک کتابخانه جاوا اسکریپت است که برای افزودن حاشیهنویسی به متن و عناصر صفحات وب با استفاده از سبکهای طراحیشده، مشابه نقاشیهای دستی به کار میرود.
🔗https://roughnotation.com/
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
یک کتابخانه جاوا اسکریپت است که برای افزودن حاشیهنویسی به متن و عناصر صفحات وب با استفاده از سبکهای طراحیشده، مشابه نقاشیهای دستی به کار میرود.
🔗https://roughnotation.com/
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
👍4
وب سایتی برای ایجاد یک SVG متحرک برای اسکلت ها
🔗skeletonreact.com
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
🔗skeletonreact.com
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
👍1👎1
ویدیو دوبله شده در مورد ساخت افزونه کروم – دورهای برای مبتدیان [+لینک]
یاد بگیرید چگونه با استفاده از جاوااسکریپت و نسخه جدید پلتفرم افزونههای وب، به نام مانفیست نسخهی سه، یک افزونه برای مرورگر کروم ایجاد کنید.
🔗https://aparat.com/v/wkf8ez6
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
یاد بگیرید چگونه با استفاده از جاوااسکریپت و نسخه جدید پلتفرم افزونههای وب، به نام مانفیست نسخهی سه، یک افزونه برای مرورگر کروم ایجاد کنید.
🔗https://aparat.com/v/wkf8ez6
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
❤1
MicroModal.js
یک کتابخانه سبک جاوا اسکریپت برای ایجاد پنجرههای مودال است. استفاده از آن بسیار ساده است و هدف آن این است که پنجرههای مودال برای همه کاربران، از جمله افرادی که از صفحهکلید و صفحهخوانها استفاده میکنند، قابل دسترس باشد. این کتابخانه از پنجرههای مودال معمولی و همچنین چندصفحهای با قابلیت ناوبری بین آنها پشتیبانی میکند.
MicroModal.js طراحی مینیمالیستی دارد که امکان سفارشیسازی آسان آن را برای نیازهای پروژههای مختلف فراهم میکند.
🔗https://micromodal.vercel.app/
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
یک کتابخانه سبک جاوا اسکریپت برای ایجاد پنجرههای مودال است. استفاده از آن بسیار ساده است و هدف آن این است که پنجرههای مودال برای همه کاربران، از جمله افرادی که از صفحهکلید و صفحهخوانها استفاده میکنند، قابل دسترس باشد. این کتابخانه از پنجرههای مودال معمولی و همچنین چندصفحهای با قابلیت ناوبری بین آنها پشتیبانی میکند.
MicroModal.js طراحی مینیمالیستی دارد که امکان سفارشیسازی آسان آن را برای نیازهای پروژههای مختلف فراهم میکند.
🔗https://micromodal.vercel.app/
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
👍1
ویدیو دوبله شده در مورد شبکه عصبی با جاوااسکریپت brain js [+لینک]
این دوره آموزشی به شما معرفی عملی ساخت شبکه های عصبی در مرورگر و Node.js
با استفاده از کتابخانه جاوا اسکریپت Brain.js می دهد. در پایان دوره، می توانید طیف وسیعی از مسائل مختلف را با استفاده از شبکه های عصبی حل کنید. به تئوری زیادی نمیپردازند، بلکه بیشتر به نحوه کدگذاری شبکهها میپردازند. این بدان معناست که این دوره برای هر کسی که جاوا اسکریپت را می داند مناسب است.
🔗https://www.aparat.com/v/acimonz
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
این دوره آموزشی به شما معرفی عملی ساخت شبکه های عصبی در مرورگر و Node.js
با استفاده از کتابخانه جاوا اسکریپت Brain.js می دهد. در پایان دوره، می توانید طیف وسیعی از مسائل مختلف را با استفاده از شبکه های عصبی حل کنید. به تئوری زیادی نمیپردازند، بلکه بیشتر به نحوه کدگذاری شبکهها میپردازند. این بدان معناست که این دوره برای هر کسی که جاوا اسکریپت را می داند مناسب است.
🔗https://www.aparat.com/v/acimonz
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
👍4
داده های جعلی (آدرس، نام، اعداد و اطلاعات دیگر) را با استفاده از کتابخانه Faker تولید می کند. عالی برای تست سریع
🔗https://marketplace.visualstudio.com/items?itemName=deerawan.vscode-faker
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
🔗https://marketplace.visualstudio.com/items?itemName=deerawan.vscode-faker
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
👍3
ویدیو دوبله شده در مورد ایجاد یک PWA ساده جاوااسکریپتی با استفاده از Workbox گوگل [+لینک]
✨ یک اپلیکیشن ساده وانیلا جیاس (جاوااسکریپت پایه) ایجاد خواهیم کرد و آن را با کمک CLI Workbox گوگل به یک PWA تبدیل خواهیم کرد. این باید به سادهسازی فرآیند درک و کار با اپلیکیشنهای وب پیشرفته کمک کند.
🔗https://aparat.com/v/jgr1r21
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
✨ یک اپلیکیشن ساده وانیلا جیاس (جاوااسکریپت پایه) ایجاد خواهیم کرد و آن را با کمک CLI Workbox گوگل به یک PWA تبدیل خواهیم کرد. این باید به سادهسازی فرآیند درک و کار با اپلیکیشنهای وب پیشرفته کمک کند.
🔗https://aparat.com/v/jgr1r21
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
👍1
ایجاد گالری تصاویر با استفاده از CSS Grid 🤩
چند روز پیش یک وظیفه داشتم: باید تصاویر با اندازههای مختلف که بهصورت پویا بارگذاری میشدند را در یک گالری مرتب و هماهنگ قرار میدادم. متأسفانه زمان زیادی را صرف حل مشکل کردم، یعنی دستیابی به پر کردن کامل فضا. و در نهایت، راهحلی را پیدا کردم که فقط در یک خط کد بود! 😳
استفاده از ویژگی CSS grid-auto-flow: dense که بهینهسازی موثر جایگذاری عناصر در شبکه را فراهم میکند. این روش بهطور خودکار فضاهای خالی را پر میکند و چیدمانی هماهنگتر و کاملتر از تصاویر ایجاد میکند.
❗️❗️❗️❗️ استفاده از این ویژگی ممکن است به بهمریختگی ترتیب عناصر منجر شود، زیرا عناصر مطابق با اندازهشان چیده میشوند و نه طبق ترتیب قرارگیریشان.
یک پروژه کوچک : CodePen (https://codepen.io/katrin_profrontend/pen/BaXBwqg?editors=0110)
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
چند روز پیش یک وظیفه داشتم: باید تصاویر با اندازههای مختلف که بهصورت پویا بارگذاری میشدند را در یک گالری مرتب و هماهنگ قرار میدادم. متأسفانه زمان زیادی را صرف حل مشکل کردم، یعنی دستیابی به پر کردن کامل فضا. و در نهایت، راهحلی را پیدا کردم که فقط در یک خط کد بود! 😳
استفاده از ویژگی CSS grid-auto-flow: dense که بهینهسازی موثر جایگذاری عناصر در شبکه را فراهم میکند. این روش بهطور خودکار فضاهای خالی را پر میکند و چیدمانی هماهنگتر و کاملتر از تصاویر ایجاد میکند.
❗️❗️❗️❗️ استفاده از این ویژگی ممکن است به بهمریختگی ترتیب عناصر منجر شود، زیرا عناصر مطابق با اندازهشان چیده میشوند و نه طبق ترتیب قرارگیریشان.
یک پروژه کوچک : CodePen (https://codepen.io/katrin_profrontend/pen/BaXBwqg?editors=0110)
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
❤3
ویدیو دوبله شده در برنامهنویسی جماستک [+لینک]
این یک دوره جامع جماستک است که باید هر آنچه را که باید دربارهٔ این مدل محبوب ایجاد وبسایت، اپلیکیشنهای یک صفحهای و اپلیکیشنهای چند صفحهای بدانید، توضیح دهد.
این دوره به دو بخش تقسیم شده است: ۱- توضیحات نظری [نقشهها با استفاده از @eraserlabs ] ۲- ساخت دو پروژه
الف) ساخت یک وبسایت / API | استقرار در نتلیفای
ب) ساخت یک اپلیکیشن یک صفحهای با Next.JS ۱۴.۱ / استقرار در ورسل
🔗https://aparat.com/v/vyf17g9
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
این یک دوره جامع جماستک است که باید هر آنچه را که باید دربارهٔ این مدل محبوب ایجاد وبسایت، اپلیکیشنهای یک صفحهای و اپلیکیشنهای چند صفحهای بدانید، توضیح دهد.
این دوره به دو بخش تقسیم شده است: ۱- توضیحات نظری [نقشهها با استفاده از @eraserlabs ] ۲- ساخت دو پروژه
الف) ساخت یک وبسایت / API | استقرار در نتلیفای
ب) ساخت یک اپلیکیشن یک صفحهای با Next.JS ۱۴.۱ / استقرار در ورسل
🔗https://aparat.com/v/vyf17g9
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
❤3