ساخت داشبورد استقرار در کنسول شما
این دورهٔ رایگان 10 فصل دارد. شما Acme Deploys را از صفحه‌ای خالی تا اپی مستقرشده با مسیرها، داده و آزمون‌ها می‌سازید. هر فصل هنگام مطالعه به‌صورت زنده در DevTools اجرا می‌شود.
پیشرفت0/10
- 01شروع کاریک برنامه بسازید، اولین صفحه را رندر کنید و به یک کلید پاسخ دهید.5 دقیقه
- 02چیدمان با Boxساختار داشبورد را با Flexbox در سلول‌ها بسازید: یک نوار بالا، یک نوار کناری و کارت‌ها.7 دقیقه
- 03متن و سبک‌دهیبه یک کارت استقرار با رنگ‌ها، ویژگی‌های متن و توکن‌های پوسته سبک بدهید.6 دقیقه
- 04ورودی و نقشهٔ کلیدهابا صفحه‌کلید بین استقرارها جابه‌جا شوید و یک لایهٔ راهنما با ? اضافه کنید.8 دقیقه
- 05مسیریابیبرنامه را به مسیرهایی با چیدمان مشترک، پیوندهای دارای میان‌بر و تاریخچه تقسیم کنید.8 دقیقه
- 06داده و کنترل‌گرهای مسیراستقرارها را از app/api ارائه کنید، در یک صفحه واکشی کنید و استقرارهای جدید را ارسال کنید.8 دقیقه
- 07Table، List و نمودارهاردیف‌های دست‌ساز را با Table مرتب‌شدنی و نموداری جایگزین کنید که چیدمان را جابه‌جا نمی‌کند.7 دقیقه
- 08آزمونخارج از صفحه رندر کنید، کلیدها را فشار دهید و فریم را به‌صورت متن در آزمون بررسی کنید.6 دقیقه
- 09اجرا در ترمینالهمان داشبورد را با دستور text run به‌صورت تمام‌صفحه در ترمینال اجرا کنید.5 دقیقه
- 10انتشارAcme Deploys را بسازید، فراداده را تنظیم کنید و آن را مستقر کنید.4 دقیقه
- ▼گواهیگواهی با نام خود دریافت کنید که در کنسول رندر می‌شود.
اجرای دوره در کنسول شما
کنسول را با ⌘⌥JCtrl+Shift+J⌘⌥KCtrl+Shift+K⌘⌥C باز کنید (ابتدا ویژگی‌های توسعه‌دهنده را فعال کنید)، پایین کلیک کنید و با کلیدهای جهت‌نما فصلی را انتخاب کنید.
▼ learn
باز کردن کنسول
⌘⌥J
CtrlShiftJ
⌘⌥K
CtrlShiftK
⌘⌥C
برنامه در DevTools رندر می‌شود.ابتدا گزینهٔ «نمایش قابلیت‌ها برای توسعه‌دهندگان وب» را در تنظیمات Safari ← پیشرفته فعال کنید. سپس اینجا کلیک کنید و ↓ را فشار دهید.
باز کردن در رایانه
این برنامه در کنسول DevTools رندر می‌شود که به مرورگر دسکتاپ نیاز دارد.