تکنولوژی نکست جی اس یا Next.js، در واقع فریمورکی در کنار فریم ورک ری اکت محسوب می شود که از آن برای ساخت برنامه های وب و اپلیکیشن های با زبان جاوا اسکریپت می باشد.
برای اینکه یک برنامه ی تحت وب را با React بتوانید ایجاد کنید، جزئیات مهم و اصلی بسیار زیادی وجود دارد که باید در هر مرحله از کار خود آن ها را در نظر بگیرید:
- کد باید با استفاده از bundler مانند webpack بسته بندی شده و با استفاده از compiler مانند Babel تبدیل شود.
- شما باید بهینه سازی ها و تقسیم کد را انجام دهید.
- ممکن است تا شما بخواهید برخی از صفحات را برای عملکرد بهتر و سئوی سایت، به صورت ایستا Pre Render کنید. همچنین ممکن است تا بخواهید از حالت server-side که تحت سرور است یا کلاینت ساید client-side رندر استفاده کنید.
- ممکن است برای اتصال برنامه ری اکت جی اس خود به دیتای مورد نیاز، مجبور شوید در سمت سرور کد خود را بنویسید.
فریمورک Next، راه حلی برای تمام مشکلات بالا دارد. Next.js سال ها می باشد که در زمینه ی تولید اپلیکیشن ها توسط برنامه نویسان مورد استفاده قرار خواهد گرفت و از فریمورک های با تجربه در این عرصه به حساب خواهد آمد، همچنین ابزار های داخلی مربوط به خود را برای کمک به برنامه نویسان به همراه دارد که برخی از آن ها را بیان میکنیم.
فریم ورک next js چیست؟
ویژگیهای فریمور Next.js
- رندر کردن برنامه های تحت React در سمت سرور به صورت دیفالت (Server-rendered by default)
- استفاده از code splitting بصورت اتوماتیک برای انجام سریع بارگزاری های صفحات (Automatic code splitting for faster page loads)
- مسیردهی یا Routing ساده در سمت کاربران بر اساس صفحات (Simple client-side routing (page-based
- استفاده از محیط های توسعه بر اساس Webpack که از قابلیت بسیار محبوب Hot Module Replacement) HMR) پشتیبانی خواهد کرد.
- امکان پیاده سازی با Express یا هر Node.js HTTP server دیگری که در آن وجود دارد.
- قابلیت شخصی سازی با تنظیمات Babel , Webpack پروژه.
چرا باید از Next.js استفاده کرد؟
همانطور که بالاتر گفته شد فریمورک Next js بهترین ابزار رایگان برای کار با React در اختیار برنامه نویسان قرار می دهد بدون اینکه برای پیاده سازی این امکانات هیچ سختی را تحمل کنید! اگر با کتابخانه React برای یک پروژه قصد توسعه داشته باشید ویژگی هایی که در ادامه به آن خواهیم پرداخت که مهم ترین علت استفاده از Next js هستند را پیاده سازی کنید، قطعا از لحاظ زمان و از نظر هزینه زیادی را از دست خواهید داد! پس چرا از Next js نباید استفاده کنید؟
- Internationalized Routing
Next js از نسخه 10 از مسیریابی بین المللی یا i18n پشتیبانی می کند. - Zero Config
در فریم ورک Next js ویژگی هایی چون compilation و bundling خودکار در اختیار شما خواهد داد. این باعث می شود تا از ابتدا کار بهینه ترین اپلیکیشن ها را تولید کنید. - Hybrid: SSG and SSR
Next js از SSG و SSR برای تولید برنامه ها پشتیبانی می کند و به سادگی می توانید اپلیکیشن هایی را بسازید که کد آن ها در سمت سرور رندر شده و دوست دار سئو هستند. پس اپلیکیشن هایی که با کتابخانه ی محبوب Next js می سازید از نظر SEO هیچ مشکلی نخواهند داشت اما این امکان در استفاده ی React در حالت معمول وجود ندارد. - Incremental Static Generation
شما به سادگی می توانید صفحات static از قبل رندر شده را پس از زمان ساخت، به صورت تدریجی update کنید. - TypeScript Support
قطعا یکی از پر اهمیت ترین ویژگی های Next js این است که به سادگی می توانید در پروژه های وب خود از تکنولوژی TypeScript استفاده کنید. TypeScript به شما کمک می کند تا اپلیکیشن های جدیدتری بنویسید و ساده تر برنامه نویسی کنید - Fast Refresh
سرعت بسیار بالا و قابلیت ویرایش زنده در این فریم ورک باعث می شود تا در مقیاس های بزرگ تست برای شما ساده باشد. - File-system Routing
اختصاص هر componenet که در پوشه صفحات در مسیر پروژه قرار دارد به یک روت یا مسیر مجزا - API Routes
قابیلت ایجاد EndPointهای مختلف برای پیاده سازی Api برنامه و توسعه سمت سرور آن. - Built-in CSS Support
به راحتی می توانید استایل های هر componenet را در درون همان componenet به صورت مجزا تعریف کنید با استفاده از سی اس اس، همچنین امکان استفاده از تکنولوژی Sass هم وجود دارد. - Code-splitting and Bundling
بهره بردن از الگوریتم های خاص و ویژه برای تقسیمبندی و بهینه سازی کد ها که توسط تیم Chrome Google توسعه داده شده است.