ویدیو دوبله شده در مورد نکات کلیدی برای پرامت نویسی ChatGPT [+لینک]

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

🔗https://www.aparat.com/v/dog93mg
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript

کتابخانه الگوها

مجموعه‌ای از الگوهای رایگان برای پروژه شما. همه موارد به‌صورت رایگان ارائه می‌شوند و با یک کلیک قابل دانلود هستند.


🔗http://thepatternlibrary.com/#green-goblin
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript

کمی از زیبایی‌شناسی SQL بصری و نظریه مجموعه‌ها

#️⃣#tip
👥@IR_javascript_group
🆔@IR_javascript

فروت لوپر: SVG

انیمیشن جعبه با استفاده از GSAP.

🔗https://codepen.io/johnjoeparrot/pen/yLdRwrp
#️⃣#code
👥@IR_javascript_group
🆔@IR_javascript

Shepherd.js — راهنمای کاربری

یک تور راهنمای تعاملی برای کاربران سایت خود ارائه دهید.

🔗https://github.com/shipshapecode/shepherd
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript

خبر مهم!

‏Codeium نسخه‌ای فورک شده از VS Code به نام Windsurf Editor معرفی کرده است (می‌توانید از اینجا آن را دانلود و امتحان کنید). این حرکت نشان‌دهنده تلاش Codeium ارائه یک محیط توسعه یکپارچه با قابلیت‌های پیشرفته است.

🔗https://windsurf.ai/
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript

Progressive-Image.js

‏Progressive-Image.js یک کتابخانه برای بارگذاری تدریجی تصاویر است. این کتابخانه ابتدا یک تصویر کوچک و تار نمایش می‌دهد که به مرور زمان با تصویر کامل جایگزین می‌شود. این روش تجربه کاربری (UX) را بهبود می‌بخشد.

🔗https://github.com/craigbuckler/progressive-image.js
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript

در Vue یک ساختار کم‌استفاده برای ارتباط بین متغیرهای جاوااسکریپت و ویژگی‌های CSS وجود دارد که گاهی از v-bind در بخش style راحت‌تر است:

<template>
  <div class="text">Hello, Vue!</div>
</template>

<script setup>
import { ref } from 'vue';

const color = ref('red');
</script>

<style scoped vars="{ colorVar: color }">
.text {
  color: var(--colorVar);
}
</style>

این نحوه نوشتار، نسخه‌ی اول ویژگی‌های CSS واکنش‌گرا در Vue 3 است.

سپس، ایوان نسخه‌ای با استفاده از v-bind() ارائه کرد که برخی از محدودیت‌های vars را حل می‌کند.

#️⃣#tip
👥@IR_javascript_group
🆔@IR_javascript

Mockup Ceacle
مجموعه‌ای از موکاپ‌های رایگان که بر اساس دسته‌بندی‌ها تقسیم‌بندی شده‌اند.

🔗https://mockup.ceacle.com/search?kind=all&view=all&order=popular&q=%22free%22
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript

TypeIt

‏TypeIt یک کتابخانه جاوااسکریپت برای انیمیشن‌سازی تایپ متن است. این کتابخانه به شما امکان می‌دهد تا فرآیند تایپ متن را مستقیماً در صفحه وب شبیه‌سازی کنید و حس نوشتن واقعی را ایجاد کنید.

🔗https://github.com/alexmacarthur/typeit
#️⃣#npm_module
👥@IR_javascript_group
🆔@IR_javascript

Nicepage
در این سایت بیش از پانزده هزار قالب رایگان برای CSS جمع‌آوری شده است.

🔗https://nicepage.com/css-templates
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript

لیستی از سایت ها و کانال هایی که در آنها می توانید قالب های رایگان پیدا کنید

https://themelock.com/eng/
https://nullmart.net/
https://scriptmafia.org/category/templates/


https://t.me/ingressive4good
https://t.me/themelock
https://t.me/nullmart
https://t.me/DesignGoodies
https://t.me/EnvatoFreebies
https://t.me/michollo

اگر مورد دیگری را میشناسید در بخش نظرات مطرح کنید

#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript

Flexboxdefense
‏
یک بازی در سبک Tower Defense است که در آن باید برج‌ها را با استفاده از فِلکس‌باکس به درستی قرار دهید تا از حملات دفاع کنید.


🔗http://www.flexboxdefense.com/
#️⃣#tool
👥@IR_javascript_group
🆔@IR_javascript

دینامیک کردن نام‌های ویژگی‌ها 🥸

وقتی درباره ویژگی‌های دینامیک در جاوااسکریپت صحبت می‌کنیم، معمولاً به انعطاف‌پذیری و راحتی آن فکر می‌کنیم: می‌توانیم اشیاء را در حین اجرا ایجاد کنیم بدون اینکه نیاز داشته باشیم همه کلیدها را از پیش بدانیم. اما مانند هر ابزار دیگری، مهم است که بدانیم کی از آن استفاده کنیم و چگونه از اشتباهات جلوگیری کنیم.

➡️ کی مفید است؟

به عنوان مثال، در هنگام توسعه سیستم‌های ردیابی رویدادها یا لاگ‌ها، معمولاً نیاز است که هر شیء کلید منحصر به فردی داشته باشد – برای مثال، بر اساس زمان وقوع رویداد. به جای ایجاد یک شیء استاتیک، می‌توان ویژگی دینامیک با برچسب زمانی که برای هر رویداد منحصر به فرد است، اضافه کرد.

function logEvent(event) {
  const timestamp = new Date().toISOString();
  return {
    [timestamp]: event,
  };
}

console.log(logEvent("User logged in")); // { '2024-11-11T09:19:04.939Z': 'User logged in' }

➡️ چه نکاتی باید در نظر گرفته شود؟

✨ یکی از مشکلات بالقوه با کلیدهای دینامیک، امکان نداشتن ویژگی است. به عنوان مثال، در دسترسی به object[dynamicKey]، جاوااسکریپت تضمین نمی‌کند که این کلید واقعاً در شیء موجود باشد و در صورتی که نباشد، undefined را برمی‌گرداند؛
✨ زمانی که کلیدها بر اساس متغیرها ایجاد می‌شوند، کد برای کسانی که بعداً آن را می‌خوانند کمتر قابل پیش‌بینی می‌شود. بنابراین، برای اینکه کد قابل فهم باقی بماند، نباید از ویژگی‌های دینامیک به طور افراطی استفاده کرد و باید ساختار داده‌ها مستند شود.

در نهایت، ویژگی‌های دینامیک می‌توانند زمان زیادی را برای شما صرفه‌جویی کرده و کد را ساده‌تر کنند، اما تنها در صورتی که با دقت از آن‌ها استفاده کنید. 👍

پ.ن. پیاده‌سازی‌ها برای درک راحت‌تر ساده شده‌اند :)

#️⃣#tip
👥@IR_javascript_group
🆔@IR_javascript