15 KiB
कोड एडिटर प्रयोग गर्ने: VSCode.dev मा महारथ हासिल गर्नुहोस्
स्वागत छ!
यो पाठले तपाईंलाई VSCode.dev—शक्तिशाली, वेब-आधारित कोड एडिटरको आधारभूतदेखि उन्नत प्रयोगसम्म लैजान्छ। तपाईंले कोड सम्पादन, परियोजना व्यवस्थापन, परिवर्तन ट्र्याक गर्ने, एक्सटेन्सनहरू स्थापना गर्ने, र ब्राउजरबाटै प्रोफेशनल जस्तै सहकार्य गर्ने सीप सिक्नुहुनेछ—कुनै पनि इन्स्टलेशन बिना।
सिक्ने उद्देश्यहरू
यो पाठको अन्त्यसम्म, तपाईं सक्षम हुनुहुनेछ:
- कुनै पनि परियोजनामा, जहाँसुकै, कोड एडिटर कुशलतापूर्वक प्रयोग गर्न
- बिल्ट-इन भर्सन कन्ट्रोलको प्रयोग गरेर आफ्नो काम सहजै ट्र्याक गर्न
- एडिटर कस्टमाइजेसन र एक्सटेन्सनहरूको प्रयोग गरेर आफ्नो विकास कार्यप्रवाहलाई व्यक्तिगत र सुधार गर्न
पूर्वआवश्यकताहरू
सुरु गर्न, निःशुल्क GitHub खाता बनाउनुहोस्, जसले तपाईंलाई कोड रिपोजिटरीहरू व्यवस्थापन गर्न र विश्वव्यापी रूपमा सहकार्य गर्न अनुमति दिन्छ। यदि तपाईंको खाता छैन भने, यहाँ खाता बनाउनुहोस्।
किन वेब-आधारित कोड एडिटर प्रयोग गर्ने?
VSCode.dev जस्तो कोड एडिटर तपाईंको कोड लेख्ने, सम्पादन गर्ने, र व्यवस्थापन गर्ने कमाण्ड सेन्टर हो। सहज इन्टरफेस, धेरै सुविधाहरू, र ब्राउजरमार्फत तत्काल पहुँचको साथ, तपाईं गर्न सक्नुहुन्छ:
- कुनै पनि उपकरणमा परियोजनाहरू सम्पादन गर्नुहोस्
- इन्स्टलेशनको झन्झटबाट बच्नुहोस्
- तुरुन्त सहकार्य र योगदान गर्नुहोस्
एकपटक तपाईं VSCode.dev मा सहज भएपछि, तपाईं जहाँसुकै, कहिल्यै पनि कोडिङ कार्यहरू सामना गर्न तयार हुनुहुनेछ।
VSCode.dev सुरु गर्दै
VSCode.dev मा जानुहोस्—कुनै इन्स्टलेशन छैन, कुनै डाउनलोड छैन। GitHub सँग साइन इन गर्दा पूर्ण पहुँच अनलक हुन्छ, जसमा तपाईंको सेटिङहरू, एक्सटेन्सनहरू, र रिपोजिटरीहरू समावेश छन्। यदि अनुरोध गरियो भने, आफ्नो GitHub खाता जडान गर्नुहोस्।
लोड भएपछि, तपाईंको कार्यक्षेत्र यसरी देखिन्छ:
, ⚙️ (सेटिङ), फाइलहरू, स्रोत नियन्त्रण आदि जस्ता आइकनहरू।
- साइडबार: एक्टिभिटी बार आइकन चयनको आधारमा सन्दर्भ परिवर्तन गर्दछ (डिफल्ट Explorer मा फाइलहरू देखाउन सेट हुन्छ)।
- एडिटर/कोड क्षेत्र: दायाँतर्फको सबैभन्दा ठूलो भाग—जहाँ तपाईं वास्तवमै कोड सम्पादन र हेर्नुहुन्छ।
फिचरहरू अन्वेषण गर्न आइकनहरू क्लिक गर्नुहोस्, तर आफ्नो स्थान कायम राख्न Explorer मा फर्कनुहोस्।
GitHub रिपोजिटरी खोल्दै
विधि १: एडिटरबाट
-
VSCode.dev मा जानुहोस्। "Open Remote Repository" क्लिक गर्नुहोस्।
 प्रयोग गर्नुहोस्।
 पेस्ट गर्नुहोस् र Enter थिच्नुहोस्।
यदि सफल भयो भने, तपाईंले सम्पादन गर्न तयार पूरा परियोजना देख्नुहुनेछ!
विधि २: URL मार्फत तुरुन्त
कुनै पनि GitHub रिपो URL परिवर्तन गरेर VSCode.dev मा सीधा खोल्न github.com लाई vscode.dev/github मा प्रतिस्थापन गर्नुहोस्।
उदाहरण:
- GitHub:
https://github.com/microsoft/Web-Dev-For-Beginners - VSCode.dev:
https://vscode.dev/github/microsoft/Web-Dev-For-Beginners
यो सुविधा कुनै पनि परियोजनामा छिटो पहुँचलाई सुपरचार्ज गर्दछ।
आफ्नो परियोजनामा फाइलहरू सम्पादन गर्दै
एकपटक तपाईंको रिपो खुल्यो भने, तपाईं गर्न सक्नुहुन्छ:
१. नयाँ फाइल सिर्जना गर्नुहोस्
- Explorer साइडबारमा, आफ्नो इच्छित फोल्डरमा जानुहोस् वा रुट प्रयोग गर्नुहोस्।
- ‘New file ...’ आइकन क्लिक गर्नुहोस्।
- आफ्नो फाइलको नाम दिनुहोस्, Enter थिच्नुहोस्, र तपाईंको फाइल तुरुन्त देखिन्छ।
 र हटाइएका (रातो) देखाउँछन्।
![View changes](../images/working-tree.png फाइलहरूको छेउमा रहेको+क्लिक गरेर परिवर्तनहरू कमिटको लागि तयार गर्नुहोस्।- अनावश्यक परिवर्तनहरू undo आइकन क्लिक गरेर Discard गर्नुहोस्।
- स्पष्ट कमिट सन्देश टाइप गर्नुहोस्, त्यसपछि चेकमार्क क्लिक गरेर कमिट र पुश गर्नुहोस्।
GitHub मा आफ्नो रिपोजिटरीमा फर्कन, माथि बायाँ रहेको ह्याम्बर्गर मेनु चयन गर्नुहोस्।
![Stage & commit changes](../images/edit-vscode.dev Extensions को साथ सेट अप गर्नुहोस्
Extensions ले VSCode.dev मा भाषा, थिम, डिबगर्स, र उत्पादकता उपकरणहरू थप्न अनुमति दिन्छ—तपाईंको कोडिङ जीवनलाई सजिलो र रमाइलो बनाउँदै।
एक्सटेन्सनहरू ब्राउज र व्यवस्थापन गर्दै
-
एक्टिभिटी बारमा Extensions आइकन क्लिक गर्नुहोस्।
-
'Search Extensions in Marketplace' बक्समा एक्सटेन्सन खोज्नुहोस्।
![Extension details](../images/extension-details:
- Installed: तपाईंले थपेका सबै एक्सटेन्सनहरू
- Popular: उद्योगका मनपर्नेहरू
- Recommended: तपाईंको कार्यप्रवाहमा उपयुक्त
![View extensions](
१. Extensions स्थापना गर्नुहोस्
-
खोजमा एक्सटेन्सनको नाम टाइप गर्नुहोस्, क्लिक गर्नुहोस्, र एडिटरमा विवरण समीक्षा गर्नुहोस्।
-
साइडबारमा वा मुख्य कोड क्षेत्रमा ब्लू Install बटन थिच्नुहोस्।
![Install extensions](../images/install-extension २. Extensions कस्टमाइज गर्नुहोस्
-
आफ्नो इन्स्टल गरिएको एक्सटेन्सन फेला पार्नुहोस्।
-
Gear आइकन क्लिक गर्नुहोस् → Extension Settings चयन गरेर आफ्नो रुचिअनुसार व्यवहारहरू परिमार्जन गर्नुहोस्।
![Modify extension settings](../images/extension-settings ३. Extensions व्यवस्थापन गर्नुहोस् तपाईं गर्न सक्नुहुन्छ:
-
Disable: एक्सटेन्सनलाई अस्थायी रूपमा बन्द गर्नुहोस् तर इन्स्टल राख्नुहोस्
-
Uninstall: यदि आवश्यक छैन भने स्थायी रूपमा हटाउनुहोस्
एक्सटेन्सन फेला पार्नुहोस्, Gear आइकन क्लिक गर्नुहोस्, र ‘Disable’ वा ‘Uninstall’ चयन गर्नुहोस्, वा कोड क्षेत्रमा ब्लू बटनहरू प्रयोग गर्नुहोस्।
असाइनमेन्ट
आफ्नो सीप परीक्षण गर्नुहोस्: vscode.dev प्रयोग गरेर रिजुम वेबसाइट बनाउनुहोस्
थप अन्वेषण र आत्म-अध्ययन
- VSCode Web Docs को आधिकारिक दस्तावेजसँग गहिरो अध्ययन गर्नुहोस्।
- उन्नत कार्यक्षेत्र सुविधाहरू, किबोर्ड सर्टकटहरू, र सेटिङहरू अन्वेषण गर्नुहोस्।
अब तपाईं जहाँसुकै, कुनै पनि उपकरणमा, VSCode.dev प्रयोग गरेर कोड, सिर्जना, र सहकार्य गर्न तयार हुनुहुन्छ!
अस्वीकरण:
यो दस्तावेज़ AI अनुवाद सेवा Co-op Translator प्रयोग गरी अनुवाद गरिएको हो। हामी यथासम्भव सटीकता सुनिश्चित गर्न प्रयास गर्छौं, तर कृपया ध्यान दिनुहोस् कि स्वचालित अनुवादहरूमा त्रुटिहरू वा अशुद्धताहरू हुन सक्छन्। यसको मूल भाषामा रहेको मूल दस्तावेज़लाई आधिकारिक स्रोत मानिनुपर्छ। महत्त्वपूर्ण जानकारीका लागि, व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न हुने कुनै पनि गलतफहमी वा गलत व्याख्याको लागि हामी जिम्मेवार हुने छैनौं।