क्रिएट-रिएक्शन-ऐप टूल, आपके लिए स्थापित एक विकास वातावरण, की मदद से रिएक्ट एप्लिकेशन बनाना इतना आसान कभी नहीं रहा। यह टूल फेसबुक की टीम द्वारा बनाया गया था और यह बिना किसी कॉन्फ़िगरेशन की आवश्यकता के एक आधुनिक बिल्ड सेटअप प्रदान करता है। एक शक्तिशाली टूल होने के नाते, create-react-app आपको वेबपैक कॉन्फ़िगरेशन या अन्य तकनीकी असफलताओं पर बहुत अधिक समय खर्च किए बिना तुरंत एक रिएक्ट ऐप बनाने के लिए बॉयलरप्लेट टेम्पलेट देता है।
इस लेख में, हम आपको चरण दर चरण क्रिएट-रिएक्ट-ऐप के माध्यम से एक नया रिएक्ट एप्लिकेशन बनाने की प्रक्रिया के बारे में बताएंगे। इसके अलावा, हम इसके कुछ पुस्तकालयों और कार्यों का उपयोग कैसे करें इस पर भी चर्चा करेंगे।
रिएक्ट ऐप बनाएं
npx create-react-app my-new-app cd my-new-app npm start
टूल को समझना
जब आप create-react-app इंस्टॉल और चलाते हैं, तो यह package.json फ़ाइल में पूर्वनिर्धारित स्क्रिप्ट के साथ एक मूल निर्देशिका संरचना सेट करता है। ये स्क्रिप्ट आपके ऐप को बनाने, परीक्षण करने और शुरू करने के लिए आवश्यक सभी चीज़ों के साथ आती हैं। इस टूल की खूबी यह है कि सभी जटिलताएँ छिपी हुई हैं जो आपको पर्यावरण के बजाय कोड पर ध्यान केंद्रित करने की अनुमति देती हैं।
यह टूल लाइव डेवलपमेंट सर्वर भी सेट करता है जो जब भी आप कोड में बदलाव करेंगे तो स्वचालित रूप से आपके एप्लिकेशन को पुनः लोड कर देगा।
निर्देशिका संरचना और महत्वपूर्ण फ़ाइलें
- पैकेज.जेसन: आपके एप्लिकेशन को बनाने, परीक्षण करने और शुरू करने के लिए स्क्रिप्ट के साथ-साथ आपके प्रोजेक्ट की सभी निर्भरताएं यहां पाई जा सकती हैं।
- नोड_मॉड्यूल: इसमें वे सभी पैकेज शामिल हैं जिन पर आपका प्रोजेक्ट निर्भर करता है।
- सार्वजनिक/index.html: मुख्य HTML फ़ाइल जो किसी के आपकी साइट पर आने पर लोड हो जाती है। इसमें रूट की आईडी के साथ एक div शामिल है जहां आपका रिएक्ट ऐप माउंट होगा।
- src/index.js: आपके रिएक्ट ऐप का प्रवेश बिंदु।
पुस्तकालय जोड़ना
आपके प्रोजेक्ट में लाइब्रेरी जोड़ना इससे आसान नहीं हो सकता। उदाहरण के लिए, यदि आप अपने प्रोजेक्ट में रिएक्ट राउटर जोड़ना चाहते हैं, तो आपको बस कमांड npm इंस्टॉल रिएक्ट-राउटर-डोम चलाना होगा और फिर आवश्यकतानुसार इसे अपनी फ़ाइलों में आयात करना होगा। पृष्ठभूमि में मॉड्यूल बंडलर यह सुनिश्चित करता है कि अंतिम निर्माण में सब कुछ शामिल हो जाए।
अपने रिएक्ट ऐप को कस्टमाइज़ करना
आपके नव निर्मित रिएक्ट एप्लिकेशन को अनुकूलित करना सीधा है। सबसे पहले, src/App.js फ़ाइल में, आप अपनी एप्लिकेशन आवश्यकताओं के अनुरूप मौजूदा कोड को संशोधित कर सकते हैं। इसके अलावा, आप अपने घटकों के लिए नई .js फ़ाइलें जोड़ सकते हैं और उपयोग के लिए उन्हें App.js में आयात कर सकते हैं।
अंत में, create-react-app बिना किसी बिल्ड कॉन्फ़िगरेशन के एक नया रिएक्ट प्रोजेक्ट स्थापित करने के लिए एक उपयोगी उपकरण है। यह एक आधुनिक बिल्ड सेटअप, डेव सर्वर और समझदार डिफ़ॉल्ट के साथ आता है, जो आपको बिल्ड टूलिंग को क्रिएट-रिएक्शन-ऐप पर छोड़कर कोड लिखने पर ध्यान केंद्रित करने देता है। याद रखें, यदि आपको अपने बिल्ड सेटअप को अनुकूलित करने की आवश्यकता है, तो आप ऐसा करने के लिए हमेशा npm run eject चला सकते हैं, लेकिन अधिकांश अनुप्रयोगों के लिए, प्रदान की गई डिफ़ॉल्ट पर्याप्त से अधिक होनी चाहिए।
