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
ویژگی enterkeyhint 😊
آیا تا به حال متوجه شده‌اید که کیبورد دستگاه شما گاهی نشان می‌دهد چه اتفاقی می‌افتد اگر دکمه Enter را فشار دهید؟ برای مثال، "ارسال"، "جستجو" یا "بعدی".
همه این موارد را می‌توان با استفاده از ویژگی enterkeyhint کنترل کرد که به کاربر دستورالعمل‌های دقیق‌تری می‌دهد و تعامل با فرم‌ها را در دستگاه‌های موبایل راحت‌تر می‌کند. 😁
⬆️ مقادیر ممکن به همراه نمونه‌هایی از کیبوردها در تصویر بالا آورده شده است.
👀 این ویژگی توسط همه مرورگرهای مدرن (93%) پشتیبانی می‌شود. می‌توانید بررسی کنید: Can I use (https://caniuse.com/?search=enterkeyhint)
#️⃣#tip #html
👥@IR_javascript_group
🆔@IR_javascript
آیا تا به حال متوجه شده‌اید که کیبورد دستگاه شما گاهی نشان می‌دهد چه اتفاقی می‌افتد اگر دکمه Enter را فشار دهید؟ برای مثال، "ارسال"، "جستجو" یا "بعدی".
همه این موارد را می‌توان با استفاده از ویژگی enterkeyhint کنترل کرد که به کاربر دستورالعمل‌های دقیق‌تری می‌دهد و تعامل با فرم‌ها را در دستگاه‌های موبایل راحت‌تر می‌کند. 😁
<input id="input-default" type="text" enterkeyhint="enter" >
⬆️ مقادیر ممکن به همراه نمونه‌هایی از کیبوردها در تصویر بالا آورده شده است.
👀 این ویژگی توسط همه مرورگرهای مدرن (93%) پشتیبانی می‌شود. می‌توانید بررسی کنید: Can I use (https://caniuse.com/?search=enterkeyhint)
#️⃣#tip #html
👥@IR_javascript_group
🆔@IR_javascript
👍7❤1
ویدیو دوبله شده در مورد پروتکل‌های URL عجیب [+لینک]
✨ تا به حال در وب روی لینکی کلیک کرده‌اید و ناگهان یک نرم‌افزار یا اپلیکیشن روی کامپیوتر یا موبایل‌تان باز شده است؟
🔗 پروتکل‌های مختلف URL نقش مهمی در هدایت کاربران به منابع و برنامه‌های مختلف دارند. از پروتکل‌های معروف مانند HTTP و HTTPS که برای وب‌سایت‌ها استفاده می‌شوند، تا پروتکل‌های مخصوصی مانند steam:// برای پلتفرم‌های بازی، spotify:// برای سرویس‌های موسیقی و zoom:// برای جلسات آنلاین.
✅ همچنین، پروتکل‌های خاصی مانند magnet:// برای دانلودهای BitTorrent و پروتکل‌های مایکروسافت و ویندوز شامل ms-clock:// و ms-calculator:// به ما امکانات بیشتری می‌دهند.
💬 پروتکل تلگرام: که به شکل tg:// هست. این پروتکل این امکان را می‌دهد که به راحتی به چت‌ها، گروه‌ها و کانال‌های تلگرام هدایت شوند.
🔍 در این ویدیو به تفصیل درباره این پروتکل‌ها و تفاوت بین پروتکل‌های رسمی و خصوصی صحبت شده است. همچنین، روند ثبت‌نام و ادغام پروتکل‌های خصوصی بدون نیاز به ثبت‌نام رسمی توضیح داده می‌شود.
🔗https://aparat.com/v/qkm0zt8
#️⃣ #dub
👥@IR_javascript_group
🆔@IR_javascript
✨ تا به حال در وب روی لینکی کلیک کرده‌اید و ناگهان یک نرم‌افزار یا اپلیکیشن روی کامپیوتر یا موبایل‌تان باز شده است؟
🔗 پروتکل‌های مختلف URL نقش مهمی در هدایت کاربران به منابع و برنامه‌های مختلف دارند. از پروتکل‌های معروف مانند HTTP و HTTPS که برای وب‌سایت‌ها استفاده می‌شوند، تا پروتکل‌های مخصوصی مانند steam:// برای پلتفرم‌های بازی، spotify:// برای سرویس‌های موسیقی و zoom:// برای جلسات آنلاین.
✅ همچنین، پروتکل‌های خاصی مانند magnet:// برای دانلودهای BitTorrent و پروتکل‌های مایکروسافت و ویندوز شامل ms-clock:// و ms-calculator:// به ما امکانات بیشتری می‌دهند.
💬 پروتکل تلگرام: که به شکل tg:// هست. این پروتکل این امکان را می‌دهد که به راحتی به چت‌ها، گروه‌ها و کانال‌های تلگرام هدایت شوند.
🔍 در این ویدیو به تفصیل درباره این پروتکل‌ها و تفاوت بین پروتکل‌های رسمی و خصوصی صحبت شده است. همچنین، روند ثبت‌نام و ادغام پروتکل‌های خصوصی بدون نیاز به ثبت‌نام رسمی توضیح داده می‌شود.
🔗https://aparat.com/v/qkm0zt8
#️⃣ #dub
👥@IR_javascript_group
🆔@IR_javascript
👍4
.NoSleep.js
یک کتابخانه جاوا اسکریپت است که از ورود دستگاه‌های موبایل به حالت خواب جلوگیری می‌کند هنگامی که یک صفحه وب فعال است. این کتابخانه به ویژه برای برنامه‌هایی که حفظ فعال بودن صفحه مهم است، مانند پخش‌کننده‌های ویدیو یا برنامه‌های مربوط به نقشه، مفید است.
🔗https://github.com/richtr/NoSleep.js
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
یک کتابخانه جاوا اسکریپت است که از ورود دستگاه‌های موبایل به حالت خواب جلوگیری می‌کند هنگامی که یک صفحه وب فعال است. این کتابخانه به ویژه برای برنامه‌هایی که حفظ فعال بودن صفحه مهم است، مانند پخش‌کننده‌های ویدیو یا برنامه‌های مربوط به نقشه، مفید است.
🔗https://github.com/richtr/NoSleep.js
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
🔥5
ویدیو دوبله شده ساخت برنامه های پیشرفته وب با اسفاده از Workbox [+لینک]
✨ این دوره بخشی از دوره Udemy – Progressive Web Apps (PWA) – The Complete Guide 2022-11 ولی در این سرفصل توضیحات مفصلی در مورد workbox آورده شده است
🔗https://www.aparat.com/playlist/11523920
#️⃣ #dub
👥@IR_javascript_group
🆔@IR_javascript
✨ این دوره بخشی از دوره Udemy – Progressive Web Apps (PWA) – The Complete Guide 2022-11 ولی در این سرفصل توضیحات مفصلی در مورد workbox آورده شده است
🔗https://www.aparat.com/playlist/11523920
#️⃣ #dub
👥@IR_javascript_group
🆔@IR_javascript
object-to-formdata
یک ماژول جاوااسکریپت راحت برای سریالایز کردن اشیاء به نمونه‌های FormData
🔗https://github.com/therealparmesh/object-to-formdata
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
یک ماژول جاوااسکریپت راحت برای سریالایز کردن اشیاء به نمونه‌های FormData
🔗https://github.com/therealparmesh/object-to-formdata
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
❤1
This media is not supported in your browser
VIEW IN TELEGRAM
دکمه Gooey با فیلتر SVG
یک دکمه اورجینال با افکت کشسان (الاستیک) هنگام هاور کردن و تغییر رنگ.
🔗https://codepen.io/simeydotme/pen/pomRJeE
#️⃣#code
👥@IR_javascript_group
🆔@IR_javascript
یک دکمه اورجینال با افکت کشسان (الاستیک) هنگام هاور کردن و تغییر رنگ.
🔗https://codepen.io/simeydotme/pen/pomRJeE
#️⃣#code
👥@IR_javascript_group
🆔@IR_javascript
👍3
حذف رفرش ناخواسته در دستگاه‌های موبایل ❔
شاید متوجه شده باشید که در دستگاه‌های موبایل می‌توان سایت را با کشیدن محتوا به سمت پایین، زمانی که صفحه را تا بالاترین نقطه اسکرول کرده‌اید، رفرش کرد؟ این ویژگی "کشیدن برای رفرش" (pull-to-refresh) نام دارد و گاهی در مکان‌های نامناسب فعال می‌شود، به‌ویژه اگر در صفحه عناصری قابل اسکرول وجود داشته باشند — مانند پنجره‌های مودال یا کانتینرهای کوچک محتوا. 🫤
این مشکل را می‌توان به‌سادگی با استفاده از ویژگی overscroll-behavior: none; حل کرد.
این ویژگی تمام اثرات جانبی اسکرول مانند "کشیدن برای رفرش" یا پرش‌های اینرسی را به‌طور کامل غیرفعال می‌کند، که به کنترل بهتر تعامل با محتوا کمک می‌کند.
با این حال، یک نقطه ضعف کوچک هم وجود دارد — انیمیشن بازگشت (bounce-back) در هنگام رسیدن به انتهای باکس اسکرول از بین می‌رود، که ممکن است باعث شود تجربه کاربری کمی ثابت‌تر و "خشک‌تر" به نظر برسد…
اما گاهی اوقات، کنترل رفتار اهمیت بیشتری نسبت به جلوه‌های بصری دارد، به‌ویژه اگر هدف ایجاد تجربه کاربری قابل پیش‌بینی باشد. 👍
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
شاید متوجه شده باشید که در دستگاه‌های موبایل می‌توان سایت را با کشیدن محتوا به سمت پایین، زمانی که صفحه را تا بالاترین نقطه اسکرول کرده‌اید، رفرش کرد؟ این ویژگی "کشیدن برای رفرش" (pull-to-refresh) نام دارد و گاهی در مکان‌های نامناسب فعال می‌شود، به‌ویژه اگر در صفحه عناصری قابل اسکرول وجود داشته باشند — مانند پنجره‌های مودال یا کانتینرهای کوچک محتوا. 🫤
این مشکل را می‌توان به‌سادگی با استفاده از ویژگی overscroll-behavior: none; حل کرد.
این ویژگی تمام اثرات جانبی اسکرول مانند "کشیدن برای رفرش" یا پرش‌های اینرسی را به‌طور کامل غیرفعال می‌کند، که به کنترل بهتر تعامل با محتوا کمک می‌کند.
با این حال، یک نقطه ضعف کوچک هم وجود دارد — انیمیشن بازگشت (bounce-back) در هنگام رسیدن به انتهای باکس اسکرول از بین می‌رود، که ممکن است باعث شود تجربه کاربری کمی ثابت‌تر و "خشک‌تر" به نظر برسد…
اما گاهی اوقات، کنترل رفتار اهمیت بیشتری نسبت به جلوه‌های بصری دارد، به‌ویژه اگر هدف ایجاد تجربه کاربری قابل پیش‌بینی باشد. 👍
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
👍3
Forwarded from RaefipourFans
#ثقلین
امام علی علیه السلام:
...فَلا تَحمِل هَمَّ سَنَتِكَ عَلى هَمِّ يَومِكَ، وكَفاكَ كُلَّ يَومٍ ما هُوَ فيهِ، فَإِن تَكُنِ السَّنَةُ مِن عُمُرِكَ، فَإِنَّ اللَّهَ عزّوجلّ سَيَأتيكَ في كُلِّ غَدٍ بِجَديدِ ما قَسَمَ لَكَ، وإن لَم تَكُنِ السَّنَةُ مِن عُمُرِكَ ، فَما تَصنَعُ بِغَمِّ وهَمِّ ما لَيسَ لَكَ
...در يك روز، نگران يك سال نباش؛ كه غم هر روز، برای آن روز کافی است. اگر يك سال از عمرت مانده باشد، خداوند عزّوجلّ از پس هر روز، روزىِ تازه ات را خواهد داد، و اگر يك سال از عمرت نمانده باشد. پس چرا غم و اندوهِ زمانى را مىخورى كه از آنِ تو نيست؟!
حکمت 379 نهج البلاغه
@raefipourfans
امام علی علیه السلام:
...فَلا تَحمِل هَمَّ سَنَتِكَ عَلى هَمِّ يَومِكَ، وكَفاكَ كُلَّ يَومٍ ما هُوَ فيهِ، فَإِن تَكُنِ السَّنَةُ مِن عُمُرِكَ، فَإِنَّ اللَّهَ عزّوجلّ سَيَأتيكَ في كُلِّ غَدٍ بِجَديدِ ما قَسَمَ لَكَ، وإن لَم تَكُنِ السَّنَةُ مِن عُمُرِكَ ، فَما تَصنَعُ بِغَمِّ وهَمِّ ما لَيسَ لَكَ
...در يك روز، نگران يك سال نباش؛ كه غم هر روز، برای آن روز کافی است. اگر يك سال از عمرت مانده باشد، خداوند عزّوجلّ از پس هر روز، روزىِ تازه ات را خواهد داد، و اگر يك سال از عمرت نمانده باشد. پس چرا غم و اندوهِ زمانى را مىخورى كه از آنِ تو نيست؟!
حکمت 379 نهج البلاغه
@raefipourfans
❤17👎3👏1
در هنگام کدنویسی علاوه بر flex و grid، گزینه‌های دیگری هم برای ایجاد قالب واکنش‌گرا وجود دارد.
به عنوان مثال، ویژگی کمتر استفاده شده display: contents به نوعی "کانتینر" را حذف می‌کند و تمام فرزندان آن به یک سطح بالاتر منتقل می‌شوند.
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
به عنوان مثال، ویژگی کمتر استفاده شده display: contents به نوعی "کانتینر" را حذف می‌کند و تمام فرزندان آن به یک سطح بالاتر منتقل می‌شوند.
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
❤1👍1🔥1
پیکا یک کتابخانه جاوااسکریپت برای مقیاس‌گذاری تصاویر در مرورگر است که آن را برای برنامه‌هایی که به پردازش باکیفیت تصاویر بدون نیاز به درخواست‌های سروری نیاز دارند، مفید می‌کند.
با استفاده از پیکا می‌توانید:
اندازه آپلود تصاویر بزرگ را کاهش داده و زمان آپلود را ذخیره کنید.
منابع سرور را برای پردازش تصاویر ذخیره کنید.
در مرورگر تصاویر بندانگشتی تولید کنید.
🔗https://github.com/nodeca/pica
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
با استفاده از پیکا می‌توانید:
اندازه آپلود تصاویر بزرگ را کاهش داده و زمان آپلود را ذخیره کنید.
منابع سرور را برای پردازش تصاویر ذخیره کنید.
در مرورگر تصاویر بندانگشتی تولید کنید.
🔗https://github.com/nodeca/pica
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
👍2
جدول جالبی است
گوگل بررسی می‌کند که کدام سایت‌ها آزمون Web Vitals (https://web.dev/articles/vitals) آن‌ها را می‌گذرانند.
همانطور که می‌بینیم، نتایج Vue به مراتب بهتر از Nuxt با رندر سمت سرور (SSR) است، در حالی که یکی از دلایل جذب کاربران به Nuxt بهبود شاخص‌های وب بود.
و اگر به آمار سال دوهزار میلادی بازگردیم، می‌توانیم ببینیم که React در آن زمان ده برابر Vue بوده است. اکنون این نسبت تقریباً ۲ برابر است.
#️⃣#tip
👥@IR_javascript_group
🆔@IR_javascript
گوگل بررسی می‌کند که کدام سایت‌ها آزمون Web Vitals (https://web.dev/articles/vitals) آن‌ها را می‌گذرانند.
همانطور که می‌بینیم، نتایج Vue به مراتب بهتر از Nuxt با رندر سمت سرور (SSR) است، در حالی که یکی از دلایل جذب کاربران به Nuxt بهبود شاخص‌های وب بود.
و اگر به آمار سال دوهزار میلادی بازگردیم، می‌توانیم ببینیم که React در آن زمان ده برابر Vue بوده است. اکنون این نسبت تقریباً ۲ برابر است.
#️⃣#tip
👥@IR_javascript_group
🆔@IR_javascript
👍2
This media is not supported in your browser
VIEW IN TELEGRAM
Bolt.new
یک سایت توسعه وب مبتنی بر هوش مصنوعی است که به شما امکان می‌دهد برنامه‌های فول استک را مستقیماً از مرورگر خود ایجاد، اجرا، ویرایش و منتشر کنید، بدون نیاز به تنظیمات محلی. اگر قصد دارید توسعه وب مبتنی بر هوش مصنوعی خود را با استفاده از کد منبع باز Bolt بسازید، این ابزار بسیار مناسب است.
🔗https://bolt.new/
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
یک سایت توسعه وب مبتنی بر هوش مصنوعی است که به شما امکان می‌دهد برنامه‌های فول استک را مستقیماً از مرورگر خود ایجاد، اجرا، ویرایش و منتشر کنید، بدون نیاز به تنظیمات محلی. اگر قصد دارید توسعه وب مبتنی بر هوش مصنوعی خود را با استفاده از کد منبع باز Bolt بسازید، این ابزار بسیار مناسب است.
🔗https://bolt.new/
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
❤1