इस tutorial में मैंने React का introduction दिया है जिसमें हम सबसे पहले ये समझेंगे की React क्या है और फिर बात करेंगे React के important features के बारे में.
React एक JavaScript से बनी open-source front-end library है जिसका use web application और mobile application के user interface (UI) को बनाने के लिए किया जाता है.
अब क्योंकि React को JavaScript से बनाया है तो इसलिए इसे हम React JS भी कहते हैं यानी React और React JS दोनों का मतलब एक ही है और दोनों में कोई अंतर नहीं है.
React को Meta (Facebook) company के एक software engineer Jordan Walke ने बनाया था. React का use सबसे पहले Facebook news feed में 2011 में किया गया था उसके बाद 2012 में Instagram और WhatsApp में use किया गया और फिर May 2013 में इसे open-source करके public कर दिया गया.
अब Facebook और open-source developer community के द्वारा React को develop और run किया जाता है.
What is the Use of React in Hindi
आज के समय में ज्यादातर mobile और web applications Model View Controller (MVC) architecture को use करके बनती हैं और इस MVC architecture के View part में पूरा focus application के UI पर होता है और इसी UI को तैयार करने में React library हमें help करती है.
React की हेल्प से हम reusable UI components (buttons, navbar, table, etc.) बनाते हैं और फिर उन्हें अपनी application में different जगह पर reuse करते हैं. इन reusable UI components की वजह से हमें अपने code को repeat नहीं करना पड़ता.
ऐसी applications जिनका front-end (UI) बहुत ही dynamically change होता है ऐसी applications के लिए React best है क्योंकि ये पुरे page को re-render करने की बजाय सिर्फ वो components को change करती हैं जिनमे कोई update हुआ है.
React को दूसरी technologies के साथ भी use किया जाता है जैसे की React Native जिससे आप mobile applications बना सकते हो और ऐसे ही Next.js जिससे आप server-side rendering कर सकत हो.
React Features in Hindi
नीचे मैंने React के कुछ important features के बारे में बहुत ही short में बताया है लेकिन आने वाले कुछ tutorials में हम कुछ features जैसे की component, props, state के बारे में detail में discuss करेंगे.
Easy to Learn: दूसरी JavaScript front-end library और framework (Angular, Vue.js, jQuery, etc.) के मुकाबले React को सीखना ज्यादा आसान होता है. React सीखने के लिए बस आपको पहले से HTML, CSS और JavaScript की knowledge होना जरुरी है.
Component: React में हम complete UI को reusable independent components में split करके बनाते हैं और हर component का अपना logic होता है और इससे होता है की अपनी application को manage करना बहुत ही easy हो जाता है.
हम किसी भी component को अपनी पूरी application में कहीं भी और कितनी बार में use कर सकते हैं और इसकी वजह से आपको same code को multiple times rewrite नहीं करना पड़ता.
JSX (JavaScript XML): ये एक syntax extension हैं जिसकी हेल्प से आप HTML जैसे code को directly JavaScript में लिख सकते हो. JSX की हेल्प से हम React UI components के structure को describe करते हैं.
Props: ऐसा डाटा (properties) जो आप एक component से दुसरे component को transfer किया जाता है जिसका use करके वो component dynamic और unique outputs देता है.
State: ये ऐसे object होते हैं जिसमें component के अन्दर ही component के डाटा (state) को manage (store) किया जाता है. अगर system-generated events या user action की वजह से component की state में change आता है तो component को re-render किया जाता है जिससे की dynamic और interactive user interfaces तैयार किया जा सके.
Virtual DOM: Document Object Model (DOM) के जरिए web page के सभी tag और data के एक tree structure की form में store किया जाता है और जब भी इस tree structure के किसी भी element में change होता है तो browser में पूरे DOM को update किया जाता है.
लेकिन React में DOM को Virtual DOM tree के तौर पर memory में store किया जाता है और जब भी VDOM के किसी भी element (component) में कोई change होता है तो सिर्फ उसको ही browser में update किया जाता है और इससे ये process बहुत ही fast हो जाता है.
Support: बहुत ही बड़ी open-source community ऐसे बहुत से tools, library बनाते हैं जिन्हें आप React के साथ use करके React की power को बड़ा सकते हो और साथ ही Facebook भी समय-समय पर React में नये-नये updates लाती रहती है.
Used By: वैसे तो लाखो companies हैं जो react को अपनी applications में use करती हैं लेकिन मैंने नीचे कुछ popular companies की list दी हैं.
- Netflix
- Uber
- Airbnb
- The New York Times
- Khan Academy
- Codecademy
- SoundCloud
- Discord
- WhatsApp Web