paint-brush
Vite dApp परियोजना डकराइज गर्नको लागि एक शुरुआती गाइडद्वारा@ileolami
600 पढाइहरू
600 पढाइहरू

Vite dApp परियोजना डकराइज गर्नको लागि एक शुरुआती गाइड

द्वारा Ileolami6m2024/09/24
Read on Terminal Reader

धेरै लामो; पढ्नकाे लागि

डकर विकास, ढुवानी, र चलिरहेको अनुप्रयोगहरूको लागि खुला प्लेटफर्म हो। डकरले तपाइँलाई ** कन्टेनर भनिने ढिलो पृथक वातावरणमा तपाइँको एप्लिकेसनलाई एकल इकाईको रूपमा प्याकेज गर्न र चलाउन अनुमति दिन्छ। कन्टेनरहरू हल्का छन् र अनुप्रयोग चलाउन आवश्यक सबै समावेश छन्। तपाईंले काम गर्दा कन्टेनरहरू साझेदारी गर्न सक्नुहुन्छ, र तपाईंले सेयर गर्नुभएका सबैजनाले समान रूपमा काम गर्ने समान कन्टेनर पाउँछन् भन्ने कुरा सुनिश्चित गर्नुहोस्।
featured image - Vite dApp परियोजना डकराइज गर्नको लागि एक शुरुआती गाइड
Ileolami HackerNoon profile picture
0-item


तपाईं DOCKERIZE के हो भनेर सोच्दै हुनुहुन्छ। यसको मतलब तपाईको dApp प्रोजेक्ट कन्टेनराइज गर्न डकर प्रयोग गर्नु हो।

डकर विकास, ढुवानी, र चलिरहेको अनुप्रयोगहरूको लागि खुला प्लेटफर्म हो। डकरले तपाइँलाई तपाइँको पूर्वाधारबाट तपाइँको अनुप्रयोगहरू अलग गर्न सक्षम बनाउँछ ताकि तपाइँ छिटो सफ्टवेयर डेलिभर गर्न सक्नुहुन्छ।

  • अनुप्रयोगहरूले वेब एपहरू, APIs, मोबाइल एपहरू, र ब्याकएन्ड सेवाहरू समावेश गर्दछ। यसमा तपाईंले लेख्नुहुने कोड, तपाईंले प्रयोग गर्नुहुने पुस्तकालयहरू, र यसलाई चलाउनको लागि आवश्यक कन्फिगरेसनहरू समावेश हुन्छन्।
  • अपरेटिङ सिस्टम (OS), नेटवर्क सेटिङ, वेब सर्भर, डाटाबेस, र अन्य सेवाहरू जस्तै पूर्वाधारहरू तपाईंको अनुप्रयोगले अन्तर्क्रिया गर्दछ। यसले हार्डवेयर वा भर्चुअल मेसिनहरू पनि समावेश गर्दछ जहाँ तपाईंको अनुप्रयोग चल्छ।

डकरले तपाइँलाई कन्टेनर भनिने ढिलो पृथक वातावरणमा तपाइँको एप्लिकेसनलाई एकल इकाईको रूपमा प्याकेज गर्न र चलाउन अनुमति दिन्छ।

कन्टेनर

कन्टेनरहरू हल्का हुन्छन् र एप चलाउनको लागि आवश्यक सबै कुरा समावेश गर्दछ, त्यसैले तपाइँ होस्टमा स्थापना भएको कुरामा भर पर्नु पर्दैन। तपाईंले काम गर्दा कन्टेनरहरू साझेदारी गर्न सक्नुहुन्छ, र तपाईंले सेयर गर्नुभएका सबैजनाले समान रूपमा काम गर्ने समान कन्टेनर पाउँछन् भन्ने कुरा सुनिश्चित गर्नुहोस्।

उदाहरणका लागि, तपाईं र तपाईंका सहकर्मीहरू Node.js र Hardhat प्रयोग गर्ने dApp परियोजनामा काम गर्दै हुनुहुन्छ। प्रारम्भमा, तपाईंले आफ्नो स्थानीय मेसिनमा परियोजना सेटअप गर्नुभयो, थाहा छ कि तपाईंका सहकर्मीहरूले स्थानीय रूपमा अनुप्रयोग चलाउन सक्नु अघि, तिनीहरूले आफ्नो प्रणालीहरूमा Node.js र Hardhat स्थापना गर्नुपर्नेछ। अब, कल्पना गरौं कि तपाईका सहकर्मीहरू मध्ये एकले Node.js र Hardhat सँग मिल्ने मेसिन प्रयोग गर्दै हुनुहुन्छ। तपाईं यो समस्या कसरी समाधान गर्नुहुन्छ?

डकरको साथ, तपाइँ तपाइँको एप्लिकेसन प्याकेज गर्न सक्नुहुन्छ, यसको सबै निर्भरताहरू सहित, एकल कन्टेनरमा जुन कुनै पनि अपरेटिङ सिस्टममा चल्न सक्छ। यसले विभिन्न मेसिनहरूमा अलग-अलग सफ्टवेयर वा निर्भरताहरू स्थापना गर्ने समस्या समाधान गर्दछ।

छविहरू

तपाईंले आफ्नो आवेदन कन्टेनराइज गरिसकेपछि, तपाईं यसलाई कसरी चलाउन सक्नुहुन्छ?

फ्रन्टएन्ड विकासकर्ताको रूपमा, नयाँ प्रतिक्रिया एप सुरु गर्दा, तपाइँ सामान्यतया npx create-react-app वा npm init vite@latest चलाउनुहुन्छ। अवस्थित परियोजनाको लागि, तपाइँ सामान्यतया यसलाई स्थानीय रूपमा चलाउनको लागि npm install पछि git pull चलाउनुहुनेछ। त्यसै गरी, कन्टेनर चलाउन, तपाईंलाई कन्टेनर छवि भनिन्छ।

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

कन्टेनर छविको लागि तल हेर्नुहोस्:

"web3-dapp: नवीनतम" नामको डकर छवि व्यवस्थापन इन्टरफेसको स्क्रिनसट।

व्यावहारिक

यस खण्डमा, तपाइँ कसरी कन्टेनराइज गर्ने र तपाइँको एप साझा गर्ने सिक्नुहुनेछ।

पूर्व शर्तहरू

  1. तपाईंले डकर डेस्कटपको नवीनतम संस्करण स्थापना गर्नुभएको छ।
  2. तपाईंले Git ग्राहक स्थापना गर्नुभएको छ।
  3. फाइलहरू सम्पादन गर्न तपाईंसँग IDE वा पाठ सम्पादक छ। Docker ले Visual Studio C ode प्रयोग गर्न सिफारिस गर्छ।

तपाईंको आवेदन कन्टेनराइज गर्नुहोस्

  1. तपाईंको रूट डाइरेक्टरीमा, यो आदेश प्रम्प्ट प्रयोग गरेर डकर सुरु गर्नुहोस्:

     docker init
  2. प्रम्प्टहरूको जवाफ प्रदान गर्नुहोस्

     ? What application platform does your project use? Node ? What version of Node do you want to use? 20.16.0 ? Which package manager do you want to use? npm ? Do you want to run "npm run build" before starting your server? No ? What command do you want to use to start the app? ["npm", "run", "dev"] ? What port does your server listen on? 5173
  3. तपाईंले आफ्नो डाइरेक्टरीमा तीनवटा अतिरिक्त फाइलहरू देख्नुहुनेछ, जस्तै .dockerignore , compose.yamlDockerFile

  1. Dockerfile भित्र, फाइल खाली गर्नुहोस् र निम्न थप्नुहोस्:

     # syntax=docker/dockerfile:1 ARG NODE_VERSION=20.16.0 FROM node:${NODE_VERSION}-alpine # Use development node environment by default. ENV NODE_ENV development WORKDIR /app # Copy package.json and package-lock.json to the working directory COPY package.json package-lock.json ./ # Install dependencies RUN npm install # Copy the rest of the source files into the image COPY . . # Change ownership of the /app directory to the node user RUN chown -R node:node /app # Switch to the node user USER node # Ensure node_modules/.bin is in the PATH ENV PATH /app/node_modules/.bin:$PATH # Expose the port that the application listens on EXPOSE 5173 # Run the application CMD ["npm", "run", "dev"]
  2. यो प्रयोग गरेर आफ्नो कन्टेनर छवि बनाउनुहोस्:

     docker build -t <your-image-name> .
  3. तपाईंको कन्टेनर छवि हेर्नको लागि, तपाईंको डकर डेस्कटपमा जानुहोस्, Images क्लिक गर्नुहोस्, तल देखाइएको रूपमा

    वा तपाइँ यो आदेश प्रम्प्ट प्रयोग गर्न सक्नुहुन्छ,

     docker images
  4. तपाईंको टर्मिनलमा तपाईंको कन्टेनर छवि हेर्न

    टर्मिनल सञ्झ्यालको स्क्रिनसट "डकर छविहरू" आदेशको आउटपुट प्रदर्शन गर्दै

  5. छवि चलाउनुहोस्:

     docker run -p 5173:5173 <your-image-name>

तपाईंले यस्तो आउटपुट हेर्नु पर्छ:

 > [email protected] dev > vite VITE v5.4.2 ready in 222 ms ➜ Local: http://localhost:5173/ ➜ Network: http://172.17.0.2:5173/

आवेदन साझेदारी गर्दै

  1. साइन अप गर्नुहोस् वा डकर हबमा साइन इन गर्नुहोस्।

  2. रिपोजिटरी सिर्जना गर्नुहोस् बटन चयन गर्नुहोस्।

  3. एउटै कन्टेनर छवि नामको साथ आफ्नो भण्डारको नाम दिनुहोस्। निश्चित गर्नुहोस् कि दृश्यता सार्वजनिक छ।

  4. सिर्जना चयन गर्नुहोस्।

  1. कमाण्ड लाइन प्रयोग गरेर डकर हबमा साइन इन गर्नुहोस्

     docker login -u <YOUR USERNAME>
  2. आफ्नो पासवर्ड प्रविष्ट गर्नुहोस्

    टाइप गर्दा तपाईको पासवर्ड देखिने छैन

  3. getting-started छविलाई नयाँ नाम दिन docker tag आदेश प्रयोग गर्नुहोस्। तपाईंको डकर आईडीको साथ YOUR-USER-NAME बदल्नुहोस्:

    तपाईंले यो denied: requested access to the resource is denied

    यसलाई ठीक गर्न,

    1. docker login प्रयोग गरेर पुन: लगइन गर्नुहोस्, इन्टर थिच्नुहोस्।
    2. त्यस पछि, तपाइँ तपाइँको ब्राउजरमा नेभिगेट गरिनेछ,
    3. तपाईको OTP टर्मिनल प्रतिलिपि गर्नुहोस् र यसलाई इनपुट गर्नुहोस्,
    4. CONFIRM थिच्नुहोस्
    5. छवि दोहोर्याउनुहोस्

    तपाईंले जस्तै आउटपुट देख्नुहुनेछ:

यसले तपाईंको छवि बनाइएको र रजिस्ट्रीमा धकेलिएको देखाउँछ। तपाईंको टोलीले अब यो छवि तान्न र तिनीहरूको स्थानीय मेसिनमा अनुप्रयोग चलाउन सक्छ।

तपाइँ तपाइँको डकर डेस्कटप वा डकर हबको खोज पट्टीमा तपाइँको कन्टेनर छवि खोजी गरेर जाँच गर्न सक्नुहुन्छ।

समस्या निवारण

  • पोर्ट द्वन्द्व :

    • त्रुटि : यदि पोर्ट पहिले नै प्रयोगमा थियो।

    • समाधान : पोर्ट प्रयोग गरी प्रक्रिया पहिचान गर्नुहोस् र निम्न आदेशहरू प्रयोग गरेर यसलाई समाप्त गर्नुहोस्:

       # Find the process using port 8000 lsof -i :8000 # Kill the process (replace <PID> with the actual process ID found from the previous command) kill -9 <PID> 

    • वैकल्पिक रूपमा, तपाईंले डकर कन्टेनरलाई फरक पोर्टमा चलाउन सक्नुहुन्छ:

       docker run -p 8001:8000 <your-image-name>
  • एउटा आवेदन अद्यावधिक गर्नुहोस्

    तपाईंले आफ्नो एप अपडेट गर्ने कुनै पनि कुरा जस्तै तपाईंले सिन्ट्याक्स वा प्रकार्य परिवर्तन गर्नुहुन्छ,

    1. तपाईंको डकर डेस्कटप रोक्नुहोस्, Containers क्लिक गर्नुहोस्

    2. पोर्ट रोक्नुहोस् र मेटाउन क्लिक गर्नुहोस्

    3. docker build कमाण्ड प्रयोग गरेर अनुप्रयोग पुन: निर्माण गर्नुहोस्

       docker build -t <your-image-name> .
    4. एप पुन: चलाउनुहोस्

       docker run -p 5173:5173 <your-image-name>


निष्कर्ष

यस गाइडलाई पछ्याएर, तपाइँ सजिलैसँग तपाइँको अनुप्रयोग र यसको निर्भरतालाई कन्टेनरमा प्याकेज गर्न सक्नुहुन्छ, तपाइँको टोलीसँग साझेदारी गर्न सक्नुहुन्छ, र यसलाई कुनै पनि मेसिनमा सजिलै चलाउन सक्नुहुन्छ। यसले सहयोग मात्र बढाउँदैन तर वातावरण सेटअप र अनुकूलता सम्बन्धी समस्याहरूलाई पनि कम गर्छ।