جاوااسکریپت | 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

👍4

305 views_, 10:18

جاوااسکریپت | 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

🔥2

326 views_, 10:28

جاوااسکریپت | JavaScript

Forwarded from گروه نرم‌افزاری دانش‌بنیان پارت مشهد

0:08

This media is not supported in your browser

VIEW IN TELEGRAM

🐌 استقبال بی‌نظیر شما در روز ابتدایی ثبت‌نام دوره "توربوفرانت چهار" به ما انگیزه مضاعفی داده! با حمایت و وجود شماست که امروز کالج تخصصی و رایگان پارت، پرآوازه و موفق شده و این انرژی مثبت شما مسئولیت ما رو سنگین و سنگین‌تر می‌کنه!

🐌ثبت‌نام "توربوفرانت چهار" همچنان ادامه داره؛ این فرصت بی‌نظیر رو از دست ندید و مسیر شغلی آینده‌تون پر از چراغ‌های پرنوری رو روشن کنین که قدم زدن درونش رو براتون تسهیل و لذت‌بخش کنه.

💗اطلاعات بیشتر و ثبت‌نام از طریق سایت گروه نرم‌افزاری پارت:

🎓

🔹

🅿️

website

🆔

instagram

🆔

Please open Telegram to view this post

VIEW IN TELEGRAM

❤1

156 views_, 17:55

جاوااسکریپت | JavaScript

گروه نرم‌افزاری دانش‌بنیان پارت مشهد

🐌 استقبال بی‌نظیر شما در روز ابتدایی ثبت‌نام دوره "توربوفرانت چهار" به ما انگیزه مضاعفی داده! با حمایت و وجود شماست که امروز کالج تخصصی و رایگان پارت، پرآوازه و موفق شده و این انرژی مثبت شما مسئولیت ما رو سنگین و سنگین‌تر می‌کنه! 🐌ثبت‌نام "توربوفرانت چهار"…

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

👌1

166 views_, 17:55

جاوااسکریپت | 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

❤2

294 views_, 10:42

جاوااسکریپت | JavaScript

ChatGPT For Programming

#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript

👍2

290 views_, 07:46

جاوااسکریپت | 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}'

👍1

459 views_, 09:20

جاوااسکریپت | JavaScript

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

#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript

👍3❤2

432 views_, 02:11

جاوااسکریپت | JavaScript

‏Snap.svg - کتابخانه JavaScript برای گرافیک SVG
کتابخانه JavaScript Snap.svg کار با SVG را به آسانی jQuery برای DOM تبدیل می‌کند. Snap.svg برای مرورگرهای مدرن طراحی شده است و به همین دلیل از جدیدترین قابلیت‌های SVG مانند ماسک‌گذاری، برش، گرادیان کامل، گروه‌ها و موارد دیگر پشتیبانی می‌کند.

#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript

304 views_, 14:51

جاوااسکریپت | JavaScript

‏Embla Carousel - کتابخانه JS سبک برای ایجاد Carousel
Embla Carousel یک کتابخانه JavaScript سبک و بدون وابستگی است که به شما کمک می‌کند تا به آسانی Carousel زیبا و تعاملی ایجاد کنید. این کتابخانه دارای API و پلاگین‌های به راحتی قابل‌گسترش است و می‌تواند به شما در حل پیچیده‌ترین مشکلات مربوط به ایجاد Carousel کمک کند. Embla Carousel در تمام مرورگرهای مدرن به خوبی کار می‌کند.

#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript

❤2

256 views_, 15:15

جاوااسکریپت | JavaScript

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

🔗https://www.figma.com/design/GSnbPCsdixiq2KQxAvdhxh/3%2C800%2B-Free-Icons---Open-Source-Figma-Icon-Library-(Community)?node-id=0-1

🔗 https://www.figma.com/design/qri3jAHmUrPi9R8DD74hUO/3000%2B-Customizable-Icon-Pack-(Community)?node-id=0-1

#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript

247 views_, 15:08

جاوااسکریپت | JavaScript

نوار پایین متحرک
مجموعه‌ای از نوارهای پایین متحرک که با استفاده از CSS و JavaScript پیاده‌سازی شده‌اند.

🔗https://codepen.io/chrisbautista/pen/NWXjqLN

#️⃣#code
👥@IR_javascript_group
🆔@IR_javascript

❤1

257 views_, 05:15

جاوااسکریپت | JavaScript

راهنمای کوچک TypeScript - برای توسعه‌دهندگان فرانت‌اند

#️⃣#tip
👥@IR_javascript_group
🆔@IR_javascript

👍2

366 views_, 17:18

About

Blog

Apps

Platform