मैक वेब डेवलपमेंट में मास्टर करें: आवश्यक सेटअप गाइड

जबकि आप केवल टेक्स्ट एडिटर और ब्राउज़र के साथ बेसिक वेबसाइट बना सकते हैं, आप React या Vue जैसे JavaScript फ्रेमवर्क और Git जैसे उपयोगी टूल को अपने वर्कफ्लो में जोड़कर अपना गेम अपग्रेड करना चाह सकते हैं।

लेकिन रुकिए! आपका मैक तैयार नहीं है। गोता लगाने से पहले, आपको कुछ आइटम इंस्टॉल करने होंगे जो बाद में भ्रमित करने वाली त्रुटियों से आपको बचाएंगे। ?

यह लेख आपको अपने मैक पर JavaScript-आधारित वेब डेवलपमेंट के साथ उठने और चलने के लिए आवश्यक न्यूनतम सेटअप के माध्यम से मार्गदर्शन करेगा।

चलिए शुरू करते हैं!

अपना मैक अपडेट करें

किसी भी नए सॉफ्टवेयर को इंस्टॉल करने से पहले, macOS और अपने वर्तमान सॉफ्टवेयर को नवीनतम संस्करण में अपग्रेड करने के लिए Apple के इन निर्देशों का पालन करें।

टर्मिनल ऐप चुनें

चूंकि आप इस लेख में कमांड लाइन का उपयोग करके अपने मैक के साथ इंटरैक्ट करेंगे, आपको एक टर्मिनल ऐप की आवश्यकता होगी।

निम्नलिखित में से कोई भी अच्छा विकल्प है:

• Hyper
• iTerm2
• Visual Studio Code का इंटीग्रेटेड टर्मिनल
• Terminal (आपके मैक के साथ आने वाला डिफ़ॉल्ट ऐप)

यदि आप सुनिश्चित नहीं हैं कि कौन सा चुनना है, तो Hyper चुनें।

कमांड लाइन डेवलपर टूल्स

कमांड लाइन से आपको सबसे पहले अपने मैक के कमांड लाइन डेवलपर टूल्स इंस्टॉल करने की आवश्यकता होगी। इन्हें अभी इंस्टॉल करने से बाद में अजीब त्रुटियों से बचा जा सकेगा।

यह जांचने के लिए कि टूल्स पहले से इंस्टॉल हैं या नहीं, अपने टर्मिनल ऐप में निम्नलिखित कमांड टाइप करें और रिटर्न दबाएं:

xcode-select --version

यदि परिणाम संस्करण संख्या नहीं है, तो इस कमांड से टूल्स इंस्टॉल करें:

xcode-select --install

एक डायलॉग दिखाई देगा जो पूछेगा कि क्या आप टूल्स इंस्टॉल करना चाहते हैं। Install पर क्लिक करें और पैकेज डाउनलोड और इंस्टॉल हो जाएगा।

जब इंस्टॉलेशन समाप्त हो जाए, तो पहली कमांड को फिर से चलाकर पुष्टि करें कि टूल्स अब इंस्टॉल हैं:

xcode-select --version

परिणाम अब एक संस्करण संख्या होना चाहिए।

Homebrew

अगले कुछ टूल्स को प्रत्येक टूल की वेबसाइट पर जाकर, डाउनलोड पेज ढूंढकर, डाउनलोड लिंक पर क्लिक करके, फाइलों को अनज़िप करके, और मैन्युअल रूप से इंस्टॉलर चलाकर इंस्टॉल करने के बजाय, हम Homebrew का उपयोग करने जा रहे हैं।

Homebrew एक टूल है जो आपको कमांड लाइन से अपने मैक पर सॉफ्टवेयर इंस्टॉल, अपडेट और अनइंस्टॉल करने देता है। यह मैन्युअल दृष्टिकोण से तेज़ और सुरक्षित है और आम तौर पर आपके डेवलपमेंट जीवन को आसान बनाता है।

सबसे पहले, जांचें कि Homebrew पहले से इंस्टॉल है या नहीं:

brew --version

यदि आपको संस्करण संख्या नहीं दिखती है, तो इस कमांड से Homebrew इंस्टॉल करें:

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

मैं वादा करता हूं कि यह इस लेख में आप देखेंगे सबसे अजीब कमांड है! ? Homebrew के लिए धन्यवाद, बाकी सरल हैं।

आगे बढ़ने से पहले, पुष्टि करें कि Homebrew अब इंस्टॉल है:

brew --version

Node और npm

Node.js एक टूल है जो आपके मैक को वेब ब्राउज़र के बाहर JavaScript कोड चलाने की अनुमति देता है। यदि आप अपने मैक पर React या Vue जैसे JavaScript फ्रेमवर्क चलाना चाहते हैं, तो आपको Node इंस्टॉल करना होगा।

Node में npm (Node Package Manager) भी शामिल है, जो आपको मुफ्त कोड की एक विशाल लाइब्रेरी तक पहुंच प्रदान करता है जिसे आप अपने प्रोजेक्ट्स में डाउनलोड और उपयोग कर सकते हैं।

सबसे पहले, जांचें कि Node पहले से इंस्टॉल है या नहीं:

node --version

यदि नहीं, तो Homebrew से इसे इंस्टॉल करें:

brew install node

