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

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

Houssein Djirdeh

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

इस गाइड में आपको React ऐप्लिकेशन इस्तेमाल करने का तरीका बताया गया है. इस सेक्शन की हर दूसरी गाइड में, React ऐप्लिकेशन की रफ़्तार या सुलभता को बेहतर बनाने के विषयों के बारे में बताया गया है.

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

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

आप क्या सीखेंगे?

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

  • प्रतिक्रिया देने की सुविधा इस्तेमाल करने का तरीका
  • React के काम करने का तरीका

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

प्रतिक्रिया देने वाला ऐप्लिकेशन बनाएं

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

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

npx create-react-app app-name

निर्देश का पालन हो जाने के बाद, आप ऐप्लिकेशन पर नेविगेट कर सकते हैं और इसे इन कमांड से चला सकते हैं:

cd new-app
npm start

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

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

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

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

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