ایجاد یک افزونه Extension برای گوگل‌کروم با کمک هوش‌مصنوعی
یک برنامه‌نویس هم یک مخترع است و هم یک هنرمند، یک مخترع است چون ابداع‌گر روشی برای انجام بهتر و سریع‌تر و دقیق‌تر کاری است و هنرمند است چون طبق تعریف دانشنامه بریتانیکا هنر یعنی «استفاده از توانایی و تخیل در خلق آثار زیبا، محیط یا تجاربی که می‌توان با دیگران به اشتراک گذاشت». از آنجایی که یک برنامه نویس پیش از نوشتن برنامه باید در ذهن خود آن را مجسم نموده و با کمک تخیل خود آن را در ذهن بسازد و سپس با پیاده‌سازی آن به یک زبان برنامه‌نویسی، آن را خلق کرده و در اختیار دیگران قراردهد، لذا مانند یک هنرمند تجسمی عمل می‌کند. اما در این میان هوش مصنوعی چه کمکی به ما در انجام کارها می‌نماید؟ حتما شنیده‌اید و بسیار عنوان‌شده که با هوش‌مصنوعی، برنامه‌نویسی از میان می‌رود؟ برنامه‌نویسان نخستین قربانیان هنر خودشان هستند؟ و از این‌گونه نوشته‌ها، اما واقعیت این است هنوز برنامه‌نویسی نیازمند تخیل است که هوش مصنوعی فاقد آن است(حداقل تا امروز) این یک برنامه‌نویس است که با تخیل خودش برنامه را در ذهن پرورش می‌دهد و پیش از آنکه آن را خلق کند، در ذهن خودش آن را بدون در نظر گرفتن زبانی که میخواهد با آن اقدام به برنامه‌نویسی کند می‌سازد، البته یک برنامه‌نویس ایده‌آل تنها به ذهن اکتفا نکرده و با کمک ابزارهای مناسب اول آن ایده‌ذهنی را بر روی کاغذ می‌آورد.
این مقدمه بسیار طولانی شد، در این مقاله می‌خواهیم یک افزونه یا همان Extension به گوگل‌کروم اضافه کنیم که مثلا یک پیام به ما بدهد و ...، لازم به ذکر است برای این منظور از هوش مصنوعی دیپ‌سیک استفاده شده‌است(بدلیل رایگان و قابل دسترس بودن) البته باید گفت من خودم با جاوا اسکریپت را در حد یک مبتدی آشنایی دارم و هیچ‌گونه آشنایی با نحوه ایجاد یک افزونه در گوگل‌کروم را ندارم
پیش از شروع باید بگویم برای نوشتن چنین کدی بدون کمک هوش‌مصنوعی، نیاز به دانستن جاوا اسکریپت در سطح حرفه‌ای دارید، باید با افزونه‌های گوگل‌کروم و ساختار آن آشنا باشید(برای دانست همین‌ها نیاز به حداقل 10 روز زمان دارید) اما با هوش‌مصنوعی در کمتر از یکساعت برنامه‌ای را تولید می‌کنید که به مراتب دقیق‌تر و بهتر از برنامه شما پاسخ می‌دهد.
هوش مصنوعی دیپ‌سیک را باز کنید. مطابق شکل روی گزینه Deepseek V3 کلیک کنید، اگر عضو نشده‌اید، عضو شوید.
حال فضای چت با دیپ‌سیک آماده است و می‌توانید با آن تعامل نمایید.
توجه کنید: بدلیل آنکه هوش‌مصنوعی با هر تعامل با کاربران دامنه دانش آن افزایش می‌یابد، امکان دارد پاسخی که شما دریافت می‌کنید با چیزی که در اینجا گفته می‌شود کمی متفاوت باشد اما نگران نباشید در اصل موضوع هیچ تغییری حاصل نمی‌شود. در باکس مربوط به چت به فارسی بنویسید:
دکمه Enter را بزنید، بلافاصله شاهد نتیجه آن که توسط هوش‌مصنوعی تولید می‌شود باشید. برای مثال برای من این اطلاعات نمایش داده شد:
1. هدف افزونه چیست؟
چه مشکلی را حل می‌کند؟
چه ویژگی‌هایی باید داشته باشد؟ (مثلاً تغییر ظاهر صفحات، ذخیره داده، ارتباط با سرور، و...)
2. میزان پیچیدگی افزونه
آیا افزونه نیاز به پس‌زمینه (background scripts) دارد؟
آیا به دسترسی به محتوای صفحات (content scripts) نیاز دارید؟
آیا نیاز به ذخیره‌سازی داده (local storage یا sync storage) دارید؟
3. مثال ساده از یک افزونه پایه
اگر می‌خواهید یک افزونه ساده بسازید که مثلاً متن صفحات را تغییر دهد، این کدهای پایه را می‌توانید استفاده کنید:
4. تست و انتشار افزونه
برای تست، به
chrome://extensions/بروید و Developer Mode را روشن کنید.سپس Load Unpacked را بزنید و پوشه افزونه را انتخاب کنید.
اگر بخواهید آن را در Chrome Web Store منتشر کنید، باید حساب توسعه‌دهنده گوگل (با پرداخت هزینه یک‌باره) ایجاد کنید.
اگر جزئیات بیشتری از افزونه مورد نظرتان بگویید، می‌توانم راهنمایی دقیق‌تری ارائه کنم! 😊
مثلاً:
آیا افزونه نیاز به کار با تب‌ها دارد؟
آیا باید داده‌ها را ذخیره کند؟
آیا باید با سرور ارتباط برقرار کند؟
باز عنوان می‌کنمشاید برای شما پاسخ‌ها کمی متفاوت باشد اما در نهایت نتیجه(منظور ایجاد یک افزونه می‌باشد) یکسان خواهد بود، برای تست موضوع و بررسی نتیجه مطابق دستورالعمل دیپ‌سیک یک فولدر می‌سازیم و درون آن فایلهای manifest.json و content.js و popup.html با محتویات‌شان که توسط دیپ‌سیک داده‌شده قرارمی‌دهیم، توجه نمایید باید برای ایبن افزونه یک فایل آیکون ذخیره نمایید( به محتویات فایل manifest.json نگاه‌کنید. یک فایل آیکون icon.png با این نام در فولدر مربوطه قرار دهید(به پیوست یک فایل نمونه موجود است)
در بخش 4 نحوه بارگذاری این افزونه نیز باز توسط دیپ‌سیک شرح داده‌شده، مطابق آن کار را انجام دهید، تبریک می‌گویم حالا شما یک افزونه برای گوگل‌کروم تهیه کرده‌اید، آن را تست کنید.
حال می‌خواهم تغییراتی در این افزونه بدهم، که تعداد Tabهای موجود در گوگل‌کروم را نمایش دهد، کافی است از دیپ‌سیک بخواهید:
بلافاصله نتیجه حاصل است:
فایل manifest.json
{
"manifest_version": 3,
"name": "Tab Counter",
"version": "1.0",
"description": "نمایش تعداد تب‌های باز در پنجره فعلی",
"action": {
"default_popup": "popup.html",
"default_icon": "icon.png"
},
"permissions": ["tabs"]
}فایل popup.html
<!DOCTYPE html>
<html>
<head>
<title>Tab Counter</title>
<script src="https://qliksaaz.ir/popup.js"></script>
<style>
body {
width: 200px;
padding: 10px;
text-align: center;
font-family: Arial, sans-serif;
}
h1 {
font-size: 16px;
color: #333;
}
</style>
</head>
<body>
<h1 id="tabCount">در حال شمارش تب‌ها...</h1>
</body>
</html>فایل popup.js
// شمارش تب‌های پنجره فعلی و نمایش آن
chrome.tabs.query({ currentWindow: true }, (tabs) => {
document.getElementById("tabCount").textContent =
`تعداد تب‌ها: ${tabs.length}`;
});مطابق با فایلهای بالا تغییرات را اعمال کنید و حالا افزونه قبلی را از گوگل‌کروم حذف و افزونه جدید را وارد نمایید و با انتخاب آن تعداد Tabها نمایش داده‌می‌شود.
در زمان کار با هوش مصنوعی و تهیه یک برنامه به کمک آن نیاز است به موارد زیر توجه شود.
- از توضیحات زیاد بپرهیزید زیرا باعث گمراهی هوش‌مصنوعی می‌گردد
- نخست برنامه مورد نظر خود را تجسم کرده و آن را به قطعات کوچک و قابل توضیح به هوش مصنوعی تقسیم کنید.
- برای تهیه هر تکه آن را به وضوح و سادگی توضیح‌دهید، دقت کنید توضیحات پیچیده فقط باعث اتلاف وقت بوده و نتیجه نخواهد داد.
- هر تکه را با کمک هوش‌مصنوعی تهیه‌نمایید.
- قراردادن آن تکه‌ها کنار هم برای تهیه برنامه اصلی به عهده خود شماست، اگر خواستید می‌توانید آنها را هم با کمک هوش‌مصنوعی یکپارچه کنید.
شاید فکر کنید، چقدر راحت فقط با دو جمله کوتاه توانستیم یک افزونه برای گوگل‌کروم بنویسیم، اما این خیال باطل را از سر بیرون کنید، برنامه‌های بالا خیلی ساده بودند، حال بیایید و افزونه‌ی بسازید که بتواند فایلهای ویدئواستریم را دانلود کند، مثلا بتواند از سایت‌هایی نظیر یوتیوب فیلم دانلود نماید، خواهید دید کاری آسان و ساده نیست، بجز مهارت در برنامه‌نویسی نیاز به دقت بسیار زیادی در توضیح‌دادن به هوش‌مصنوعی دارد و کوچک‌ترین توضیح نادرست و یا توضیح‌های اضافی و یا کم باعث گمراهی هوش‌مصنوعی می‌گردد، و گمراهی آن کل تلاش شما را یکجا به نابودی می‌کشاند و باعث می‌شود مجبور شوید دوباره و از نو اقدام به تولید برنامه کنید.
فایلهای مطلب
افزونه تعداد تب‌های کروم (1.29 کیلو بایت)
