रिऍक्ट हे एक अतिशय उत्तम टूल आहे वेब अप्लिकेशन बनवण्यासाठी.
पण रिऍक्ट मधून जे अप्लिकेशन बनत ते एक तर सिंगल पेज अप्लिकेशन असतं.
मग सिंगल पेज अप्लिकेशन चा तोटा काय आहे? तर सिंगल पेज अप्लिकेशन हे SEO साठी फार चांगले नसते. कारण पेज रिफ्रेश नं होता त्याच ठिकाणी नवीन पेज चा कन्टेन्ट येतो.
त्यामुळे Google च्या क्रॉलर ला कळतच नाही कि कुठल्या पेज चा काय मेटा डेटा आहे.
SEO साठी मल्टि-पेज अप्लिकेशन असणे खूप गरजेचे असते.
आणि दुसरी गोष्ट म्हणजे रिऍक्ट मध्ये छोट्या छोट्या गोष्टींसाठी मोड्यूल वापरावे लागते. जसे कि राऊंटिंग साठी react-router हि लायब्ररी वापरावी लागते.
आणि हेच आणि बरेच असे मुद्दे आहेत जे Next.js मध्ये निकाली काढण्यात आले आहेत.
Next.js काय आहे?
Next.js एक रिऍक्ट फ्रेमवर्क आहे. आपण पहिले आहे कि रिऍक्ट हि एक जावास्क्रिप्ट ची लायब्ररी आहे आणि फ्रेमवर्क नाही.
पण Next.js मात्र रिऍक्ट वर आधारित एक फ्रेमवर्क आहे.
फ्रेमवर्क म्हटले कि त्यात मग वेगवेगळ्या गोष्टी आधी टाकल्या असतात जसे कि
फक्त एवढेच नाही तर
आणि असे बरच फीचर्स आधीच टाकले आहेत.
Next.js कसे इन्स्टॉल करावे?
जसे रिऍक्ट इन्स्टॉल करण्यासाठी आपल्याला Node इन्स्टॉल केलेले लागते तसेच नेक्स्ट साठी सुद्धा Node लागते.
मग जर Node इन्स्टॉल केले नसेल तर आधी ते इन्स्टॉल करून घ्या.
मग खालील कमांड रन करून तुम्ही नेक्स्ट तुमच्या सिस्टिम वर इन्स्टॉल करू शकता
npx create-next-app@latest
मग इन्स्टॉल झाल्यावर तुमच्या डिरेक्टरी मध्ये पंजे नावाचा एक फोल्डर तयार होतो.
हा फोल्डर सगळं राऊंटिंग चा काम करतो.
म्हणजे या फोल्डर मध्ये about नावाचा एक फोल्डर बनवला आणि त्यात जर index.js नावाचा रिऍक्ट कॉम्पोनन्ट बनवला तर /about नावाचा पेज ऑटो तयार होतं.
आणि या पेज ला जर लिंक द्यायची असेल तर
import Link from 'next/link';
export default function Home() {
return (
<>
Hello
Go to about
);
}
एवढाच कोड पुरेसा होतो.
म्हणजेच काय तर कुठलाच राऊंटिंग मोड्यूल वापरायची गरज नाही.
खालील कोड मध्ये तुम्ही बघू शकता कि नेक्स्ट मध्ये कसं राऊंटिंग केला आहे.
डायरेक्ट नेक्स्ट शिकलं तर चालेल का?
एक गोष्ट लक्षात ठेवा म्हणजे नेक्स्ट हे रिऍक्ट चे फ्रेमवर्क आहे. त्यामुळे जर रिऍक्ट येत नसेल तर नेक्स्ट शिकणं अवघड होईल.
त्यापेक्षा आधी रिऍक्ट व्यवस्थित शिकून घ्या म्हणजे नेक्स्ट शिकणं फार सुकर आणि सोयीचं होईल.जर तुम्हाला रिऍक्ट शिकायचं असेल तर खालील लिंक ला क्लिक करून रिऍक्ट मराठी मधून शिकायला चालू करा.
Comments
No comments yet
Be the first to share your thoughts on this article