01 / شرح پروژه
مسئله چه بود؟
مینت NFT برای کاربر فقط انتخاب تعداد و زدن یک دکمه نیست. کیف پول باید متصل باشد، شبکه انتخاب‌شده با شبکه محصول هماهنگ باشد و تعداد و مبلغ تراکنش با قواعد قرارداد سازگار باشند. پس از ارسال نیز کاربر باید تفاوت انتظار برای تأیید، موفقیت و خطا را بفهمد. مسئله این پروژه، پیوند دادن رابط وب با این چرخه و نمایش اطلاعات قرارداد در یک مسیر قابل فهم بود.
نقش من در پروژه
در سال ۱۴۰۰، توسعه فرانت‌اند و بک‌اند مبتنی بر قرارداد هوشمند این پروژه را انجام دادم. در فرانت‌اند، رابط React و ارتباط کیف پول با قرارداد از طریق ethers.js و Web3 پیاده شد. بخش بک‌اند بلاکچینی با Solidity توسعه یافت. تمرکز کار، اتصال قواعد مینت و عرضه به رابط کاربری، مدیریت وضعیت کیف پول و شبکه و پیگیری نتیجه تراکنش بود.
اتصال کیف پول و کنترل شبکه
ورود به مسیر مینت با شناسایی حساب و شبکه کیف پول آغاز می‌شود.
اتصال کیف پول
پیاده‌سازی اتصال کیف پول با Web3Modal و WalletConnect و پشتیبانی از کیف پول مرورگر؛ دریافت حساب کاربر و ارائه وضعیت اتصال در رابط.
بررسی شبکه انتخاب‌شده
خواندن شناسه شبکه و مقایسه آن با شبکه مورد انتظار برنامه. در صورت ناسازگاری، اتصال برای ادامه مینت پذیرفته نمی‌شود و وضعیت خطا در رابط مدیریت می‌شود.
تغییر حساب و قطع اتصال
مدیریت رویدادهای کیف پول، تغییر شبکه و قطع اتصال، همراه با پاک‌کردن وضعیت ذخیره‌شده؛ برای هماهنگ نگه‌داشتن رابط با وضعیت واقعی حساب.
فرایند مینت و تجربه تراکنش
اطلاعات عرضه از قرارداد خوانده می‌شود و انتخاب کاربر به تراکنش پرداخت و مینت تبدیل می‌شود.
نمایش اطلاعات عرضه
خواندن قیمت، تعداد مینت‌شده، سقف عرضه، حداقل و حداکثر تعداد مجاز در هر مینت و تعداد رزروشده از قرارداد؛ برای نمایش شرایط جاری به کاربر.
تعداد و مبلغ مینت
اعتبارسنجی تعداد انتخابی با حدود مجاز و محاسبه مبلغ بر اساس قیمت و تعداد. درخواست مینت به قرارداد با مقدار پرداخت متناظر ارسال می‌شود.
انتظار، موفقیت و خطا
انتظار برای تأیید تراکنش و نمایش نتیجه؛ سپس دریافت دوباره اطلاعات عرضه. خطاهایی مانند مبلغ ناکافی، تعداد نامعتبر یا باقی‌نماندن NFT در رابط به پیام قابل فهم تبدیل می‌شوند.
قرارداد NFT و قواعد عرضه
بک‌اند این تجربه بر قرارداد Solidity و رابط ارتباطی آن با برنامه وب تکیه دارد.
مالکیت و انتقال NFT
رابط قرارداد شامل توابع مالکیت، موجودی، انتقال و مجوزهای NFT مطابق الگوی ERC-721 است؛ در کنار دسترسی به اطلاعات و شناسه‌های توکن.
تنظیم قیمت و محدودیت‌ها
در ABI قرارداد، قابلیت تنظیم قیمت، سقف عرضه و حداقل و حداکثر تعداد مینت وجود دارد. رابط مینت، شرایط جاری را از قرارداد دریافت می‌کند.
رزرو و متادیتا
رابط قرارداد قابلیت رزرو NFT و تنظیم نشانی پایه متادیتا را در کنار خواندن tokenURI ارائه می‌دهد؛ برای ارتباط دارایی روی زنجیره با اطلاعات معرفی آن.
رابط وب و مسیر معرفی محصول
پیاده‌سازی React
رابط وب با React و JavaScript و مسیرهای مستقل برای صفحه اصلی و مطالب تکمیلی پیاده شده است. منطق کیف پول و فرم مینت در اجزای جدا قرار دارد.
چیدمان موبایل و دسکتاپ
در سورس، سبک‌ها و اجزای مختص نمایش موبایل و دسکتاپ وجود دارند؛ برای نمایش محتوای معرفی و دسترسی به مسیر مینت در اندازه‌های مختلف صفحه.
اطلاعات مالکیت و شرایط
صفحات توضیح مالکیت دارایی دیجیتال و شرایط محصول در کنار معرفی قرار دارند؛ تا اطلاعات تکمیلی از مسیر اصلی تعامل با کیف پول جدا و قابل دسترس باشد.