Modern Web Guidance



‫Modern Web Guidance مجموعه‌ای از مهارت‌ها است که تخصص پلاتفرم وب، روال‌های مطلوب، و داده‌های سازگاری مرورگر را مستقیماً در عامل‌های کدنویسی شما جاسازی می‌کند.

نصب با modern-web-guidance CLI (توصیه‌شده):

npx modern-web-guidance@latest install
شروع به کار مشاهده در GitHub

با عامل کدنویسی هوش مصنوعی موردنظرتان کار می‌کند

می‌توان از Modern Web Guidance با عامل‌های کدنویسی هوش مصنوعی دلخواهتان استفاده کرد تا مطمئن شوید که در گردش کار ترجیحی‌تان به راهنمایی برای روال‌های مطلوب وب مدرن دسترسی دارید.
مشاهده همه گزینه‌های نصب

Modern Web Guidance را بااستفاده از «مهارت‌های عامل» Vercel در پروژه‌تان نصب کنید:

npx skills add GoogleChrome/modern-web-guidance

‫Modern Web Guidance را از افزایه‌های Claude Code نصب کنید:

claude plugin install modern-web-guidance@claude-plugins-official

نصب Modern Web Guidance مهارت برای Copilot CLI:

# 1. Add the marketplace:
/plugin marketplace add GoogleChrome/modern-web-guidance
# 2. Install the plugin
/plugin install modern-web-guidance@googlechrome

نصب کردن مهارت‌های Modern Web Guidance برای Antigravity CLI:

agy plugin install https://github.com/GoogleChrome/modern-web-guidance
برای کسب اطلاعات بیشتر درباره مهارت‌ها و نحوه بهبود گردش کار توسعه وب با کمک هوش مصنوعی، جلسه Modern Web Guidance را در Google I/O تماشا کنید.
اکنون تماشا کنید

پیام‌واره‌هایی برای تجربه کاربری بهتر

چند نمونه پیام‌واره زیر را امتحان کنید تا Modern Web Guidance را در گردش کار کدنویسی با کمک هوش مصنوعی فراخوانی کنید و ویژگی‌های جدید بسازید، کد قدیمی را مدرن کنید، و سرعت برنامه‌تان را افزایش دهید. 
Create an accordion-style stats component that smoothly animates on open and close.
 
Build a tab bar with a sliding highlight that tracks active items using CSS Anchor Positioning.
 
Design a dashboard card that uses container queries to adapt its layout to its own width.
 
Update legacy modal window implementations to use the <dialog> element and animate them using modern CSS features.
 
Migrate legacy tooltips to use the Popover API and CSS Anchor Positioning.
 
Implement a passkey-based login flow using the latest WebAuthn features.
 
Implement a starter Content Security Policy (CSP) without breaking my app.
 
Perform a security audit of my site and suggest improvements.
 
Set up my app to begin preloading pages when users hover over important links.
 
My app has lots of long tasks, and its INP is affected. Help me fix it.
 
Help me improve my app's LCP.
ببینید چگونه می‌توانید دستیاران کدنویسی هوش مصنوعی خود را برای تولید کد وب پیشرفته و هم‌کنش‌پذیر راهنمایی کنید! در این codelab مقدماتی، یک برنامه وب قدیمی را ممیزی خواهید کرد و از ابزار Modern Web Guidance برای هدایت عامل‌ها به‌سمت روال‌های مطلوب مدرن استفاده خواهید کرد. یاد بگیرید که چگونه اهداف مرورگر Baseline را تنظیم کنید، «شاخص‌های کلیدی عملکرد وب» را بهینه‌سازی کنید، و خروجی‌های عمومی هوش مصنوعی را به راه‌حل‌های وب با عملکرد بالا تبدیل کنید.
شروع به کار
‫Chrome DevTools برای عامل‌ها را با مهارت‌های Modern Web Guidance ترکیب کنید تا گردش کار توسعه وب خود را بهبود بخشید. ممیزی‌های عملکرد هم‌زمان را اجرا کنید، درخت‌های دسترس‌پذیری را بازرسی کنید، و گزارش‌های کنسول را ضبط کنید—سپس اصلاحات دقیق کد وب مدرن را به‌طور خودکار اعمال کنید.
بیشتر بدانید

با نحوه همیاری آشنا شوید

ایده‌ای برای بهبود Modern Web Guidance دارید؟ با نحوه همیاری آشنا شوید!
بیشتر بدانید