مهاجرت کامل دیزاین سیستم با کمک Claude
فرانتاند
هوش مصنوعی
ریاکتخلاصهٔ کامل‌تر
سویزک تلر تو این پست می‌گه برای اولین بار تو کارنامه‌اش یه مهاجرت دیزاین سیستم رو واقعاً تموم کرده. تیمشون فایل‌هایی که @mui/joy رو import می‌کردن تو یه هفته از ۵۹۲ به ۱۴۶ رسوند و یه هفته‌ی دیگه هم بقیه رو جمع کرد. به گفته‌ی نویسنده، تو شرکت‌های بزرگ همیشه وسط یه مهاجرت یا بازنویسی هستی، و مهم اینه که چطور مدیریتش کنی.
مشکل این بود که JoyUI (یه کتابخونه‌ی کامپوننت که روش CSS-in-JS داره و دیگه پشتیبانی نمی‌شه) تو React خوب کار می‌کرد، ولی تو صفحه‌های Jinja و HTMX استفاده‌اش سخت بود. نتیجه شد ترکیبی از Bootstrap، CSS دستی، استایل‌هایی که AI سرهم کرده بود و صفحه‌های React که نصفه‌نیمه از دیزاین سیستم پیروی می‌کردن. نویسنده می‌گه مهندس‌ها تنبل نیستن، سرشون شلوغه؛ وقتی ابزار درست دم دستشون نیست، هر کسی راه خودشو می‌ره و هر صفحه شبیه کار یه آدم متفاوت میشه.
قدم‌های اولشون ساده بود: یه پوسته‌ی Tailwind با رنگ‌های برند، یه کتابخونه‌ی کوچیک با ShadCN و BaseUI، تنظیماتی که کامپوننت قدیم و جدید بتونن بدون افتضاح کنار هم باشن، یه فایل DESIGN.md که مسیر مهاجرت رو توضیح می‌ده، و چندتا linter که مجبورشون کنه از دیزاین سیستم استفاده کنن. بعد یه مهاجرت big bang زدن (یعنی همه‌ی استایل‌های Jinja و HTMX رو تو یه PR بزرگ بازنویسی کردن) و دو روز باگ‌هاشو درست کردن.
بعد حدود یه ماه گذاشتن سیستم جا بیفته: کامپوننت اضافه کردن، هر جا ایجنت اشتباه کرد دستورالعمل‌ها رو بهتر کردن و linterها رو قوی‌تر کردن. وقتی جواب ایجنت به یه دستور ساده مثل «این صفحه رو با ShadCN بازنویسی کن، همه‌ی قابلیت‌ها رو نگه دار و اسکرین‌شات قبل و بعد بذار» مدام خوب شد، نوبت فاز دوم رسید. نویسنده یه بار Claude رو ۶ یا ۷ ساعت ول کرد و حاصلش ۴۵ PR روی ۸ استک بود.
به گفته‌ی نویسنده، دو تا ترفند کار رو جلو برد: گرفتن اسکرین‌شات قبل و بعد برای مقایسه‌ی تصویری، و مهاجرت به شکل vertical slice، یعنی هر PR فقط یه صفحه رو کامل منتقل کنه تا بدون دردسر برای بقیه merge بشه. آخر کار هم تیم اول سراغ بخش‌های پرتأثیر رفت و بعد فایل‌های جامونده رو پیدا کرد.
نکته‌ی آخر نویسنده اینه که پاک‌سازی کامل خیلی مهمه. ایجنت‌ها کدبیس موجود رو تقویت می‌کنن؛ از اصول پایه فکر نمی‌کنن ولی تو «این فیچر رو مثل اون یکی بساز» عالی‌ان. پس اگه کد قدیمی بمونه ازش تقلید می‌کنن. وقتی همه‌چی تمیز باشه، هر مهندسی بدون فکر اضافه کار خوب تحویل می‌ده.
نکات کلیدی:
- فایل‌های وابسته به @mui/joy تو یه هفته از ۵۹۲ به ۱۴۶ رسید
- دیزاین سیستم جدید روی Tailwind، ShadCN و BaseUI ساخته شد
- Claude تو یه اجرای ۶ تا ۷ ساعته ۴۵ PR روی ۸ استک ساخت
- اسکرین‌شات قبل و بعد و مهاجرت صفحه به صفحه کلید اعتبارسنجی بود
- ایجنت‌ها از الگوهای موجود تقلید می‌کنن، پس کد قدیمی باید کامل حذف بشه
