سلام دوستان
گروهمون هم افتتاح شده

🎉 ویژگی‌های گروه:

🔹 آموزش‌های کاربردی: از مبانی تا مباحث پیشرفته، هر چیزی که برای تسلط بر جاوااسکریپت نیاز دارید را بیاموزید.

🔹 پشتیبانی و مشاوره: سوالات خود را بپرسید و از تجربیات دیگران بهره‌مند شوید. ما اینجا هستیم تا شما را در هر مرحله از راه راهنمایی کنیم.

🔹 پروژه‌های تیمی: با دیگر اعضا پروژه‌های جذاب انجام دهید و مهارت‌های خود را به چالش بکشید.

🔹 منابع و مطالب به‌روز: از جدیدترین منابع، مقالات و دوره‌های آموزشی مطلع شوید و همیشه یک قدم جلوتر باشید.

🔹 رویدادها و چالش‌ها: در چالش‌های برنامه‌نویسی شرکت کنید، جوایز ببرید و لذت ببرید!

🔹 پرسش و پاسخ: هر سوالی دارید، بپرسید! اعضای گروه و متخصصین ما به سرعت به شما پاسخ خواهند داد و مشکلات شما را حل خواهند کرد.

به ما بپیوندید و عضوی از خانواده بزرگ برنامه‌نویسان جاوااسکریپت شوید. فرقی نمی‌کند تازه‌کار هستید یا حرفه‌ای، اینجا جایی برای همه ماست.

🚀 لینک عضویت: @IR_javascript_group
این گروه توسط همین کانال پشتیبانی می شود پس می توانید در مورد مطالب کانال در آنجا به بحث و تبادل نظر بپردازید
منتظرتان هستیم تا با هم دنیای برنامه‌نویسی را تسخیر کنیم! 🌍

تگ picture : راه‌حلی برای بارگذاری بهینه تصاویر
تگ picture در HTML به شما امکان می‌دهد تصاویر مختلفی را برای دستگاه‌ها یا حالات نمایش متفاوت ارائه دهید. این امر به شما کمک می‌کند تا تصاویر را بهینه بارگذاری کنید و تجربه کاربری بهتری را برای مخاطبان خود فراهم کنید.
ساختار تگ picture به صورت زیر است:

<picture>
    <source media="(min-width:1024px)" srcset="/assets/large.png">
    <source media="(min-width:640px)" srcset="/assets/medium.png">
    <img src="/assets/small.png" alt="logo" style="width:auto;">
</picture>

#️⃣#tip
👥@IR_javascript_group
🆔@IR_javascript

جداکننده هزارگان در جاوا اسکریپت
یک سوال: "چه چیزی در کنسول چاپ خواهد شد؟"

console.log( 1_000 + 1_500 )

شاید فکر کنید که رشته‌ها با هم ترکیب می‌شوند و "1_0001_500" در کنسول چاپ می‌شود. یا شاید خطایی رخ دهد؟

در واقع، پاسخ 2500 خواهد بود، اما چرا؟

پاسخ ساده است: _ به عنوان یک جداکننده برای بهبود خوانایی استفاده می‌شود. به نظر شما، خواندن "یک میلیون" زمانی که به این صورت نوشته شده باشد (1_000_000) سریع‌تر نیست تا به این صورت (1000000) ؟

#️⃣#tip
👥@IR_javascript_group
🆔@IR_javascript

این موتور جستجو، هوش مصنوعی مناسب برای هر کار را به شما معرفی می‌کند!
اگر در جستجوی هوش مصنوعی مناسب برای انجام وظایف خود هستید و زمان زیادی را صرف گشت‌وگذار در میان گزینه‌های مختلف می‌کنید، خبر خوب این است که می‌توانید به راحتی هوش مصنوعی مورد نظرتان را پیدا کنید.

