اخبار هیجان انگیز در دنیای React: پس از سال‌ها کار سخت و اصلاح، React Docs Beta به اسناد رسمی React ارتقا یافت و اکنون در react.dev به صورت زنده در دسترس است!
امروز، ما از راه‌اندازی react.dev، خانه جدید React و مستندات آن، هیجان‌زده هستیم. این React مدرن را با اجزای تابع و هوک ها آموزش می دهد، و ما نمودارها، تصاویر، چالش ها و بیش از 600 مثال تعاملی را گنجانده ایم. آن را بررسی کنید!
18:57 – 16 مارس 2023
با این کار، اسناد اصلی به نسخه قدیمی تنزل یافتند، اگرچه هنوز در legacy.rectjs.org قابل دسترسی هستند.
تاریخ
پروژه React Docs Beta اولین بار در اواخر اکتبر 2021 به رهبری منتشر شد راشل نابورس و و آبراموف، با هدف به روز رسانی اسناد موجود React برای منعکس کردن روش های جدیدتر و جدیدتر برای نوشتن React. این در درجه اول بر روی استفاده از Hooks (که به عنوان بخشی از React 16.8 معرفی شد، که در فوریه 2019 منتشر شد) و تغییر مرتبط با آن به نفع اجزای عملکردی به جای اجزای کلاس متمرکز بود.
دو هفته پیش، پیش‌نمایش اولیه React Docs Beta را در beta.reactjs.org منتشر کردیم. اگر در حال یادگیری React هستید، آن را بررسی کنید و نظر خود را با ما در میان بگذارید! این هنوز یک کار در حال پیشرفت و ناتمام است، اما دلایل مختلفی وجود دارد که ما در مورد آن هیجان زده هستیم.
17:51 – 11 نوامبر 2021
قبلاً، مستندات رسمی React به صورت کلاس مولفه رو به جلو بود، زیرا این تنها راه برای نوشتن مؤلفه‌های حالتی بود. با این حال، معرفی قلاب – useState() قلاب، به ویژه – به اجزای عملکردی اجازه می دهد تا وضعیت را نیز مدیریت کنند. از آن زمان، بحث های زیادی در مورد اینکه آیا هوکس حرکت درستی بود و اینکه آیا آنها به هدف ساده سازی مدیریت دولتی و ایالتی دست یافتند یا خیر، وجود داشته است. صرف نظر از این، معرفی Hooks به طرز چشمگیری نحوه نوشتن React را تغییر داد. برای تمایز بین قبل و بعد از این توسعه، بسیاری از آموزش‌ها و مقالات React (از جمله معرفی اسناد رسمی جدید React) معمولاً به دوران پس از هوکس اشاره می‌کنند. “مدرن” React.
با این حال، یادگیرندگان جدید React را در موقعیت دشواری قرار داد. نوشته‌ها و راهنمایی‌های فراوانی درباره مهاجرت از مؤلفه‌های طبقاتی و مدیریت سنتی دولتی به مؤلفه‌های عملکردی و هوک‌ها وجود داشت. با این حال، افرادی که React را یاد می‌گیرند، برای اولین بار دریافتند که مستندات قوی برای آموزش Hooks از ابتدا وجود ندارد. با گذشت زمان، اسناد رسمی React منسوخ‌تر و استفاده از آنها دشوارتر شد.
چه خبر؟
قلاب ها و اجزای عملکردی به عنوان پیش فرض
بزرگترین تغییر در اسناد جدید است تغییر به سمت استفاده از Hooks و آموزش اجزای تابعی به عنوان رویکرد استاندارد برای نوشتن React مدرن. – به استثنای معدود موارد استفاده باقیمانده که اجزای کلاس هنوز مورد نیاز هستند. در غیر این صورت، اجزای کلاس (در حالی که هنوز پشتیبانی می شوند) به طور رسمی به عنوان “میراث” تعیین شده اند.
دموها و چالش های تعاملی
اسناد جدید دارند تعداد نمونه کدهای تعاملی را بسیار گسترش داد، و همچنین چالش های جدیدی را اضافه کرده است تا به شما امکان می دهد آنچه را که به تازگی آموخته اید تمرین کنید و دانش خود را آزمایش کنید. بیش از 600 نمونه کد تعاملی جدید، جعبه‌های ایمنی و نمایش‌های نمایشی وجود دارد – همه آنها را می‌توان برای باز کردن در codesandbox.io برای تغییرات بزرگ‌تر و گسترده‌تر یا به‌راحتی برای استفاده در کار خود منطبق کرد. این کار، همراه با افزودن تصاویر و نمودارهای بیشتر، به این امید انجام شد که اسناد React دوستانه تر و قابل درک تر شوند.
React App را دیگر استاندارد ایجاد نکنید
یکی از قابل توجه ترین تغییرات در اسناد این است حذف Create React App (CRA)، ابزار رسمی پیکربندی سریع React که توسط فیس بوک نگهداری می شود، از بخش نصب اسناد جدید. اسناد قدیمی CRA را به عنوان “بهترین راه برای شروع ساخت یک برنامه جدید تک صفحه ای در React” توصیه کرده بودند.
اخیراً تماس‌های متعددی برای حذف توصیه‌های CRA وجود داشته است، شاید مهم‌ترین آنها از طرف YouTuber محبوب Theo (t3.gg) که درخواست کشش در پروژه reactjs که جایگزینی CRA با Vite را توصیه می‌کند، توجه زیادی را به خود جلب کرد. این باعث انتقاد شدید از CRA شد، از جمله فقدان ویژگی‌های درک شده آن (مانند پشتیبانی بومی از TypeScript یا کتابخانه محبوب CSS Tailwind)، اندازه، عملکرد و موارد دیگر.
آیا باید برای حذف توصیه Create React App یک PR در React Docs ارسال کنم؟
22:58 – 21 ژانویه 2023
با این حال، در نهایت، یک واقعیت شکست‌دهنده در مورد CRA وجود دارد که نمی‌توان آن را نادیده گرفت: آن دیگر به طور فعال حفظ نمی‌شود. با 1.5 هزار مشکل حل نشده فعلی، بیش از 400 PR باز، و آخرین نسخه که بیش از یک سال از آن گذشته است، می‌توان CRA را یک پروژه مرده نامید.
چارچوب ها توصیه رسمی هستند
برای کاربرانی که برنامه‌ها یا سایت‌های جدید را کاملاً در React ایجاد می‌کنند، اکنون اسناد به روز شده چارچوب های React را توصیه می کنند از جمله Next.js، Remix، Gatsby و Expo for React Native. در بخش «Deep Dive» با کلیک برای گسترش، آنها رسماً این عقیده را دارند که استفاده از چارچوب بهترین راه برای ساخت با React است. با این حال، آنها توجه دارند که گزینه هایی مانند Vite یا Parcel برای کسانی که “دوست دارند رول کنند” وجود دارد [their] تنظیمات سفارشی خود را دارید، ما نمی‌توانیم جلوی شما را بگیریم – آن را دنبال کنید!».
این یک تفاوت قابل توجه با اسناد قدیمی است، که یک جمله سریع از توضیحات هر کدام را برای Next.js و Gatsby ارائه می‌کردند، اما به شدت بر روی CRA به عنوان رویکرد توصیه شده تمرکز داشتند.
نام دامنه جدید
اسناد موجود در حال حاضر را می توان در اصل در reactjs.org یافت. این اکنون به دامنه جدید react.dev هدایت می شود. زمانی که اسناد جدید هنوز در نسخه بتا بودند، در beta.reactjs.org میزبانی می شدند که اکنون به react.dev نیز هدایت می شود. اسناد اصلی را هنوز هم می‌توانید برای کسانی که به آن نیاز دارند در legacy.reactjs.org پیدا کنید. این کار برای ایجاد یک شروع تازه و جدایی واضح بین اسناد فعلی و قدیمی انجام شد.
رنگ برند جدید؟
@dan_abramov تبریک میگمهمچنین یک سوال کلیدی، رنگ برند الان چیست؟ 😄
21:58 – 16 مارس 2023
یک به‌روزرسانی کمتر مهم (اما هنوز جالب): یک کاربر خوش‌بین توییتر (borekb@) خاطرنشان کرد که رنگ نمادین برند تیل که از لحاظ تاریخی با React مرتبط بوده اندکی تغییر کرده است در مستندات جدید اسناد قدیمی (اکنون) قبلاً از کمی روشن تر استفاده می کردند #61dafb، در حالی که این کاربر اشاره کرد که از اسناد جدید استفاده می کند #0a7ea4. با این حال، من کمی حفاری نیز انجام دادم، و در واقع کمی بیشتر از آن وجود دارد!
بعلاوه #0a7ea4، اسناد جدید *همچنین* استفاده کنید #149eca به عنوان “React blue” – سایه کمی روشن تر از رنگ آبی که به رنگ اصلی نزدیک تر است. اینکه کدام یک از اینها استفاده می شود بستگی به این دارد که سایت در حالت روشن یا تاریک باشد، همانطور که در این قطعه می بینیم که من از طریق ابزار inspect از CSS آنها برداشتم.
بر اساس این اطلاعات (بدون دانستن دلیل واقعی)، حدس من این است که رنگ ها کمی برای اهداف دسترسی تنظیم شده اند. رنگ پس زمینه حالت تاریک اولیه است #23272F، که رنگ روشن تر از کنترل کنتراست رنگ عبور می کند، در حالی که رنگ تیره تر نمی تواند. از سوی دیگر، رنگ سبز تیره تر کنتراست رنگ را در پس زمینه سفید بررسی می کند، در حالی که رنگ روشن تر این کار را نمی کند. بر این اساس، من فرض می‌کنم که رنگ‌ها از رنگ اصلی تغییر کرده‌اند تا در اسناد جدید تا حد امکان در دسترس باشند. از تیم React برای توجه آنها به دسترسی فریاد بزنید!
مشتاقانه منتظر است
مانند سایر اسناد، مستندات React به طور مداوم در حال توسعه و گسترش است. مقاله وبلاگ «معرفی react.dev» چندین ویژگی جدید را فهرست می‌کند که می‌توانیم در آینده نزدیک منتظر آنها باشیم، از جمله نمونه‌های TypeScript، راهنمای دسترسی به‌روز شده، ترجمه‌های زبان گسترده و موارد دیگر.
بازخورد
نظری در مورد اسناد جدید دارید؟ تیم React چند راه برای ارائه بازخورد دارد:
- برای ارائه بازخورد کلی، نظرسنجی را پر کنید.
- یک مشکل را ثبت کنید تا مشکلات، اشکالات، اشتباهات و غیره را مستند کنید.
آینده هیجان انگیز
من بر این عقیده شخصی هستم که این اسناد جدید یک بزرگ پیروزی برای تیم React و پیشرفت گسترده نسبت به پیشنهادات قدیمی. آنها به خوبی طراحی شده اند، به راحتی قابل خواندن هستند و به طور کلی بسیار کاربرپسند هستند. شرم آور است که آنقدر طول کشید تا آنها احساس راحتی کنند که برچسب بتا را حذف کنند و این منبع عالی جدید را به اسناد رسمی React منتقل کنند – اما بهتر از هرگز!
در وبلاگ مقدماتی آمده است: “ما فکر می کنیم هرگز زمان بهتری برای یادگیری React وجود نداشته است” – من تمایل دارم با آن موافق باشم! امیدوارم این اسناد جدید فوق‌العاده، انبوهی از یادگیرندگان جدید و هیجان‌انگیز را به همراه داشته باشند. این هم به 10 سال دیگر React!
نظر شما در مورد اسناد جدید چیست؟ آیا از دیدن حذف Create React App خوشحال شدید؟ برای در آغوش گرفتن هوکس هیجان زده هستید؟ در نظرات به من اطلاع دهید!
