جاوااسکریپت | JavaScript
511 subscribers
654 photos
140 videos
3 files
512 links
کانال @IR_javascript حاوی اطلاعات مفید در حوزه برنامه نویس فرانت که بصورت روزانه بروز می‌شود.
در این کانال شما به:
[1] مطالب تازه
[2] تحلیل‌های عمیق
[3] نکات آموزشی
[4] چالش
[5] ابزار و راهنمایی‌های کاربردی
دسترسی خواهید داشت.

🆔@IR_javascript
Download Telegram
VSCode shortcuts

#️⃣#tool
🆔@IR_javascript
استفاده از JavaScript Geolocation API برای دریافت اطلاعات موقعیت مکانی کاربر
‏Geolocation API به برنامه های کاربردی وب اجازه می دهد تا اطلاعات موقعیت مکانی کاربر را از طریق GPS یا روش های دیگر به دست آورند

navigator.geolocation.getCurrentPosition(function(position) {
console.log('latitude:', position.coords.latitude); console.log('longitude:', position.coords.longitude);
});


#️⃣#tip
🆔@IR_javascript
👍1
در خروجی چه خواهد بود
Anonymous Quiz
61%
10
10%
20
20%
undefined
10%
error
👍1
‏glMatrix یک کتابخانه‌ی جاوااسکریپت برای انجام عملیات ریاضیاتی ماتریسی و وکتوری است. این کتابخانه برای توسعه‌دهندگان وب کاربرد دارد و به آن‌ها امکان محاسبات پیچیده‌ی گرافیکی مانند ترسیم سه‌بعدی را می‌دهد.

🔗https://glmatrix.net/

#️⃣#npm_module
🆔@IR_javascript
‏ Moment.js یک کتابخانه JS عالی برای کار با تاریخ و زمان است

npm install moment --save

شی moment در Moment.js قابل تغییر است. این بدان معنی است که عملیاتی مانند add ، subtract یا set شی moment اولیه را تغییر می دهند. هنگام استفاده از Moment.js برای اولین بار، سناریوهایی مانند این ممکن است کمی گیچ کننده باشد:
 var a = moment('01-01-2016');
var b = a.add(1، 'week');
a.format();
"2016-01-08T00:00:00-06:00"



🔗https://momentjs.com/docs/

#️⃣#npm_module
🆔@IR_javascript
در خروجی چه خواهد بود؟
Anonymous Quiz
19%
6
23%
15
50%
27
8%
28
با خبر شدن از حرکت کاربر در Viewport و عناصر خاصی که در دید او قرار می‌گیرند

متداول‌ترین کاربرد IntersectionObserver زمانی است که می‌خواهیم به محض ورود یک عنصر به Viewport برای آن یک افکت یا انیمیشن مشخص کنیم یا زمانی است که ویدئوها از دید کاربر خارج می‌شوند و ممکن است بخواهیم آن را متوقف کنیم یا بخواهیم ویدئو را به صورت شناور در بیاوریم. کاربردهای متعددی برای IntersectionObserver وجود دارد که بسته به نیاز و خلاقیت طراح سایت قابل استفاده هستند.
🔗https://rokaweb.ir/intersectionobserver/

#️⃣#tip
🆔@IR_javascript
👍3
Print Friendly CSS

#️⃣#tip #css
🆔@IR_javascript
‏Capo.js ابزاری برای مرتب کردن <head> شما است. این بر اساس برخی تحقیقات هری رابرتز است که نشان می دهد چگونه چیزی به ظاهر ناچیز که در تگ <head> شما قرار دارد می تواند بارگذاری صفحه شما را تا 7 ثانیه کندتر کند! ازasync scripts، stylesheets و .. در صورت هم ریختگی می‌تواند عواقبی داشته باشد. Capo.js ترتیب خاصی را به شما نشان می دهد تا <head> و صفحه شما سریعتر شود

🔗https://frontendmasters.com/blog/capo-js-a-five-minute-web-performance-boost/
🔗https://rviscomi.github.io/capo.js/

#️⃣#tool
🆔@IR_javascript
👍1
کتابخانه tracking.js الگوریتم های مختلف و تکنیک های بینایی ماشین را به محیط مرورگر می آورد. با استفاده از مشخصات مدرن HTML5، این کتابخانه ردیابی رنگ، تشخیص چهره و موارد دیگر را به صورت real time ارائه می دهد. همه این ها با یک هسته سبک و رابط کاربری ساده و قابل فهم (حدود 7 کیلوبایت) است.
🔗https://trackingjs.com/

#️⃣#npm_module
🆔@IR_javascript
👍1
‏Postgres سبک درچارچوب WASM برای مرورگر، Node.js، Bun و Deno
می تواند هم به عنوان یک پایگاه داده در حافظه مموری و هم در سیستم فایل در (Node/Bun) یا indexedDB (مرورگر) استفاده شود.

🔗https://github.com/electric-sql/pglite

#️⃣#npm_module
🆔@IR_javascript
👍1
بررسی املا

ویژگی spellcheck به مرورگر می‌گوید که درست بودن یا نبودن املا و دستور زبان در متن را بررسی کند. این ویژگی برای تگ‌های input یا textarea و همچنین برای عناصری که دارای مجموعه ویژگی contenteditable هستند اعمال می‌شود.

می‌توانید از ::Spelling-error برای استایل دادن به بخش متن غلط املایی استفاده کنید.
::spelling-error {
background-color: yellow;
}

🔗https://developer.mozilla.org/en-US/docs/Web/CSS/::spelling-error

#️⃣#tip #css
🆔@IR_javascript
👍1