Forwarded from RaefipourFans
#ثقلین
امیرالمؤمنین عليه السلام:
خردمند کسی است كه دمى را در كارهاى بى فایده هدر نمی دهد و آنچه را براى هميشه همراه او نمى ماند، ذخيره نسازد
العاقِلُ مَن لا يُضيعُ لَهُ نَفَسًا فيما لا يَنفَعُهُ، ولا يَقتَني ما لا يَصحَبُهُ
غررالحكم حدیث2163
@raefipourfans
امیرالمؤمنین عليه السلام:
خردمند کسی است كه دمى را در كارهاى بى فایده هدر نمی دهد و آنچه را براى هميشه همراه او نمى ماند، ذخيره نسازد
العاقِلُ مَن لا يُضيعُ لَهُ نَفَسًا فيما لا يَنفَعُهُ، ولا يَقتَني ما لا يَصحَبُهُ
غررالحكم حدیث2163
@raefipourfans
❤15👎1
سایت icones.js.org برای انتخاب آیکون‌ها بسیار کاربردی است. اگرچه امکان جستجو بر اساس پارامترهای دقیق وجود ندارد، اما قابلیت کپی مستقیم آیکون‌ها به صورت SVG بسیار خوب طراحی شده است.
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
👍1
بهبود دسترسی منو در سایت: دسترسی به زیرمنو با استفاده از کلید تب؟ 🤨
تصور کنید یک منوی استاندارد در سایت دارید که یکی از آیتم‌ها شامل زیرمنو است. همه چیز زیبا، کاربردی و راحت به نظر می‌رسد، اما یک مشکل وجود دارد: کاربری که به جای ماوس، ترجیح می‌دهد از کیبورد برای ناوبری استفاده کند و با کمک کلید Tab بین آیتم‌های منو جابه‌جا شود، به راحتی می‌تواند بین آیتم‌های اصلی منو حرکت کند اما نمی‌تواند به زیرمنو دسترسی پیدا کند! 😥
مشکل اینجاست که اگرچه زیرمنو با حرکت ماوس ظاهر می‌شود، اما این قابلیت از طریق کیبورد در دسترس نیست.
چه باید کرد؟ آیا این یک اشکال است؟ بله، اما رفع آن بسیار ساده است. کافی است از CSS pseudoclass به نام :focus-within استفاده کنید. 👍
چگونه می‌توان به این هدف رسید:
زمانی که کاربر به آیتم "Services" می‌رسد و کلید Tab را فشار می‌دهد، فوکوس به زیرمنو منتقل می‌شود و زیرمنو بلافاصله باز می‌شود.
نتیجه این است که کاربر سایت می‌تواند به راحتی با استفاده از کیبورد در منو جابه‌جا شود. این یک روش عالی برای بهبود دسترسی سایت است، به طوری که برای همه کاربران کاربردی و راحت باشد.
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
تصور کنید یک منوی استاندارد در سایت دارید که یکی از آیتم‌ها شامل زیرمنو است. همه چیز زیبا، کاربردی و راحت به نظر می‌رسد، اما یک مشکل وجود دارد: کاربری که به جای ماوس، ترجیح می‌دهد از کیبورد برای ناوبری استفاده کند و با کمک کلید Tab بین آیتم‌های منو جابه‌جا شود، به راحتی می‌تواند بین آیتم‌های اصلی منو حرکت کند اما نمی‌تواند به زیرمنو دسترسی پیدا کند! 😥
مشکل اینجاست که اگرچه زیرمنو با حرکت ماوس ظاهر می‌شود، اما این قابلیت از طریق کیبورد در دسترس نیست.
چه باید کرد؟ آیا این یک اشکال است؟ بله، اما رفع آن بسیار ساده است. کافی است از CSS pseudoclass به نام :focus-within استفاده کنید. 👍
چگونه می‌توان به این هدف رسید:
.dropdown:focus-within .submenu {
display: block;
}زمانی که کاربر به آیتم "Services" می‌رسد و کلید Tab را فشار می‌دهد، فوکوس به زیرمنو منتقل می‌شود و زیرمنو بلافاصله باز می‌شود.
نتیجه این است که کاربر سایت می‌تواند به راحتی با استفاده از کیبورد در منو جابه‌جا شود. این یک روش عالی برای بهبود دسترسی سایت است، به طوری که برای همه کاربران کاربردی و راحت باشد.
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
👍4
Headroom.js
یک کتابخانه سبک جاوا اسکریپت است که به شما این امکان را می‌دهد تا دیدگاه هدرها (سرصفحه‌ها) را در صفحه هنگام اسکرول کردن مدیریت کنید. این کتابخانه هدر را زمانی که کاربر به سمت پایین اسکرول می‌کند "پنهان" می‌کند و هنگامی که کاربر صفحه را به سمت بالا اسکرول می‌کند، آن را دوباره نمایش می‌دهد.
این قابلیت می‌تواند به بهبود تجربه کاربری کمک کند و فضای صفحه را در هنگام مرور محتوا بیشتر کند. با استفاده از Headroom.js، می‌توانید هدرها را به شکلی زیبا و کاربردی مدیریت کنید تا همواره توجه کاربر را جلب کنند.
🔗https://github.com/WickyNilliams/headroom.js
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
یک کتابخانه سبک جاوا اسکریپت است که به شما این امکان را می‌دهد تا دیدگاه هدرها (سرصفحه‌ها) را در صفحه هنگام اسکرول کردن مدیریت کنید. این کتابخانه هدر را زمانی که کاربر به سمت پایین اسکرول می‌کند "پنهان" می‌کند و هنگامی که کاربر صفحه را به سمت بالا اسکرول می‌کند، آن را دوباره نمایش می‌دهد.
این قابلیت می‌تواند به بهبود تجربه کاربری کمک کند و فضای صفحه را در هنگام مرور محتوا بیشتر کند. با استفاده از Headroom.js، می‌توانید هدرها را به شکلی زیبا و کاربردی مدیریت کنید تا همواره توجه کاربر را جلب کنند.
🔗https://github.com/WickyNilliams/headroom.js
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
👍4
ScrollReveal
یک کتابخانه برای انیمیشن عناصر در هنگام اسکرول صفحه است. این کتابخانه به شما کمک می‌کند تا افکت‌های ظهور (fade-in) را اضافه کنید و به تدریج محتوا را نمایش دهید وقتی که به منطقه دید کاربر می‌رسد.
با استفاده از ScrollReveal، می‌توانید تجربه کاربری جذاب‌تری ایجاد کنید و محتوای خود را به صورت داینامیک و بصری جالب‌تر نمایش دهید. این ابزار به ویژه در وب‌سایت‌هایی که محتوای بصری زیادی دارند، می‌تواند بسیار مؤثر باشد.
🔗https://scrollrevealjs.org/
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
یک کتابخانه برای انیمیشن عناصر در هنگام اسکرول صفحه است. این کتابخانه به شما کمک می‌کند تا افکت‌های ظهور (fade-in) را اضافه کنید و به تدریج محتوا را نمایش دهید وقتی که به منطقه دید کاربر می‌رسد.
با استفاده از ScrollReveal، می‌توانید تجربه کاربری جذاب‌تری ایجاد کنید و محتوای خود را به صورت داینامیک و بصری جالب‌تر نمایش دهید. این ابزار به ویژه در وب‌سایت‌هایی که محتوای بصری زیادی دارند، می‌تواند بسیار مؤثر باشد.
🔗https://scrollrevealjs.org/
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
👍2🔥1
Forwarded from RaefipourFans
Media is too big
VIEW IN TELEGRAM
#ثقلین
امام على عليه السلام:
مِن تَوفيقِ الحُرِّ اكتِسابُهُ المالَ مِن حِلِّهِ
از نشانه‌های توفیق انسان آزاده اين است كه مال را از راه‌حلال به دست آورد
غررالحكم حدیث9393
@raefipourfans
امام على عليه السلام:
مِن تَوفيقِ الحُرِّ اكتِسابُهُ المالَ مِن حِلِّهِ
از نشانه‌های توفیق انسان آزاده اين است كه مال را از راه‌حلال به دست آورد
غررالحكم حدیث9393
@raefipourfans
❤9🔥1
در CSS انیمیشن‌های مبتنی بر اسکرول (scroll-driven animations) وجود دارند که امکان ایجاد انیمیشن‌های پیچیده و زیبا را تقریباً بدون نیاز به جاوااسکریپت فراهم می‌کنند.
🔗https://scroll-driven-animations.style/#
🔗https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_scroll-driven_animations
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
🔗https://scroll-driven-animations.style/#
🔗https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_scroll-driven_animations
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
👍3
چطور یک پیش‌نمایش زیبا برای سایت خود در پیام‌رسان‌ها و شبکه‌های اجتماعی ایجاد کنیم؟
وقتی لینکی از سایتتان را به اشتراک می‌گذارید، پیش‌نمایشی که نمایش داده می‌شود باید جذاب و چشم‌نواز باشد، نه مجموعه‌ای از متن‌های بی‌ربط یا تصاویر تصادفی. برای دستیابی به این پیش‌نمایش حرفه‌ای، فقط نیاز به چند مرحله ساده داریم!
راه‌حل: استفاده از متا تگ‌های Open Graph
متا تگ‌های Open Graph یک استاندارد جهانی هستند که توسط شبکه‌های اجتماعی و پیام‌رسان‌ها برای نمایش منظم و جذاب لینک‌های سایت به کار می‌روند. با اضافه کردن چند خط کد در بخش <head> صفحه خود، می‌توانید کنترل کاملی بر نحوه نمایش لینک‌هایتان داشته باشید.
مراحل تنظیم پیش‌نمایش
۱. افزودن تگ‌های Open Graph
در <head>: - og:title: عنوان صفحه که باید کوتاه و جذاب باشد.
در - og:description: توضیحی مختصر که اطلاعات اصلی صفحه را با زبانی جذاب منتقل کند.
در - og:image: لینک به تصویری باکیفیت که پیش‌نمایش را جذاب‌تر کند.
در - og:url: لینک اصلی صفحه که به اشتراک گذاشته می‌شود.
۲. تست و آزمایش پیش‌نمایش: ابزارهای زیر به شما کمک می‌کنند تا مطمئن شوید پیش‌نمایش‌ها به درستی نمایش داده می‌شوند:
metatags.io: این سایت ابزاری برای تولید و اعتبارسنجی تگ‌های متا دارد و به شما امکان می‌دهد پیش‌نمایش خود را دقیقاً همانطور که می‌خواهید تنظیم کنید (شامل فرمت‌های Open Graph، Twitter و JSON-LD).
opengraph.xyz: با وارد کردن لینک سایتتان، این ابزار نحوه نمایش آن را در شبکه‌های اجتماعی به شما نشان می‌دهد.
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
وقتی لینکی از سایتتان را به اشتراک می‌گذارید، پیش‌نمایشی که نمایش داده می‌شود باید جذاب و چشم‌نواز باشد، نه مجموعه‌ای از متن‌های بی‌ربط یا تصاویر تصادفی. برای دستیابی به این پیش‌نمایش حرفه‌ای، فقط نیاز به چند مرحله ساده داریم!
راه‌حل: استفاده از متا تگ‌های Open Graph
متا تگ‌های Open Graph یک استاندارد جهانی هستند که توسط شبکه‌های اجتماعی و پیام‌رسان‌ها برای نمایش منظم و جذاب لینک‌های سایت به کار می‌روند. با اضافه کردن چند خط کد در بخش <head> صفحه خود، می‌توانید کنترل کاملی بر نحوه نمایش لینک‌هایتان داشته باشید.
مراحل تنظیم پیش‌نمایش
۱. افزودن تگ‌های Open Graph
در <head>: - og:title: عنوان صفحه که باید کوتاه و جذاب باشد.
در - og:description: توضیحی مختصر که اطلاعات اصلی صفحه را با زبانی جذاب منتقل کند.
در - og:image: لینک به تصویری باکیفیت که پیش‌نمایش را جذاب‌تر کند.
در - og:url: لینک اصلی صفحه که به اشتراک گذاشته می‌شود.
۲. تست و آزمایش پیش‌نمایش: ابزارهای زیر به شما کمک می‌کنند تا مطمئن شوید پیش‌نمایش‌ها به درستی نمایش داده می‌شوند:
metatags.io: این سایت ابزاری برای تولید و اعتبارسنجی تگ‌های متا دارد و به شما امکان می‌دهد پیش‌نمایش خود را دقیقاً همانطور که می‌خواهید تنظیم کنید (شامل فرمت‌های Open Graph، Twitter و JSON-LD).
opengraph.xyz: با وارد کردن لینک سایتتان، این ابزار نحوه نمایش آن را در شبکه‌های اجتماعی به شما نشان می‌دهد.
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
❤1
ایجاد دکمه‌های سفارشی برای انتخاب فایل 😌
آپلود فایل در سایت یکی از رایج‌ترین نیازها در طراحی وب است. با این حال، دکمه پیش‌فرض <input type="file"> اغلب با طراحی کلی سایت هم‌خوانی ندارد. تا پیش از این، برای رفع این مشکل، معمولاً اینپوت اصلی را پنهان می‌کردیم و یک دکمه سفارشی با رویداد کلیک می‌ساختیم. 🦈
ولی وقتی که با پسوکلاس ::file-selector-button آشنا شدم، واقعاً شگفت‌زده شدم! این پسوکلاس اجازه می‌دهد بدون پیچیدگی‌های اضافه، دکمه آپلود فایل را به دلخواه خود استایل‌دهی کنید. جالب‌تر اینکه، پشتیبانی این ویژگی در مرورگرهای مدرن به حدود نود و پنج درصد رسیده است! (مشاهده در: caniuse.com) 🤩
چگونگی استفاده از ::file-selector-button
با استفاده از این روش، می‌توان دکمه انتخاب فایل را به گونه‌ای طراحی کرد که کاملاً با استایل و تم سایت هماهنگ شود.
نتیجه
پسوکلاس ::file-selector-button به شما این امکان را می‌دهد که دکمه‌های پیش‌فرض آپلود فایل را بدون هیچ افتی در عملکرد و کارایی، با ظاهری شخصی‌سازی شده ایجاد کنید. 👍
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
آپلود فایل در سایت یکی از رایج‌ترین نیازها در طراحی وب است. با این حال، دکمه پیش‌فرض <input type="file"> اغلب با طراحی کلی سایت هم‌خوانی ندارد. تا پیش از این، برای رفع این مشکل، معمولاً اینپوت اصلی را پنهان می‌کردیم و یک دکمه سفارشی با رویداد کلیک می‌ساختیم. 🦈
ولی وقتی که با پسوکلاس ::file-selector-button آشنا شدم، واقعاً شگفت‌زده شدم! این پسوکلاس اجازه می‌دهد بدون پیچیدگی‌های اضافه، دکمه آپلود فایل را به دلخواه خود استایل‌دهی کنید. جالب‌تر اینکه، پشتیبانی این ویژگی در مرورگرهای مدرن به حدود نود و پنج درصد رسیده است! (مشاهده در: caniuse.com) 🤩
چگونگی استفاده از ::file-selector-button
با استفاده از این روش، می‌توان دکمه انتخاب فایل را به گونه‌ای طراحی کرد که کاملاً با استایل و تم سایت هماهنگ شود.
نتیجه
پسوکلاس ::file-selector-button به شما این امکان را می‌دهد که دکمه‌های پیش‌فرض آپلود فایل را بدون هیچ افتی در عملکرد و کارایی، با ظاهری شخصی‌سازی شده ایجاد کنید. 👍
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
❤1👍1
اگر در پروژه‌تان فایل‌های JSON دارید، گاهی اوقات کار با JSON5 ساده‌تر و کاربردی‌تر است، چون از مواردی مانند کامنت‌ها و انتقال خطوط پشتیبانی می‌کند. برای این کار، مراحل زیر را انجام دهید:
۱) نصب پلاگین Vite: ابتدا پلاگین vite-plugin-json5 را نصب کنید.
۲) نصب افزونه JSON5 برای VS Code: برای دسترسی به هایلایت سینتکس در ویرایشگر، افزونه JSON5 را به VS Code اضافه کنید.
۳) پیکربندی TypeScript: برای اینکه TypeScript با JSON5 مشکلی نداشته باشد، در فایل index.d.ts این خط کد را اضافه کنید:
حالا همه چیز خیلی راحت‌تر شده است و نکته خوب این است که باندل شما تغییری نمی‌کند.
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
۱) نصب پلاگین Vite: ابتدا پلاگین vite-plugin-json5 را نصب کنید.
۲) نصب افزونه JSON5 برای VS Code: برای دسترسی به هایلایت سینتکس در ویرایشگر، افزونه JSON5 را به VS Code اضافه کنید.
۳) پیکربندی TypeScript: برای اینکه TypeScript با JSON5 مشکلی نداشته باشد، در فایل index.d.ts این خط کد را اضافه کنید:
declare module "*.json5" {
const value: any;
export default value;
}حالا همه چیز خیلی راحت‌تر شده است و نکته خوب این است که باندل شما تغییری نمی‌کند.
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
👍2
وب‌سایت iOS404 اطلاعاتی درباره‌ی ویژگی‌ها و قابلیت‌هایی که در iOS وجود ندارد و در Android موجود است ارائه می‌دهد. برای مشاهده جزئیات بیشتر و مقایسه ویژگی‌ها می‌توانید به iOS404 مراجعه کنید.
🔗https://ios404.com/
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
🔗https://ios404.com/
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript
ویژگی @property در CSS در سال دو هزار و بیست و چهار معرفی شده است، بنابراین باید هنگام استفاده از آن احتیاط کنید. این ویژگی به شما امکان می‌دهد که نوع متغیرهای سفارشی را در CSS مشخص کنید.
نمونه‌ای از یک متغیر غیر نوعی در CSS:
نمونه‌ای از یک متغیر نوعی در CSS:
از طریق جاوا اسکریپت:
انواع (syntax):
مقادیر ممکن شامل: <length>، <number>، <percentage>، <length-percentage>، <color>، <image>، <url>، <integer>، <angle>، <time>، <resolution>، <transform-function>، <custom-ident>، یا لیستی از انواع داده‌ها و مقادیر کلیدی می‌باشد.
پشتیبانی در مرورگرها
پشتیبانی از این ویژگی در مرورگرها هم اکنون کامل است.
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
نمونه‌ای از یک متغیر غیر نوعی در CSS:
:root {
--background-color: blue;
}
.box {
background-color: var(--background-color);
}نمونه‌ای از یک متغیر نوعی در CSS:
@property --background-color {
syntax: "<color>";
inherits: false;
initial-value: blue;
}از طریق جاوا اسکریپت:
window.CSS.registerProperty({
name: "--background-color",
syntax: "<color>",
inherits: false,
initialValue: "blue",
});انواع (syntax):
مقادیر ممکن شامل: <length>، <number>، <percentage>، <length-percentage>، <color>، <image>، <url>، <integer>، <angle>، <time>، <resolution>، <transform-function>، <custom-ident>، یا لیستی از انواع داده‌ها و مقادیر کلیدی می‌باشد.
پشتیبانی در مرورگرها
پشتیبانی از این ویژگی در مرورگرها هم اکنون کامل است.
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
👍3
ویدیو دوبله شده در مورد پوشه NPM bin با اسکریپت‌های اجرایی [+لینک]
پوشه NPM bin جایی است که NPM فایل‌های اجرایی مرتبط با بسته‌های نصب‌شده را ذخیره می‌کند. وقتی شما یک بسته NPM را نصب می‌کنید، اگر آن بسته شامل اسکریپت‌های اجرایی باشد، NPM این اسکریپت‌ها را در پوشه bin قرار می‌دهد.
این پوشه به شما این امکان را می‌دهد که به راحتی به این اسکریپت‌ها دسترسی داشته باشید و آن‌ها را از هر نقطه‌ای در خط فرمان اجرا کنید. اسکریپت‌های موجود در این پوشه معمولاً فاقد پسوند هستند و برای اجرا به خط Shebang (#!) نیاز دارند که در ابتدای هر فایل اجرایی قرار می‌گیرد و تعیین می‌کند کدام مفسر برای اجرای فایل استفاده شود..
🔗https://aparat.com/v/ved7pjj
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
پوشه NPM bin جایی است که NPM فایل‌های اجرایی مرتبط با بسته‌های نصب‌شده را ذخیره می‌کند. وقتی شما یک بسته NPM را نصب می‌کنید، اگر آن بسته شامل اسکریپت‌های اجرایی باشد، NPM این اسکریپت‌ها را در پوشه bin قرار می‌دهد.
این پوشه به شما این امکان را می‌دهد که به راحتی به این اسکریپت‌ها دسترسی داشته باشید و آن‌ها را از هر نقطه‌ای در خط فرمان اجرا کنید. اسکریپت‌های موجود در این پوشه معمولاً فاقد پسوند هستند و برای اجرا به خط Shebang (#!) نیاز دارند که در ابتدای هر فایل اجرایی قرار می‌گیرد و تعیین می‌کند کدام مفسر برای اجرای فایل استفاده شود..
🔗https://aparat.com/v/ved7pjj
#️⃣#tip #dub
👥@IR_javascript_group
🆔@IR_javascript
👍2
چک باکس سفارشی بدون دردسر 🤨
سفارشی‌سازی چک باکس‌ها مدت‌ها یک مشکل برای توسعه‌دهندگان وب بود. برای تغییر استایل استاندارد، باید عنصر اصلی را مخفی می‌کردند و یک <div> استایل‌دار جایگزین می‌کردند که به کد زیادی نیاز داشت. اما اکنون راه حلی مدرن وجود دارد: appearance: none که نود و چهار درصد پشتیبانی دارد.
این ویژگی به شما امکان می‌دهد طراحی استاندارد چک باکس را حذف کنید و از یک بوم خالی شروع کنید. با استفاده از appearance: none، نیازی به مخفی کردن عناصر استاندارد و افزودن عناصر اضافی نیست. به سادگی استایل‌ها را در CSS توصیف کنید و کد خود را تمیز نگه دارید. 👍
برای یادگیری بیشتر به لینک زیر مراجعه کنید
🔗 https://codepen.io/katrin_profrontend/pen/PoMRdJp
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
سفارشی‌سازی چک باکس‌ها مدت‌ها یک مشکل برای توسعه‌دهندگان وب بود. برای تغییر استایل استاندارد، باید عنصر اصلی را مخفی می‌کردند و یک <div> استایل‌دار جایگزین می‌کردند که به کد زیادی نیاز داشت. اما اکنون راه حلی مدرن وجود دارد: appearance: none که نود و چهار درصد پشتیبانی دارد.
این ویژگی به شما امکان می‌دهد طراحی استاندارد چک باکس را حذف کنید و از یک بوم خالی شروع کنید. با استفاده از appearance: none، نیازی به مخفی کردن عناصر استاندارد و افزودن عناصر اضافی نیست. به سادگی استایل‌ها را در CSS توصیف کنید و کد خود را تمیز نگه دارید. 👍
برای یادگیری بیشتر به لینک زیر مراجعه کنید
🔗 https://codepen.io/katrin_profrontend/pen/PoMRdJp
#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript
👍1👏1
به نظر می‌رسد ویژگی "علامت‌گذاری برای عناصر اسکرول‌دار" در Chrome 130 واقعاً مفید باشد. گاهی اوقات پیدا کردن عناصر اسکرول‌دار در ساختار وب دشوار می‌شود.
#️⃣ #tool
👥@IR_javascript_group
🆔@IR_javascript
#️⃣ #tool
👥@IR_javascript_group
🆔@IR_javascript
👍1
Daisy UI یک کتابخانه زیبا و ساده برای Tailwind CSS است که به طور متفاوتی از کتابخانه‌های معمولی مانند Material UI یا Mantine UI عمل می‌کند. به جای ارائه مجموعه‌ای از کامپوننت‌ها، Daisy UI مجموعه‌ای از کلاس‌های کاربردی مانند btn، btn-primary، modal و modal-box را ارائه می‌دهد که می‌توانید برای ایجاد کامپوننت‌های خود استفاده کنید.
🔗https://daisyui.com/
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
🔗https://daisyui.com/
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
👍2
📱 GDPR و کوکی‌ها: رعایت قوانین حریم خصوصی
GDPR (قانون عمومی حفاظت از داده‌ها) یک قانون اروپایی است که پردازش داده‌های شخصی کاربران را تنظیم می‌کند.
GDPR نیاز دارد که قبل از نصب کوکی‌ها، کاربر موافقت صریح خود را ارائه دهد. مهم است که کاربر را از اینکه چه داده‌هایی جمع‌آوری می‌شود و چگونه استفاده می‌شود، مطلع کنید. همچنین کاربر باید بتواند کوکی‌ها را حذف کرده و تنظیمات را تغییر دهد.
📌 رعایت GDPR یک جنبه مهم در کار با کوکی‌هاست، به‌ویژه در تعامل با کاربران از اروپا.
#️⃣#tip
👥@IR_javascript_group
🆔@IR_javascript
GDPR (قانون عمومی حفاظت از داده‌ها) یک قانون اروپایی است که پردازش داده‌های شخصی کاربران را تنظیم می‌کند.
GDPR نیاز دارد که قبل از نصب کوکی‌ها، کاربر موافقت صریح خود را ارائه دهد. مهم است که کاربر را از اینکه چه داده‌هایی جمع‌آوری می‌شود و چگونه استفاده می‌شود، مطلع کنید. همچنین کاربر باید بتواند کوکی‌ها را حذف کرده و تنظیمات را تغییر دهد.
📌 رعایت GDPR یک جنبه مهم در کار با کوکی‌هاست، به‌ویژه در تعامل با کاربران از اروپا.
#️⃣#tip
👥@IR_javascript_group
🆔@IR_javascript
❤1👍1
🌐 MotionNumber
MotionNumber یک ابزار مفید برای ایجاد اثرات انتقال زیبا برای هر نوع داده عددی است. این ابزار می‌تواند به جلوه‌های بصری جذاب کمک کند و تجربه کاربری را بهبود بخشد.
🔗https://motion-number.barvian.me/
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
MotionNumber یک ابزار مفید برای ایجاد اثرات انتقال زیبا برای هر نوع داده عددی است. این ابزار می‌تواند به جلوه‌های بصری جذاب کمک کند و تجربه کاربری را بهبود بخشد.
🔗https://motion-number.barvian.me/
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript
🔥7👍2