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

🆔@IR_javascript
Download Telegram
‏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
از ScanApp برای اسکن کدهای QR یا انواع مختلف بارکدها در مرورگر وب خود با استفاده از دوربین یا تصاویر روی دستگاه استفاده کنید. اسکن در رایانه شخصی، مک، اندروید یا IOS پشتیبانی می شود.
🔗https://github.com/mebjas/html5-qrcode

#️⃣#npm_module
🆔@IR_javascript
👍1
در خروجی چه خواهد بود
Anonymous Quiz
37%
30, 10
33%
20, 10
14%
10, 30
16%
20, 30
‏استفاده از JavaScript FileReader API برای خواندن فایل ها در سمت کلاینت

‏FileReader API به برنامه های کاربردی وب اجازه می دهد تا محتویات فایل های سمت سرویس گیرنده را بدون ارسال فایل ها به سرور بخوانند. این می تواند برای پردازش فایل های متنی، تصاویر و سایر فایل های رسانه ای در سمت کلاینت مفید باشد.
#️⃣#tip
🆔@IR_javascript
👍1
استفاده از JavaScript Animation API برای ایجاد انیمیشن در وب

‏Animation API به شما امکان می دهد با استفاده از جاوا اسکریپت انیمیشن ها را در صفحات وب ایجاد کنید، که می تواند تجربه کاربر را بهبود بخشد و توجه را به عناصر خاصی جلب کند.


#️⃣#tip
🆔@IR_javascript
👍1
‏Tesseract.js یک کتابخانه جاوااسکریپت است که کلمات را به تقریبا هر زبانی از تصاویر استخراج می‌کند.

🔗https://tesseract.projectnaptha.com/

#️⃣#npm_module
🆔@IR_javascript
👍3
تبديل متن به صدا در جاوااسكريپت
‏SpeechSynthesis یک API گفتار وب است که برای تبديل متن به گفتار استفاده می شود.

  // Create a SpeechSynthesisUtterance
const utterance = new SpeechSynthesisUtterance("Welcome to this tutorial!");

// Select a voice
const voices = speechSynthesis.getVoices();
utterance.voice = voices[10]; // Choose a specific voice

// Speak the text
speechSynthesis.speak(utterance);


🔗https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisUtterance

#️⃣#tip
🆔@IR_javascript
👍1
This media is not supported in your browser
VIEW IN TELEGRAM
برنامه اسکرین شات به کد برای HTML/Tailwind CSS، React، Bootstrap یا Vue با استفاده از اسکرین شات یا پیوند به یک وب سایت تولید می کند.

‏GPT-4 Vision و DALL-E 3 استفاده می شود. شما باید یک کلید برای GPT-4 Vision داشته باشید.

🔗https://github.com/abi/screenshot-to-code

#️⃣#tool
🆔@IR_javascript
👍1
پوشش در CSS با استفاده از ویژگی mask

این ویژگی مانند background تعریف می شود
 mask: url("../img/shape.png") center/cover no-repeat;

در mask-image تصویری را به عنوان لایه ماسک برای عنصر تنظیم می کنیم
#️⃣#tip #css
🆔@IR_javascript
👍2
intro-image.gif
17.1 MB
‏AR.js یک کتابخانه سبک برای واقعیت افزوده (AR) در وب است که شامل ویژگی‌هایی مانند Image Tracking مبتنی بر موقعیت و نشانگر می‌شود.
يعني مي تواند AR را بر روي يك نشانگر و يا يك لوكيشن جغرافيايي ست كند و هر زمان دوربين تلفن همراه روي آن نشانگر و يا محل قرار گرفت AR نمايش داده مي شود.

🔗https://ar-js-org.github.io/AR.js-Docs/

#️⃣#npm_module
🆔@IR_javascript
ساخت حالت شیشه ای برای المان ها

🔗https://hype4.academy/tools/glassmorphism-generator

#️⃣#tool
🆔@IR_javascript
👍1
Vibration API in JavaScript

در صورت وجود این سخت افزار روی دیوایس کلاینت ارتعاش رخ خواهد داد و اگر دستگاه از لرزش پشتیبانی نکند، این روش هیچ ارور و یا مشکلی را در کد شما ایجاد نمی کند. در زمان فراخوانی الگوی ارتعاش قبلی متوقف می‌شود و به جای آن الگوی جدید شروع می‌شود.
navigator.vibrate(500); 
// device will vibrate for 500ms

🔗https://developer.mozilla.org/en-US/docs/Web/API/Navigator/vibrate

#️⃣#tip
🆔@IR_javascript
👍1