✨ به این منظور، یک موتور جستجوی تخصصی به نام TopAI.tools (https://topai.tools/) وجود دارد که به شما کمک می‌کند تا با توجه به نیازهای خود، هوش مصنوعی مناسب را پیدا کنید. فرقی نمی‌کند که به دنبال هوش مصنوعی برای برنامه‌نویسی، خلق تصاویر، نوشتن متن یا هر کار دیگری باشید، TopAI.tools می‌تواند به شما کمک کند.

نحوه استفاده:

درخواست خود را بر اساس علایق خود بنویسید.
در صورت نیاز، از فیلترها (مانند "رایگان") برای نتایج دقیق‌تر استفاده کنید.
هوش مصنوعی مورد نظر خود را انتخاب کنید و برای استفاده از آن به وب سایت آن مراجعه کنید.

#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript

مروری بر تگ های معنایی و کاربرد آن
سلام صبح/روز بخیر! تگ های معنایی در HTML روشی برای نشانه‌گذاری صفحات وب است که به جای تمرکز بر ظاهر صفحه، بر معنای هر بخش و ساختار منطقی سند تأکید دارد.

چرا به تگ های معنایی نیاز داریم؟

تگ های معنایی به موتورهای جستجو، مرورگرها، دستیارها و سایر ابزارها کمک می‌کند تا ساختار صفحه وب را بهتر درک کنند و تفسیر محتوای آن را آسان‌تر می‌کند. این امر به نوبه خود، دسترسی و سئو (SEO) را بهبود می‌بخشد.
تگ‌های اصلی معنایی:

<header>برای هدر</header>
<main>برای محتوای اصلی</main>
<footer>برای پاورقی</footer>
<article>بخش مستقل و کامل</article>
<section>بخش محتوا</section>
<aside>محتوای جانبی و غیرمستقیم</aside>
<nav>بخش ناوبری</nav>
<time>برای نمایش تاریخ و زمان</time>
<div>بلوکی که نتوان به آن معنای خاصی اختصاص داد</div>

#️⃣#tip #html
👥@IR_javascript_group
🆔@IR_javascript

ویژگی all در CSS
با استفاده از ویژگی all در CSS میتوان مشخص کرد که آیا تمامی ویژگی های یک عنصر به حالت اولیه یا مقدار پیش فرض خودشان ( مقداری که توسط مرورگرها مشخص شده ) نمایش داده شوند.

مقادیر قابل استفاده برای all:

‏initial: تمام خواص عنصر را به مقادیر پیش فرضشان که در استاندارد CSS تعریف شده است، بازنشانی می‌کند.
‏inherit: تمام خواص عنصر را از والد آن به ارث می‌برد.
‏unset: نگاه میکنه اگه عنصر پدری بود inherit اعمال میکنه و اگه پدری نبود initial رو اعمال میکنه
مثال استفاده:

.element {
  color: red;
  font-size: 20px;
  margin: 10px;
}

.element {
  /* تمام خواص به مقادیر اولیه بازنشانی می‌شوند */
  all: initial;
}

چه زمانی از all استفاده کنیم؟

هنگامی که می‌خواهید سبک‌های یک عنصر را به طور کامل بازنشانی کنید، معمولاً قبل از اعمال سبک‌های جدید.
در مواردی که یک عنصر باید دقیقاً مانند والد خود به نظر برسد.
هنگامی که می‌خواهید مطمئن شوید که سبک‌های خاص اعمال شده بر روی یک عنصر، بر روی عناصر فرزند آن یا سایر عناصر صفحه تأثیر نمی‌گذارند.

🔗https://free-learn.ir/%D9%88%DB%8C%DA%98%DA%AF%DB%8C-all-%D8%AF%D8%B1-css/

#️⃣#tip #css
👥@IR_javascript_group
🆔@IR_javascript

اگر ساکن مشهدید و میخاین مسیر فرانت رو شروع کنید فرصت خوبیه
از دستش ندید

معنی تگ‌ها در ساختار اولیه هر وب‌سایت
سلام به همه! هر بار که در VSCode یک پروژه جدید شروع می‌کنیم، این کار با یک سند HTML آغاز می‌شود، جایی که ترکیب "! + tab" را فشار می‌دهیم. پس از آن، ساختاری مانند تصویر بالا ظاهر می‌شود.

بیایید این ساختار را به طور مفصل بررسی کنیم:

<!DOCTYPE html>

— این خط به مرورگر می‌گوید که از HTML5 استفاده می‌شود، که برای تعیین نسخه HTML مورد استفاده و اطمینان از رندر صحیح صفحه ضروری است.

<html lang="en">

— این تگ نشان‌دهنده شروع سند HTML است. صفت lang="en" زبان صفحه (در این مورد انگلیسی) را مشخص می‌کند. این برای موتورهای جستجو و دسترسی مفید است.

<head>

— این تگ حاوی متادیتا در مورد سند مانند رمزگذاری، اطلاعات مشاهده و عنوان صفحه است. متادیتا در خود صفحه نمایش داده نمی‌شود.

<meta charset="UTF-8">

— این متاتگ رمزگذاری کاراکترها را برای سند تنظیم می‌کند. UTF-8 تقریباً از همه زبان‌های دنیا پشتیبانی می‌کند و استاندارد صفحات وب است.

<meta name="viewport" content="width=device-width,
initial-scale=1.0">

— این متاتگ برای طراحی واکنشگرا مهم است. به مرورگر می‌گوید که چگونه اندازه و مقیاس صفحه را مدیریت کند. در این مورد:

‏width=device-width عرض را به عرض دستگاه تنظیم می‌کند.
‏initial-scale=1.0 مقیاس اولیه را روی 100% تنظیم می‌کند.

<title>

— این تگ عنوان صفحه را که در برگه مرورگر نمایش داده می‌شود و توسط موتورهای جستجو استفاده می‌شود، تعیین می‌کند.

<body>

— این تگ حاوی تمام محتوای صفحه وب است که در مرورگر کاربر نمایش داده می‌شود - متن، تصاویر، پیوندها، جداول و غیر


#️⃣#tip #html
👥@IR_javascript_group
🆔@IR_javascript

‏RapidAPI‏: قطب اصلی API های جهان
‏RapidAPI.com، بزرگترین مرکز API جهان، توسط بیش از پنج میلیون توسعه دهنده برای یافتن، آزمایش و اتصال به هزاران API.

اضافه کردن API شما به این مرکز نیز رایگان و آسان است.
‏API های موجود می توانند متعلق به فرد باشند، یا می توانید تیم خود را اضافه کنید و تیم می تواند از ابزارهای موجود در استودیو برای ایجاد و مدیریت API های با کیفیت بالا استفاده کند، یا اینکه به صورت عمومی به اشتراک گذاشته شوند یا کسب درآمدزایی داشته باشند.
کد زیر برای دسترسی به chat gpt 4 هست که در این هاب وجود دارد فقط باید در این سایت عضو شده و سپس RapidAPI-Key دریافت کنید.
1000 درخواست در ماه رایگان است

curl --request POST \
  --url https://chatgpt-42.p.rapidapi.com/conversationgpt4-2 \
  --header 'Content-Type: application/json' \
  --header 'x-rapidapi-host: chatgpt-42.p.rapidapi.com' \
  --header 'x-rapidapi-key:  YOUR_RAPID_KEY' \
  --data '{"messages":[{"role":"user","content":"hello"}],"system_prompt":"","temperature":0.9,"top_k":5,"top_p":0.9,"max_tokens":256,"web_access":false}'

‏Xterm.js - ترمینال تحت وب
یک کامپوننت فرانت‌اند نوشته شده به زبان TypeScript که به برنامه‌ها اجازه می‌دهد تا ترمینال‌ها را در مرورگر ارائه دهند. Xterm در پروژه‌های محبوب مانند VS Code، Hyper و Theia استفاده می‌شود.



#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript