= अमेज़न S3 = पर रिएक्ट ऐप्स को तैनात करें

== S3 == के साथ रिएक्ट ऐप्स को कैसे तैनात किया जाए, इस पर 5 मिनट की गाइड

![ ](httpsmiro.medium.com/max/1400/1*h4TLisFk7XvtREAsS7C7Q.jpeg)

तो आपने अपना रिएक्ट ऐप पूरा कर लिया है और आप इसे कहीं होस्ट करना चाह रहे हैं। क्या आप जानते हैं कि आप अपने रिएक्ट ऐप्स को होस्ट करने के लिए Amazon AWS S3 का उपयोग कर सकते हैं? यह अपेक्षाकृत आसान, कम लागत वाला और लगाने में तेज है।

= चलो शुरू हो जाओ! =

== पूर्वापेक्षाएँ ==

इससे पहले कि हम होस्टिंग में जाएं, आइए प्रशासनिक सेटअप पूरा कर लें। सुनिश्चित करें कि निम्नलिखित पूर्ण हैं:

**आपके पास AWS खाता है यहां AWS खाते के लिए साइन अप करें: httpsaws.amazon.com/resources/create-account/ **AWS कंसोल में AWS उपयोगकर्ता बनाएं, IAM टैब पर जाएं, और Ã पर जाएं साइडबार पर Â एक Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â अनुभाग।

à एक  ¢   Add Userà ¢   पर क्लिक करें और à  ¢ एक  एक  एक प्रोग्रामेटिक एक्सेस एक  ¢ एक  की जांच करें ÃÂ।

![ ](httpsmiro.medium.com/max/1400/1*gMtvyUQ_X2YVYHwNfLeygg.png)

ࢠ  अगला क्लिक करें: Permissionsà  ¢   और यहां à एक  ÂÂÂÂÂÂÂमौजूदा नीतियों को सीधे संलग्न करेंका चयन करें। ÂÃÂ। परिनियोजन उद्देश्य के लिए à एक                    ¢  Â की जाँच करें।

![ ](httpsmiro.medium.com/max/1400/1*UfuPz5oak9QbxX0VXlNV5g.png)

अगले बटन के माध्यम से क्लिक करें और अंत में Ã एक ¢ एक एक Â एक Â एक Â एक Â एक Â एक Â एक Â एक Â एक पर क्लिक करें।

![ ](httpsmiro.medium.com/max/1400/1*aSCgwjWRAiNQHBV_bSRlvA.png)

अंतिम चरण में, हम एक एक्सेस कुंजी आईडी और गुप्त एक्सेस कुंजी प्राप्त करते हैं। डाउनलोड करें और

** उन्हें अपने कंप्यूटर पर सहेजें क्योंकि आपको बाद में इसकी आवश्यकता होगी

== एडब्ल्यूएस सीएलआई == स्थापित करें

एडब्ल्यूएस सीएलआई एक शक्तिशाली उपकरण है जो परिनियोजन प्रक्रिया को सरल बनाने में हमारी सहायता कर सकता है।

आइए Homebrew (macOS के लिए) का उपयोग करके AWS CLI स्थापित करें। होमब्रू स्थापित करें यदि आपने पहले से नहीं किया है।

*ध्यान दें: यदि आप विंडोज का उपयोग कर रहे हैं, तो आप आधिकारिक डॉक्स* *यहां* पर निर्देश प्राप्त कर सकते हैं

अपना टर्मिनल खोलें, और दर्ज करें

काढ़ा awscli स्थापित करें।

एक बार CLI टूल इंस्टॉल हो जाने के बाद, हम अपने AWS खाते को इसके साथ कॉन्फ़िगर कर सकते हैं

एडब्ल्यूएस कॉन्फ़िगर करें। यह वह जगह है जहां आपको पहले डाउनलोड की गई एक्सेस कुंजी जानकारी दर्ज करनी होगी। यह निम्न जैसा कुछ होना चाहिए।

क्षेत्र के लिए, आप अपने URL को AWS कंसोल पर देख सकते हैं और यह आपके क्षेत्र का उल्लेख करेगा। उदाहरण के लिए, मेरा ÃÂ ¢ Â Â एपी-दक्षिणपूर्व-1ÃÂ ¢ एक ÂÂÃÂ है।

![ ](httpsmiro.medium.com/max/1400/1*TbFgHQ9ey3SwBWtadBtqSQ.png)
= एक रिएक्ट ऐप बनाना =

आपके पास पहले से ही आपका रिएक्ट ऐप तैनात करने के लिए तैयार हो सकता है। हालाँकि, यदि आपको एक नमूना ऐप की आवश्यकता है, तो आप निम्न विकल्पों का उपयोग कर सकते हैं:

- चलाकर बॉयलरप्लेट रिएक्ट ऐप जेनरेट करें

npx create-react-app my-app

- httpsgithub.com/harishv7/react-hook-form-example से मेरा नमूना रिएक्ट ऐप (एक फॉर्म उदाहरण के साथ) डाउनलोड करें। यह रिएक्ट ऐप्स में फॉर्म जोड़ने के लिए एक ट्यूटोरियल के लिए किया गया था। यहां इसकी जांच कीजिए।

एक बार हो जाने के बाद, सुनिश्चित करें कि निर्भरताएँ सभी का उपयोग करके स्थापित हैं

यार्न स्थापित करें और ऐप को उपयोग करके चलाएं

धागा शुरू।

= सेटअप एक S3 बाल्टी =

अब जब हमारे पास अपना नमूना ऐप तैयार है, तो चलिए हमारे ऐप को होस्ट करने के लिए एक S3 बकेट कॉन्फ़िगर करते हैं।

AWS कंसोल पर, ࢠ  S3à  ¢   के लिए खोजें और S3 डैशबोर्ड पर जाएं। ࢠÂÂÃÂCreate BucketââÃàपर क्लिक करें और बकेट को âÃÂÃÂÂmy-react जैसा नाम दें। -app-2021âÃÂà(या कुछ और जो आप चाहते हैं)।

*ध्यान दें: बकेट का नाम पूरे S3 में अद्वितीय होना चाहिए। इसलिए एक अद्वितीय नाम चुनें जो मौजूद नहीं है, अन्यथा आपको एक त्रुटि मिलेगी!

बकेट तक सार्वजनिक पहुंच चालू करें क्योंकि हम इसे लाइव होस्ट कर रहे हैं।

![ ](httpsmiro.medium.com/max/1400/1*Mqn0JUnqAvMMmimuLj7rTg.png)

बाकी सेटिंग्स को वैसे ही रहने दें जैसे वे हैं और âÃÂÃÂÂCreate BucketâÃÂàपर क्लिक करें। आप अपने S3 डैशबोर्ड पर निम्न की तरह एक प्रविष्टि देखेंगे।

![ ](httpsmiro.medium.com/max/1400/1*pW6x0HIgq9WgauWy-SFIow.png)

आइए क्लिक करें और हमारी नई बनाई गई S3 बकेट में जाएं।

![ ](httpsmiro.medium.com/max/1400/1*PNhe4x_fs02RmMKIQmGbng.png)

Letà  ¢                                    Â Â Â Â Â देखें à एक      स्थिर वेबसाइट होस्टिंग एक  एक ।

![ ](httpsmiro.medium.com/max/1400/1*mRdXzoHrc1LHQ8Hy-2V4UQ.png)

ࢠÂÂÂÂEnableâÃÂàपर क्लिक करें और âÃÂÃÂindex.htmlâàदर्ज करें इंडेक्स दस्तावेज़ के तहत ÃÂ।

![ ](httpsmiro.medium.com/max/1400/1*3d4nQKZrRAh5SmgbL0-yhA.png)

अन्य क्षेत्रों को समान रहने दें और âÃÂÃÂसेव चेंजेस पर क्लिक करें।

= S3 में परिनियोजन =

अब, हम अपने ऐप को S3 पर परिनियोजित करने के लिए तैयार हैं। ऐसा करने का तरीका निम्नलिखित सीएलआई कमांड का उपयोग करना है:

aws s3 सिंक बिल्ड/ s3your-bucket-name>--acl public-read
हम इस कमांड को अपनी package.json फाइल में âÃÂÃÂdeployâÃÂàस्क्रिप्ट के रूप में भी जोड़ सकते हैं।

![ ](httpsmiro.medium.com/max/1400/1*BY8AO0YO7WqOUMPWA_XsVQ.png)

Letà  ¢   का उपयोग करके हमारे ऐप का निर्माण करें

यार्न बिल्ड जो एक अनुकूलित उत्पादन बिल्ड बनाने में मदद करता है।

अगला, चलो ऊपर दिए गए सीएलआई कमांड को चलाते हैं या यदि आपने अपनी प्रकाशित स्क्रिप्ट को package.json में सेटअप किया है, तो हम इसका उपयोग कर सकते हैं

यार्न की तैनाती।

![ ](httpsmiro.medium.com/max/1400/1*8ZbQ49dzPzGo_TkYh3_H1w.png)

बस इतना ही, हमारा ऐप अब तैनात है!

यह पता लगाने के लिए कि हमारा ऐप कहाँ होस्ट किया गया है (वेबसाइट लिंक), AWS S3 कंसोल पर जाएँ और आपके द्वारा बनाई गई बकेट पर क्लिक करें।

à एक  ¢    Propertiesà  ¢   टैब पर जाएं और à एक  ¢ एक एक ÂÂस्थैतिक वेबसाइट के लिए सभी तरह से नीचे स्क्रॉल करें Hostingà एक  ¢  अनुभाग और हमारा यूआरएल वहां होगा।

![ ](httpsmiro.medium.com/max/1400/1*SbuQahvHex1KetHvddN2rw.png)

इस पर क्लिक करें और आपका ऐप एक नए टैब में खुल जाएगा। यहाँ मेरा है!

![ ](httpsmiro.medium.com/max/1400/1*LcpVXd_SeBMLbJafgOAbEA.png)

= निष्कर्ष =

हमने अपने रिएक्ट ऐप को Amazon S3 में सफलतापूर्वक तैनात कर दिया है! अपने रिएक्ट प्रोटोटाइप को जल्दी से तैनात और परीक्षण करने और इसे दूसरों के साथ साझा करने के लिए यह एक बढ़िया विकल्प है। यह वास्तव में तैनात करने के लिए वास्तव में आसान और त्वरित है।

आशा है कि यह ट्यूटोरियल आपके लिए उपयोगी था!

हैप्पी कोडिंग! ðÃÂÃÂû

*अधिक सामग्री* *plainenglish.io* पर