शुरू करें: अपने React ऐप्लिकेशन को ऑप्टिमाइज़ करना

क्या आपको अपनी React साइट को ज़्यादा से ज़्यादा तेज़ और ऐक्सेस करने लायक बनाना है? आप बिलकुल सही जगह पर आए हैं!

Houssein Djirdeh

React एक ओपन सोर्स लाइब्रेरी है, जिसकी मदद से यूज़र इंटरफ़ेस (यूआई) बनाना आसान हो जाता है. इस लर्निंग पाथ में, पारिस्थितिक तंत्र के अलग-अलग एपीआई और टूल शामिल होंगे. आपको अपने ऐप्लिकेशन की परफ़ॉर्मेंस और इस्तेमाल करने के तरीके को बेहतर बनाने के लिए, इनका इस्तेमाल करना चाहिए.

इस गाइड में, React ऐप्लिकेशन को सेट अप और इस्तेमाल करने का तरीका बताया गया है. इस सेक्शन में मौजूद हर दूसरी गाइड में, React ऐप्लिकेशन की स्पीड या सुलभता को ऑप्टिमाइज़ करने के विषयों के बारे में बताया जाएगा.

यह जानकारी आपके काम की क्यों है?

तेज़ और भरोसेमंद ऐप्लिकेशन बनाने का तरीका बताने वाला कॉन्टेंट बहुत है, लेकिन तेज़ और भरोसेमंद React ऐप्लिकेशन बनाने का तरीका बताने वाला कॉन्टेंट बहुत कम है. इन गाइड में, React ऐप्लिकेशन के नज़रिए से इन सभी चीज़ों के बारे में बताया गया है. इनमें सिर्फ़ React नेटवर्क से जुड़ी लाइब्रेरी, एपीआई, और सुविधाओं के बारे में बताया गया है.

आपको क्या सीखने को मिलेगा?

इस लर्निंग पाथ में मौजूद ट्यूटोरियल में, इन चीज़ों पर फ़ोकस नहीं किया जाता:

  • React का इस्तेमाल करने का तरीका
  • React के काम करने का तरीका

हालांकि, ज़रूरत पड़ने पर इन दोनों कॉन्सेप्ट पर चर्चा की जाएगी. इसके बजाय, इस सेक्शन में मौजूद सभी गाइड और कोडलैब का फ़ोकस, तेज़ी से काम करने वाली और ऐक्सेस की जा सकने वाली React साइटें बनाने के तरीके पर होगा. इस वजह से, React के बारे में बुनियादी जानकारी होना ज़रूरी है.

Create React App

Create React App (CRA), React ऐप्लिकेशन बनाने का सबसे आसान तरीका है. यह डिफ़ॉल्ट सेटअप के साथ कई मुख्य सुविधाएं देता है. इनमें, एक बिल्ड सिस्टम भी शामिल है, जिसमें मॉड्यूल बंडलर (webpack) और ट्रांसपाइलर (Babel) शामिल हैं.

नया ऐप्लिकेशन बनाने के लिए, कमांड-लाइन शेल पर सिर्फ़ ये निर्देश चलाएं:

npx create-react-app app-name

कमांड पूरा होने के बाद, इन कमांड की मदद से ऐप्लिकेशन पर जाकर उसे चलाया जा सकता है:

cd new-app
npm start

यहां दिए गए एम्बेड में, हाल ही में बूटस्ट्रैप किए गए सीआरए ऐप्लिकेशन की डायरेक्ट्री का स्ट्रक्चर और असल वेब पेज दिख रहा है.

कई कॉन्फ़िगरेशन फ़ाइलें और बिल्ड स्क्रिप्ट हैं, जिनका इस्तेमाल CRA, वेबपैक और Babel बिल्ड प्रोसेस को सेट अप करने के लिए करता है. इसमें टेस्टिंग के लिए, बुनियादी Jest सेटअप शामिल होता है. उपयोगकर्ता के लिए चीज़ों को आसान बनाने के लिए, ये फ़ाइलें छिपी होती हैं. इन्हें तब तक ऐक्सेस नहीं किया जा सकता, जब तक कि सीआरए से बाहर नहीं निकला जाता. जब भी हो सके, डिवाइस को बाहर निकालने से बचें. ऐसा इसलिए, क्योंकि इससे इन सभी कॉन्फ़िगरेशन फ़ाइलों को अपने सोर्स कोड के तौर पर इस्तेमाल करना पड़ता है. इन्हें मैनेज करना मुश्किल हो सकता है.

नए सीआरए ऐप्लिकेशन के डायरेक्ट्री स्ट्रक्चर में सिर्फ़ वे फ़ाइलें होती हैं जिनमें आपको अपने ऐप्लिकेशन पर काम करने के लिए बदलाव करने होंगे. सीआरए के दस्तावेज़ में इस बारे में ज़्यादा जानकारी दी गई है.

आगे क्या करना है?

अब जब आपको Create React App बनाने का तरीका पता है, तो इस लर्निंग पाथ में मौजूद सभी गाइड की मदद से, अपने ऐप्लिकेशन की परफ़ॉर्मेंस और ऐक्सेस को बेहतर बनाने का तरीका जानें: