# vscode.dev प्रयोग गरेर रिजुमे-वेबसाइट बनाउनुहोस् _कति राम्रो होला जब कुनै भर्तीकर्ताले तपाईंको रिजुमे माग्छन् र तपाईंले उनीहरूलाई एउटा URL पठाउनुहुन्छ?_ 😎 ## उद्देश्यहरू यस असाइनमेन्टपछि, तपाईंले सिक्नुहुनेछ: - आफ्नो रिजुमे प्रदर्शन गर्न वेबसाइट बनाउने ### पूर्व-आवश्यकताहरू 1. GitHub खाता। [GitHub](https://github.com/) मा जानुहोस् र यदि तपाईंले पहिले नै खाता बनाउनु भएको छैन भने खाता बनाउनुहोस्। ## चरणहरू **चरण १:** नयाँ GitHub Repository बनाउनुहोस् र यसलाई `my-resume` नाम दिनुहोस्। **चरण २:** आफ्नो Repository मा `index.html` फाइल बनाउनुहोस्। हामी github.com मा कम्तिमा एउटा फाइल थप्नेछौं किनभने तपाईं खाली Repository लाई vscode.dev मा खोल्न सक्नुहुन्न। `creating a new file` लिंकमा क्लिक गर्नुहोस्, `index.html` नाम टाइप गर्नुहोस् र `Commit new file` बटन चयन गर्नुहोस्। ![github.com मा नयाँ फाइल बनाउनुहोस्](../../../../translated_images/new-file-github.com.c886796d800e8056561829a181be1382c5303da9d902d8b2dd82b68a4806e21f.ne.png) **चरण ३:** [VSCode.dev](https://vscode.dev) खोल्नुहोस् र `Open Remote Repository` बटन चयन गर्नुहोस्। तपाईंले आफ्नो रिजुमे साइटको लागि सिर्जना गरेको Repository को URL कपी गर्नुहोस् र इनपुट बक्समा पेस्ट गर्नुहोस्: _`your-username` लाई आफ्नो GitHub प्रयोगकर्ता नामले बदल्नुहोस्_ ``` https://github.com/your-username/my-resume ``` ✅ सफल भएमा, तपाईं आफ्नो प्रोजेक्ट र `index.html` फाइल ब्राउजरको टेक्स्ट एडिटरमा खुला भएको देख्नुहुनेछ। ![नयाँ फाइल बनाउनुहोस्](../../../../translated_images/project-on-vscode.dev.e79815a9a95ee7feac72ebe5c941c91279716be37c575dbdbf2f43bea2c7d8b6.ne.png) **चरण ४:** `index.html` फाइल खोल्नुहोस्, तलको कोडलाई आफ्नो कोड क्षेत्रमा पेस्ट गर्नुहोस् र बचत गर्नुहोस्।
रिजुमे वेबसाइटको सामग्रीको लागि HTML कोड। यहाँ आफ्नो नाम लेख्नुहोस्!

सम्पर्क

यहाँ आफ्नो इमेल लेख्नुहोस्

यहाँ आफ्नो प्रयोगकर्ता नाम लेख्नुहोस्!

यहाँ आफ्नो प्रयोगकर्ता नाम लेख्नुहोस्!

सीपहरू

  • सीप १!
  • सीप २!
  • सीप ३!
  • सीप ४!

शिक्षा

यहाँ आफ्नो कोर्स लेख्नुहोस्!

यहाँ आफ्नो संस्था लेख्नुहोस्!

सुरु - अन्त्य मिति

बारेमा

आफ्नो बारेमा केही लेख्नुहोस्!

कामको अनुभव

कामको शीर्षक

यहाँ संस्थाको नाम लेख्नुहोस् | सुरु महिना – अन्त्य महिना

  • कार्य १ - तपाईंले के गर्नुभयो लेख्नुहोस्!
  • कार्य २ - तपाईंले के गर्नुभयो लेख्नुहोस्!
  • तपाईंको योगदानको परिणाम/प्रभाव लेख्नुहोस्

कामको शीर्षक २

यहाँ संस्थाको नाम लेख्नुहोस् | सुरु महिना – अन्त्य महिना

  • कार्य १ - तपाईंले के गर्नुभयो लेख्नुहोस्!
  • कार्य २ - तपाईंले के गर्नुभयो लेख्नुहोस्!
  • तपाईंको योगदानको परिणाम/प्रभाव लेख्नुहोस्
HTML कोडमा _placeholder text_ लाई आफ्नो रिजुमे विवरणले बदल्नुहोस्। **चरण ५:** My-Resume फोल्डरमा होभर गर्नुहोस्, `New File ...` आइकनमा क्लिक गर्नुहोस् र आफ्नो प्रोजेक्टमा २ नयाँ फाइलहरू बनाउनुहोस्: `style.css` र `codeswing.json` फाइलहरू। **चरण ६:** `style.css` फाइल खोल्नुहोस्, तलको कोड पेस्ट गर्नुहोस् र बचत गर्नुहोस्।
साइटको लेआउटलाई फर्म्याट गर्न CSS कोड। body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; font-size: 16px; max-width: 960px; margin: auto; } h1 { font-size: 3em; letter-spacing: .6em; padding-top: 1em; padding-bottom: 1em; } h2 { font-size: 1.5em; padding-bottom: 1em; } h3 { font-size: 1em; padding-bottom: 1em; } main { display: grid; grid-template-columns: 40% 60%; margin-top: 3em; } header { text-align: center; margin: auto 2em; } section { margin: auto 1em 4em 2em; } i { margin-right: .5em; } p { margin: .2em auto } hr { border: none; background-color: lightgray; height: 1px; } h1, h2, h3 { font-weight: 100; margin-bottom: 0; } #mainLeft { border-right: 1px solid lightgray; }
**चरण ६:** `codeswing.json` फाइल खोल्नुहोस्, तलको कोड पेस्ट गर्नुहोस् र बचत गर्नुहोस्। { "scripts": [], "styles": [] } **चरण ७:** `Codeswing extension` स्थापना गर्नुहोस् ताकि रिजुमे वेबसाइटलाई कोड क्षेत्रमा देख्न सकियोस्। _`Extensions`_ आइकनमा क्लिक गर्नुहोस् र Codeswing टाइप गर्नुहोस्। विस्तारको थप जानकारी लोड भएपछि, _ब्लू इन्स्टल बटन_ मा क्लिक गरेर स्थापना गर्नुहोस्। विस्तार स्थापना गरेपछि, आफ्नो कोड क्षेत्रमा प्रोजेक्टमा परिवर्तनहरू देख्नुहोस् 😃। ![Extensions स्थापना गर्नुहोस्](../../../../8-code-editor/images/install-extension.gif) यो तपाईंको स्क्रिनमा देखिनेछ जब तपाईंले विस्तार स्थापना गर्नुहुन्छ। ![Codeswing विस्तारको प्रभाव](../../../../translated_images/after-codeswing-extension-pb.0ebddddcf73b550994947a9084e35e2836c713ae13839d49628e3c764c1cfe83.ne.png) यदि तपाईंले गरेका परिवर्तनहरू सन्तोषजनक छन् भने, `Changes` फोल्डरमा होभर गर्नुहोस् र `+` बटनमा क्लिक गरेर परिवर्तनहरू स्टेज गर्नुहोस्। कमिट सन्देश टाइप गर्नुहोस् _(प्रोजेक्टमा तपाईंले गरेको परिवर्तनको विवरण)_ र `check` क्लिक गरेर परिवर्तनहरू कमिट गर्नुहोस्। प्रोजेक्टमा काम सकिएपछि, GitHub मा Repository फर्कनको लागि माथि बायाँ रहेको ह्याम्बर्गर मेनु आइकन चयन गर्नुहोस्। बधाई छ 🎉 तपाईंले केही चरणहरूमा vscode.dev प्रयोग गरेर आफ्नो रिजुमे वेबसाइट सिर्जना गर्नुभयो। ## 🚀 चुनौती तपाईंले परिवर्तन गर्न अनुमति पाएको कुनै रिमोट Repository खोल्नुहोस् र केही फाइलहरू अपडेट गर्नुहोस्। त्यसपछि, आफ्नो परिवर्तनहरू सहित नयाँ ब्रान्च सिर्जना गर्ने प्रयास गर्नुहोस् र Pull Request बनाउनुहोस्। ## समीक्षा र आत्म-अध्ययन [VSCode.dev](https://code.visualstudio.com/docs/editor/vscode-web?WT.mc_id=academic-0000-alfredodeza) र यसको अन्य सुविधाहरूको बारेमा थप पढ्नुहोस्। **अस्वीकरण**: यो दस्तावेज़ AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) प्रयोग गरेर अनुवाद गरिएको छ। हामी यथार्थताको लागि प्रयास गर्छौं, तर कृपया ध्यान दिनुहोस् कि स्वचालित अनुवादहरूमा त्रुटिहरू वा अशुद्धताहरू हुन सक्छ। यसको मूल भाषा मा रहेको मूल दस्तावेज़लाई आधिकारिक स्रोत मानिनुपर्छ। महत्वपूर्ण जानकारीको लागि, व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न हुने कुनै पनि गलतफहमी वा गलत व्याख्याको लागि हामी जिम्मेवार हुने छैनौं।