अंत में, पुष्टि करें कि Node और npm अब इंस्टॉल हैं:

node --version

npm --version

Git के साथ वर्जन कंट्रोल

Git एक टूल है जो आपको अपने कोड में बदलाव ट्रैक करने और अन्य डेवलपर्स के साथ शेयर्ड प्रोजेक्ट्स पर काम करने में मदद करता है।

हर प्रोजेक्ट पर Git का उपयोग करना एक शानदार आदत विकसित करने और आपको भविष्य के प्रोजेक्ट्स के लिए तैयार करने के लिए है जहां Git आवश्यक हो सकता है। कुछ टूल्स (जैसे GatsbyJS) भी आपके मैक पर Git इंस्टॉल होने पर निर्भर करते हैं, इसलिए आपको इसकी आवश्यकता होगी भले ही आप इसे अपने वर्कफ्लो में जोड़ने की योजना न बना रहे हों।

एक बार फिर, यह जांचकर शुरू करें कि Git पहले से इंस्टॉल है या नहीं:

git --version

यदि नहीं, तो इसे इंस्टॉल करें:

brew install git

और इंस्टॉलेशन काम किया या नहीं इसकी पुष्टि करें:

git --version

कभी-कभी निम्नलिखित कमांड चलाएं और Homebrew के साथ आपके द्वारा इंस्टॉल की गई हर चीज स्वचालित रूप से अपडेट हो जाएगी:

brew update && brew upgrade && brew cleanup && brew doctor

वह एक कमांड आपके सिस्टम को अप टू डेट रखने के लिए आपको आवश्यक सब कुछ है। ?

मैं आमतौर पर इसे तब चलाता हूं जब मैं एक नया प्रोजेक्ट शुरू करता हूं, लेकिन जब भी आप चाहें ऐसा करने के लिए स्वतंत्र महसूस करें। (जब आप यह कमांड चलाते हैं, यदि Homebrew आपको चलाने के लिए अतिरिक्त कमांड सुझाता है, तो आगे बढ़ें और उन्हें चलाएं। यदि कोई कमांड sudo से शुरू होती है और आपसे पासवर्ड मांगा जाता है, तो अपने मैक के एडमिन पासवर्ड का उपयोग करें।)

कमांड लाइन के लिए बस इतना ही!

कोड एडिटर

जबकि आप किसी भी टेक्स्ट एडिटर में कोड लिख सकते हैं, ऐसा एक उपयोग करना जो आपके कोड को हाइलाइट और वैलिडेट करता है, आपके जीवन को बहुत आसान बना देगा।

निम्नलिखित में से कोई भी अच्छा विकल्प है:

• Visual Studio Code
• Atom
• Sublime Text

यदि आप बस शुरू कर रहे हैं, तो Visual Studio Code चुनें।

ब्राउज़र

जैसे-जैसे आप कोड करते हैं, आपके द्वारा बनाए जा रहे ऐप या वेबसाइट को ब्राउज़र में देखकर यह पुष्टि करने में मदद मिलती है कि यह काम करता है। जबकि आप इसके लिए किसी भी ब्राउज़र का उपयोग कर सकते हैं, कुछ में अतिरिक्त डेवलपर टूल शामिल हैं जो आपके कोड और इसे कैसे सुधारें, इसके बारे में विवरण दिखाते हैं।

निम्नलिखित में से कोई भी अच्छा विकल्प है:

• Chrome
• Firefox

यदि आप बस शुरू कर रहे हैं, तो Chrome चुनें।

Finder

यहां एक त्वरित टिप: आप उन फाइलों को दिखाना चाहेंगे जिन्हें आपका मैक डिफ़ॉल्ट रूप से छुपाता है। (उदाहरण के लिए, git फाइलें स्वचालित रूप से छिपी होती हैं, लेकिन कभी-कभी आप उन्हें एडिट करना चाहेंगे।)

अपने मैक की छिपी हुई फाइलों को दिखाने का सबसे आसान तरीका कीबोर्ड शॉर्टकट ⌘⇧. (Command + Shift + Period) के साथ है। यह इन फाइलों को दिखाने और छिपाने के बीच वैकल्पिक होगा ताकि आप जब आवश्यक हो उन्हें एक्सेस कर सकें।

निष्कर्ष

आप पूरी तरह तैयार हैं! ?

अपने मैक पर JavaScript-आधारित फ्रंट-एंड डेवलपमेंट के साथ उठने और चलने के लिए आपको बस इतना ही चाहिए।

भ्रम को रोकने के लिए, मैंने उन वस्तुओं को छोड़ दिया जो सख्ती से आवश्यक नहीं हैं। यदि आप वैकल्पिक तरीकों में गहराई से गोता लगाना चाहते हैं जिनसे आप अपने मैक को वेब डेवलपमेंट के लिए और कस्टमाइज़ कर सकते हैं, तो नीचे दिए गए लिंक देखें।

आगे पढ़ने के लिए

• Tania Rascia द्वारा Setting up a Brand New Mac for Development
• Ben Honeywill द्वारा Setting up a MacBook for Front-End Development
• WebDevStudios द्वारा Leaving Homestead: Finding the Best All-Around Local Development Environment (यदि आपको PHP सेटअप की भी आवश्यकता है)

Twitter पर चर्चा करें

मूल रूप से michaeluloth.com पर प्रकाशित।