Nuxt 3 زیباترین چیز است!

Summarize this content to 400 words in Persian Lang
کمی پس زمینه
من چند سالی است که توسعه دهنده Vue هستم. اگرچه من با نسخه های قبلی (به ویژه Vue 2.x) کار کرده ام و چند بار با Nuxt 2 آزمایش کرده ام، در استفاده از Nuxt 2 به عنوان ابزار اصلی خود برای پروژه های Vue مردد بوده ام. فقط جنبه هایی از آن وجود داشت که دوست نداشتم (نظر شخصی من)، بنابراین ترجیح دادم به Vue بومی بمانم مگر اینکه کاملاً نیاز به استفاده از Nuxt داشته باشم.
اما همه اینها با Vue 3 (که اتفاقاً شگفتانگیز است) و انتشار پایدار Nuxt 3 تغییر کرد. من چند پروژه تمرینی با Nuxt 3 انجام دادم تا واقعاً بفهمم چه چیزی تغییر کرده است و ببینم آیا میتوانم دلیلی برای این کار داشته باشم. شاید نظرم عوض بشه خوب، Nuxt 3 هر چیزی است که ادعا می کند، و من خودم را به هیچ وجه نمی بینم که برنامه های Vue را بسازم.
این مقاله کوتاه تمام چیزهایی را که در مورد Nuxt 3 دوست دارم بدون ترتیب خاصی برجسته میکند و این موضوع را تقویت میکند که چرا من عاشق کار با Vue هستم.
سلب مسئولیت!
من ممکن است به ویژگی هایی اشاره کنم که از زمان Nuxt 2 وجود داشته است یا خیر، پس لطفا مرا ببخشید، انجمن Nuxt، من با بازی شما آشنا نبودم.
این مقاله چیست
این مقاله همه چیز در مورد چیزهایی است که من بیشتر از همه در مورد Nuxt 3 دوست دارم.
آنچه این مقاله نیست
هدف این مقاله برجسته کردن بهترین ویژگی های Nuxt 3 نیست، شاید در مقاله ای جداگانه به آن بپردازم.
نوکسی، ای زیبایی زیبا!
Nuxt 3 یک CLI قدرتمند را معرفی می کند که ایجاد پروژه ها را بسیار آسان می کند. میتوانید پروژهها را سریعتر از پایه شروع کنید یا بسته به مورد استفاده خود، از بین انواع الگوهای موجود برای دیگ بخار سریع انتخاب کنید. اما صبر کنید، چیزهای بیشتری وجود دارد! ما فقط قدرت ایجاد پروژه های جدید و دیگ بخار را نداریم. ما به راحتی میتوانیم ماژولهای Nuxt را اضافه کنیم (که تغییر چهره پیدا کردهاند!) و همچنین طرحبندیها، صفحات، مؤلفهها، پلاگینها و میانافزار را ایجاد کنیم، همه از CLI با سهولت نسبی و مقداری دیگ اولیه برای راهاندازی شما. این کار بسیاری از کارهای دستی مربوط به راه اندازی پروژه شما را حذف می کند و باعث صرفه جویی در زمان می شود.
البته تایپ اسکریپت
همه ما می توانیم قبول کنیم که TypeScript به تنهایی یکی از بهترین اتفاقاتی است که در سال های اخیر برای توسعه وب رخ داده است. با اضافه شدن آن به Vue 3، طبیعی بود که راه خود را به Nuxt پیدا کند. اما این همه چیز نیست. من عاشق این واقعیت هستم که TypeScript پیش فرض در Nuxt 3 است. تغییر از جاوا اسکریپت به TypeScript در Nuxt یکپارچه است، با پیکربندی صفر مورد نیاز. توانایی استفاده از تمام ویژگیهای عالی TypeScript در Nuxt، تجربه را بسیار بهتر میکند.
به سرعت! به سرعت!! به سرعت!!!
Nuxt 3 به طور پیشفرض از Vite استفاده میکند، که اگر از قبل نمیدانید، تجربه را بسیار بهتر میکند. طراحی شده توسط Evan You، خالق Vue، Vite برای رفع محدودیت های باندلرهای سنتی مانند Webpack، به ویژه در مورد سرعت توسعه و عملکرد ساخت، طراحی شده است. بنابراین خارج از جعبه، همه چیزهایی که با Vite در Nuxt ارائه می شود را بدون نیاز به پیکربندی اضافی دریافت می کنیم.
وارد کردن { x } از… نه، نیازی نیست!
یکی از موارد اضافه شده قابل توجه به Vue 3 Composition API است که برای استفاده کامل از ویژگی های آن نیاز به واردات دستی زیادی در Vue 3 بومی دارد. با این حال، Nuxt 3 این فرآیند را به طور قابل توجهی ساده می کند.
در Nuxt 3، میتوانید از ویژگیهای Composition API – مانند ایجاد ویژگیهای محاسبهشده، متغیرهای واکنشپذیر، refs و composables- بدون نیاز به وارد کردن دستی آنها استفاده کنید. Nuxt 3 شامل واردات خودکار نسل بعدی است که به طور خودکار APIها و مؤلفههای رایج مورد استفاده را وارد میکند، کد دیگ بخار را کاهش میدهد و توسعه را روانتر میکند.
بیایید در مورد ماژول ها صحبت کنیم
معمولاً برای ایجاد ویژگی های خاص در برنامه خود به کتابخانه ها و ماژول های اضافی نیاز دارید. Nuxt 3 مفهوم ماژول ها را به سطح کاملاً جدیدی ارتقا می دهد، توسعه را ساده می کند و یافتن بسته های مخصوص Nuxt را برای ماژول ها و بسته های مختلف آسان تر می کند.
از ماژول های ساخته شده توسط تیم Nuxt، مانند Nuxt UI (اوه پسر! آیا این را دوست دارم!) و Nuxt Image، تا ماژول های خارجی که به مواردی مانند احراز هویت، SEO، مدیریت پایگاه داده، UI، انیمیشن ها و موارد دیگر کمک می کنند، Nuxt 3 باز می شود. یک دنیای کاملاً جدید از امکانات
من در مقالهای دیگر به جزئیات برخی از ماژولهای مورد علاقهام خواهم پرداخت، زیرا فقط باید در مورد آن کمی بیشتر صحبت کنیم.
Nuxt UI، دوستت دارم!
با Nuxt 3، Nuxt UI ارائه میشود، که در سادهترین عبارت، بهترین راه برای ایجاد رابط در Vue و Nuxt است. Nuxt UI یک ماژول Nuxt است که
“… مجموعه ای از کامپوننت ها و اجزای سازنده Vue را ارائه می دهد که با Tailwind CSS و Headless UI ساخته شده اند تا به شما در ایجاد رابط های کاربری زیبا و در دسترس کمک کنند.”
اساساً تقریباً همه چیزهایی را که برای ایجاد هر نوع رابط مدرن نیاز دارید، با اجزای شگفت انگیز و بسیار قابل تنظیم است که می تواند زمان توسعه شما را تا 80٪ کاهش دهد. من یک مقاله جداگانه خواهم نوشت که به طور خاص تأکید می کند که چقدر این باور نکردنی است.
محتوای Nuxt بهتر است!
محتوای Nuxt ارتقا می یابد! اگر قبلاً نمی دانستید، Nuxt Content یک CMS مبتنی بر فایل است که مستقیماً در Nuxt ساخته شده است. این یک راه ساده و سریع برای ساخت صفحات پویا با استفاده از آن ارائه می دهد .yml، .json، .md، و .csv فایل ها.
این ارتقا با ویژگیهای شگفتانگیزی مانند برجستهسازی کد، سازنده پرس و جو قوی، و یک پیشرفت بسیار قابلتوجه ارائه میشود: نحو MDC. سینتکس MDC به شما امکان می دهد از اجزای Vue در فایل های علامت گذاری استفاده کنید، که به سادگی عالی است! Nuxt Content همچنین بازنویسی گستردهای دریافت کرد و استفاده از مؤلفههای داخلی و اجزای سازنده را برای ساختن برنامهها با محتوای Nuxt بسیار سادهتر کرد.
Nuxt Studio!
در حالی که محتوای Nuxt قبلاً با بهروزرسانیهای اخیرش چشمگیر بود، تیم Nuxt با Nuxt Studio از خود پیشی گرفت!
“Nuxt Studio یک تجربه ویرایش جدید برای وب سایت Nuxt Content شما است که سفارشی سازی بی نهایت و ویرایش کاربر پسند را ارائه می دهد. وب سایت خود را با ویرایشگر Notion مانند ما ویرایش کنید و همکاری بین توسعه دهندگان و کپی رایترها را آزاد کنید.”
دارای برخی از ویژگی های واقعا شگفت انگیز مانند اجزای سفارشی، همکاری زنده، استقرار مداوم، لینک های پیش نمایش، پیش نویس ها و موارد دیگر است!
نتیجه
اگر شما یک توسعه دهنده Vue هستید (یا هر نوع توسعه دهنده frontend، واقعاً)، Nuxt 3 زندگی را یک نسیم می کند! مثل داشتن یک ابرقدرت است که کدنویسی را روان تر و لذت بخش تر می کند. با Nuxt 4 در افق، فقط می توانم تصور کنم که به زودی برای یک جلسه حماسی دیگر برمی گردم. منتظر هیجان بیشتر باشید!
PS: اگر به طور مداوم با Nuxt کار می کنید، باید کاملاً Nuxtr را بررسی کنید. این یک پسوند VS Code است که نحوه کار با Nuxt را در VS Code تغییر میدهد. اگرچه این یک فریاد پولی نیست، من به شدت توصیه می کنم آن را امتحان کنید!
کمی پس زمینه
من چند سالی است که توسعه دهنده Vue هستم. اگرچه من با نسخه های قبلی (به ویژه Vue 2.x) کار کرده ام و چند بار با Nuxt 2 آزمایش کرده ام، در استفاده از Nuxt 2 به عنوان ابزار اصلی خود برای پروژه های Vue مردد بوده ام. فقط جنبه هایی از آن وجود داشت که دوست نداشتم (نظر شخصی من)، بنابراین ترجیح دادم به Vue بومی بمانم مگر اینکه کاملاً نیاز به استفاده از Nuxt داشته باشم.
اما همه اینها با Vue 3 (که اتفاقاً شگفتانگیز است) و انتشار پایدار Nuxt 3 تغییر کرد. من چند پروژه تمرینی با Nuxt 3 انجام دادم تا واقعاً بفهمم چه چیزی تغییر کرده است و ببینم آیا میتوانم دلیلی برای این کار داشته باشم. شاید نظرم عوض بشه خوب، Nuxt 3 هر چیزی است که ادعا می کند، و من خودم را به هیچ وجه نمی بینم که برنامه های Vue را بسازم.
این مقاله کوتاه تمام چیزهایی را که در مورد Nuxt 3 دوست دارم بدون ترتیب خاصی برجسته میکند و این موضوع را تقویت میکند که چرا من عاشق کار با Vue هستم.
سلب مسئولیت!
من ممکن است به ویژگی هایی اشاره کنم که از زمان Nuxt 2 وجود داشته است یا خیر، پس لطفا مرا ببخشید، انجمن Nuxt، من با بازی شما آشنا نبودم.
این مقاله چیست
این مقاله همه چیز در مورد چیزهایی است که من بیشتر از همه در مورد Nuxt 3 دوست دارم.
آنچه این مقاله نیست
هدف این مقاله برجسته کردن بهترین ویژگی های Nuxt 3 نیست، شاید در مقاله ای جداگانه به آن بپردازم.
نوکسی، ای زیبایی زیبا!
Nuxt 3 یک CLI قدرتمند را معرفی می کند که ایجاد پروژه ها را بسیار آسان می کند. میتوانید پروژهها را سریعتر از پایه شروع کنید یا بسته به مورد استفاده خود، از بین انواع الگوهای موجود برای دیگ بخار سریع انتخاب کنید. اما صبر کنید، چیزهای بیشتری وجود دارد! ما فقط قدرت ایجاد پروژه های جدید و دیگ بخار را نداریم. ما به راحتی میتوانیم ماژولهای Nuxt را اضافه کنیم (که تغییر چهره پیدا کردهاند!) و همچنین طرحبندیها، صفحات، مؤلفهها، پلاگینها و میانافزار را ایجاد کنیم، همه از CLI با سهولت نسبی و مقداری دیگ اولیه برای راهاندازی شما. این کار بسیاری از کارهای دستی مربوط به راه اندازی پروژه شما را حذف می کند و باعث صرفه جویی در زمان می شود.
البته تایپ اسکریپت
همه ما می توانیم قبول کنیم که TypeScript به تنهایی یکی از بهترین اتفاقاتی است که در سال های اخیر برای توسعه وب رخ داده است. با اضافه شدن آن به Vue 3، طبیعی بود که راه خود را به Nuxt پیدا کند. اما این همه چیز نیست. من عاشق این واقعیت هستم که TypeScript پیش فرض در Nuxt 3 است. تغییر از جاوا اسکریپت به TypeScript در Nuxt یکپارچه است، با پیکربندی صفر مورد نیاز. توانایی استفاده از تمام ویژگیهای عالی TypeScript در Nuxt، تجربه را بسیار بهتر میکند.
به سرعت! به سرعت!! به سرعت!!!
Nuxt 3 به طور پیشفرض از Vite استفاده میکند، که اگر از قبل نمیدانید، تجربه را بسیار بهتر میکند. طراحی شده توسط Evan You، خالق Vue، Vite برای رفع محدودیت های باندلرهای سنتی مانند Webpack، به ویژه در مورد سرعت توسعه و عملکرد ساخت، طراحی شده است. بنابراین خارج از جعبه، همه چیزهایی که با Vite در Nuxt ارائه می شود را بدون نیاز به پیکربندی اضافی دریافت می کنیم.
وارد کردن { x } از… نه، نیازی نیست!
یکی از موارد اضافه شده قابل توجه به Vue 3 Composition API است که برای استفاده کامل از ویژگی های آن نیاز به واردات دستی زیادی در Vue 3 بومی دارد. با این حال، Nuxt 3 این فرآیند را به طور قابل توجهی ساده می کند.
در Nuxt 3، میتوانید از ویژگیهای Composition API – مانند ایجاد ویژگیهای محاسبهشده، متغیرهای واکنشپذیر، refs و composables- بدون نیاز به وارد کردن دستی آنها استفاده کنید. Nuxt 3 شامل واردات خودکار نسل بعدی است که به طور خودکار APIها و مؤلفههای رایج مورد استفاده را وارد میکند، کد دیگ بخار را کاهش میدهد و توسعه را روانتر میکند.
بیایید در مورد ماژول ها صحبت کنیم
معمولاً برای ایجاد ویژگی های خاص در برنامه خود به کتابخانه ها و ماژول های اضافی نیاز دارید. Nuxt 3 مفهوم ماژول ها را به سطح کاملاً جدیدی ارتقا می دهد، توسعه را ساده می کند و یافتن بسته های مخصوص Nuxt را برای ماژول ها و بسته های مختلف آسان تر می کند.
از ماژول های ساخته شده توسط تیم Nuxt، مانند Nuxt UI (اوه پسر! آیا این را دوست دارم!) و Nuxt Image، تا ماژول های خارجی که به مواردی مانند احراز هویت، SEO، مدیریت پایگاه داده، UI، انیمیشن ها و موارد دیگر کمک می کنند، Nuxt 3 باز می شود. یک دنیای کاملاً جدید از امکانات
من در مقالهای دیگر به جزئیات برخی از ماژولهای مورد علاقهام خواهم پرداخت، زیرا فقط باید در مورد آن کمی بیشتر صحبت کنیم.
Nuxt UI، دوستت دارم!
با Nuxt 3، Nuxt UI ارائه میشود، که در سادهترین عبارت، بهترین راه برای ایجاد رابط در Vue و Nuxt است. Nuxt UI یک ماژول Nuxt است که
“… مجموعه ای از کامپوننت ها و اجزای سازنده Vue را ارائه می دهد که با Tailwind CSS و Headless UI ساخته شده اند تا به شما در ایجاد رابط های کاربری زیبا و در دسترس کمک کنند.”
اساساً تقریباً همه چیزهایی را که برای ایجاد هر نوع رابط مدرن نیاز دارید، با اجزای شگفت انگیز و بسیار قابل تنظیم است که می تواند زمان توسعه شما را تا 80٪ کاهش دهد. من یک مقاله جداگانه خواهم نوشت که به طور خاص تأکید می کند که چقدر این باور نکردنی است.
محتوای Nuxt بهتر است!
محتوای Nuxt ارتقا می یابد! اگر قبلاً نمی دانستید، Nuxt Content یک CMS مبتنی بر فایل است که مستقیماً در Nuxt ساخته شده است. این یک راه ساده و سریع برای ساخت صفحات پویا با استفاده از آن ارائه می دهد .yml
، .json
، .md
، و .csv
فایل ها.
این ارتقا با ویژگیهای شگفتانگیزی مانند برجستهسازی کد، سازنده پرس و جو قوی، و یک پیشرفت بسیار قابلتوجه ارائه میشود: نحو MDC. سینتکس MDC به شما امکان می دهد از اجزای Vue در فایل های علامت گذاری استفاده کنید، که به سادگی عالی است! Nuxt Content همچنین بازنویسی گستردهای دریافت کرد و استفاده از مؤلفههای داخلی و اجزای سازنده را برای ساختن برنامهها با محتوای Nuxt بسیار سادهتر کرد.
Nuxt Studio!
در حالی که محتوای Nuxt قبلاً با بهروزرسانیهای اخیرش چشمگیر بود، تیم Nuxt با Nuxt Studio از خود پیشی گرفت!
“Nuxt Studio یک تجربه ویرایش جدید برای وب سایت Nuxt Content شما است که سفارشی سازی بی نهایت و ویرایش کاربر پسند را ارائه می دهد. وب سایت خود را با ویرایشگر Notion مانند ما ویرایش کنید و همکاری بین توسعه دهندگان و کپی رایترها را آزاد کنید.”
دارای برخی از ویژگی های واقعا شگفت انگیز مانند اجزای سفارشی، همکاری زنده، استقرار مداوم، لینک های پیش نمایش، پیش نویس ها و موارد دیگر است!
نتیجه
اگر شما یک توسعه دهنده Vue هستید (یا هر نوع توسعه دهنده frontend، واقعاً)، Nuxt 3 زندگی را یک نسیم می کند! مثل داشتن یک ابرقدرت است که کدنویسی را روان تر و لذت بخش تر می کند. با Nuxt 4 در افق، فقط می توانم تصور کنم که به زودی برای یک جلسه حماسی دیگر برمی گردم. منتظر هیجان بیشتر باشید!
PS: اگر به طور مداوم با Nuxt کار می کنید، باید کاملاً Nuxtr را بررسی کنید. این یک پسوند VS Code است که نحوه کار با Nuxt را در VS Code تغییر میدهد. اگرچه این یک فریاد پولی نیست، من به شدت توصیه می کنم آن را امتحان کنید!