డాకర్‌లో VueJS + NodeJS + MongoDB అప్లికేషన్‌ను ఎలా ప్యాకేజీ చేయాలి

గత వ్యాసంలో మీరు చూసినట్లుగా, నేను అనేక రకాల ప్రాజెక్ట్‌లపై పనిచేశాను. ఒక కొత్త బృందంలో మొదటి రోజులు సాధారణంగా ఒకే విధంగా ఉంటాయి: ఒక బ్యాక్-ఎండ్ డెవలపర్ నాతో చేరి, అప్లికేషన్‌ను ఇన్‌స్టాల్ చేసి, డిప్లాయ్ చేసే అద్భుతాన్ని చేస్తారు. ఫ్రంట్-ఎండ్ డెవలపర్‌లకు డాకర్ చాలా అవసరం, ఎందుకంటే బ్యాక్-ఎండ్ తరచుగా PHP/Java/Python/C# వంటి అనేక రకాల స్టాక్‌లలో వ్రాయబడుతుంది, మరియు ప్రతిసారీ అన్నింటినీ ఇన్‌స్టాల్ చేసి, డిప్లాయ్ చేసేటప్పుడు ఫ్రంట్-ఎండ్ డెవలపర్ బ్యాక్-ఎండ్ డెవలపర్‌కు అంతరాయం కలిగించాల్సిన అవసరం ఉండదు. పారదర్శక డిప్లాయ్‌మెంట్, లాగింగ్ మరియు ఇంటిగ్రేటెడ్ ఆటోమేటెడ్ టెస్ట్‌లతో కూడిన డాకర్-జెంకిన్స్ కాంబోను నేను ఒక్కసారి మాత్రమే చూశాను.

డాకర్ గురించి అనేక వివరణాత్మక వ్యాసాలు వ్రాయబడ్డాయి. ఈ వ్యాసం VueJS/Vue Router ఉపయోగించి ఒక సింగిల్ పేజ్ అప్లికేషన్‌ను డిప్లాయ్ చేయడం గురించి వివరిస్తుంది. సర్వర్ వైపు NodeJS తో కూడిన ఒక RESTful API ఉంటుంది, మరియు డేటాబేస్‌గా MongoDB ఉపయోగించబడుతుంది. బహుళ కంటైనర్ అప్లికేషన్‌లను నిర్వచించడానికి మరియు అమలు చేయడానికి డాకర్ కంపోజ్ ఉపయోగించబడుతుంది.

మీకు డాకర్ ఎందుకు అవసరం?

డాకర్ అప్లికేషన్ డిప్లాయ్‌మెంట్ ప్రక్రియను స్వయంచాలకం చేస్తుంది. డెవలపర్లు ఇకపై ప్రోగ్రామ్‌లను మాన్యువల్‌గా ఇన్‌స్టాల్ చేయాల్సిన అవసరం లేదు లేదా వారి మెషీన్‌లలో వెర్షన్ అసమర్థతలతో ఇబ్బంది పడాల్సిన అవసరం లేదు. కేవలం డాకర్‌ను ఇన్‌స్టాల్ చేసి, కన్సోల్‌లో కొన్ని కమాండ్‌లను ఎంటర్ చేస్తే సరిపోతుంది. దీనిని ఉపయోగించి అత్యంత సౌకర్యవంతంగా చేయవచ్చు. Linux.

మొదలు అవుతున్న

ఇన్‌స్టాల్ చేయండి డాకర్ మరియు డాకర్ కంపోజ్

ఫోల్డర్ నిర్మాణం

క్లయింట్ మరియు సర్వర్ అప్లికేషన్ల కోసం రెండు ఫోల్డర్‌లను సృష్టించండి. .yml ఫైల్ అనేది కాన్ఫిగరేషన్ ఫైల్. డాకర్ కంపోజ్, ఇక్కడ అప్లికేషన్ కంటైనర్‌లు నిర్వచించబడి మరియు లింక్ చేయబడతాయి.
Docker-compose.yml:

version: "3"
services:
  mongo:
    container_name: mongo
    hostname: mongo
    image: mongo
    ports:
      - "27017:27017"
  server:
    build: server/
    #command: node ./server.js #здесь можно перезаписать CMD из Dockerfile в /server
    ports:
      - "3000:3000"
    links:
      - mongo
  client:
    build: client/
    #command: http-server ./dist #здесь можно перезаписать CMD из Dockerfile в /client
    network_mode: host
    ports:
      - "8089:8089"
    depends_on:
      - server

మేము డాకర్‌లో మూడు సేవలను సృష్టిస్తున్నాము: ఒకటి NodeJS కోసం, ఒకటి MongoDB కోసం మరియు ఒకటి స్టాటిక్ Vue కోసం. క్లయింట్‌ను సర్వర్‌కు కనెక్ట్ చేయడానికి, మేము జోడించాము సర్వర్‌పై ఆధారపడి ఉంటుందిసర్వర్ APIతో MongoDBని లింక్ చేయడానికి, ఉపయోగించండి లింక్స్ మోంగోసర్వర్, క్లయింట్, మోంగో అనేవి సేవల పేర్లు.

VueJS క్లయింట్

ఫోల్డర్‌లో /క్లయింట్ ఈ అప్లికేషన్ VueJS ఆధారంగా రూపొందించబడింది. ఈ అప్లికేషన్‌ను ఉపయోగించి సృష్టించబడింది. వ్యూ క్లిఇమేజ్‌ను నిర్మించేటప్పుడు, క్లయింట్ అప్లికేషన్ ఒక ఫోల్డర్‌లోని స్టాటిక్ ఫైల్స్ సమితిగా నిర్మించబడుతుంది. /డిస్ట్రిబ్యూట్డాకర్‌ఫైల్ ఇమేజ్‌ను నిర్మించడానికి అవసరమైన ఆదేశాల సమితిని వివరిస్తుంది:

FROM node:10
WORKDIR /client
COPY ./package*.json ./
RUN npm install
RUN npm install -g http-server
COPY . .
RUN npm run build
EXPOSE 8081
CMD ["npm", "test:dev"]

దయచేసి గమనించండి, package.json మిగిలిన ప్రాజెక్ట్ ఫైల్స్ నుండి వేరుగా కాపీ చేయబడి, ఇన్‌స్టాల్ చేయబడుతుంది. పనితీరును మెరుగుపరచడం కోసం ఇలా చేస్తారు, తద్వారా రీబిల్డ్ సమయంలో /node_modules ఫోల్డర్‌లోని కంటెంట్‌లు కాష్ చేయబడతాయి. ప్రతి కమాండ్ లైన్ విడిగా కాష్ చేయబడుతుంది.

చివరగా, కంటైనర్ ప్రారంభమైనప్పుడు, కమాండ్ అమలు చేయబడుతుంది npm run devఈ ఆదేశం package.json లో వివరించబడింది:

"scripts": {
	 "test:dev": "http-server dist -p 8081 -c 1 --push-state"
}

ఫోల్డర్ నుండి ఫైల్‌లను అమలు చేయడానికి /డిస్ట్రిబ్యూట్ప్రపంచవ్యాప్తంగా ఇన్‌స్టాల్ చేయబడింది http-serverమరియు dev-dependencies లో ప్యాకేజీ spa-http-server, తద్వారా వ్యూ రూటర్ సరిగ్గా పనిచేస్తుంది. --push-state ఫ్లాగ్ index.html కు దారి మళ్లిస్తుంది. 1 సెకను విలువతో -c ఫ్లాగ్ జోడించబడింది, తద్వారా http-సర్వర్ స్క్రిప్ట్‌లను కాష్ చేయలేదు. ఇది ఒక పరీక్ష ఉదాహరణ; నిజమైన ప్రాజెక్ట్ కోసం, nginx ఉపయోగించడం ఉత్తమం.

మేము Vuex స్టోర్‌లో ఒక ఫీల్డ్‌ను సృష్టిస్తాము apiHost: 'http://localhost:3000'NodeJS API పోర్ట్ పేర్కొనబడిన చోట, క్లయింట్ వైపు సిద్ధంగా ఉంది. ఇప్పుడు క్లయింట్ నుండి బ్యాక్ ఎండ్‌కు వెళ్లే అన్ని అభ్యర్థనలు ఈ URLకు వెళ్తాయి.

NodeJS సర్వర్ API

ఫోల్డర్‌లో /server మేము సృష్టిస్తాము సర్వర్. js మరియు డాకర్‌ఫైల్:

FROM node:10
WORKDIR /server
COPY ./package*.json ./
RUN npm install
COPY . .
EXPOSE 3000
CMD ["node", "server.js"]

В సర్వర్. js సూచించబడింది url డేటాబేస్ కోసం const url = 'mongodb://mongo:27017/';క్లయింట్ నుండి క్రాస్-డొమైన్ అభ్యర్థనలను అనుమతించడం:

const clientUrl = 'http://localhost:8081';
const corsOptions = {
  origin: clientUrl,
  optionsSuccessStatus: 200, // some legacy browsers (IE11, various SmartTVs) choke on 204
};
app.use(cors());
app.all('/*', (req, res, next) => {
  res.header('Access-Control-Allow-Origin', clientUrl);
  res.header('Access-Control-Allow-Headers', 'X-Requested-With');
  next();
});
  app.get('/getProducts', cors(corsOptions), (req, res) => {
    products.getContent
      .then(data => res.json(data), err => res.json(err));
  });
  app.get('/getUsers', cors(corsOptions), (req, res) => {
    db.getUsers()
      .then(data => res.json(data), err => res.json(err));
  });

తీర్మానం

ఇప్పుడు ప్రాజెక్ట్ డైరెక్టరీకి వెళ్లి రన్ చేద్దాం docker-compose build చిత్రాల నిర్మాణం కోసం మరియు docker-compose up కంటైనర్‌లను ప్రారంభించడానికి. ఈ ఆదేశం 3 కంటైనర్‌లను ప్రారంభిస్తుంది: సర్వర్, క్లయింట్, మోంగోNodeJS సర్వర్ కోసం, మీరు హాట్-రీలోడ్‌ను యూజర్ ఫోల్డర్‌కు లింక్ చేయడం ద్వారా కాన్ఫిగర్ చేయవచ్చు. మరియు డెవలప్‌మెంట్ క్లయింట్ కోసం, మీరు హాట్-రీలోడ్‌ను విడిగా రన్ చేయడం ద్వారా స్థానికంగా అమలు చేయవచ్చు. సర్వర్ и మొంగోప్రత్యేక సేవను ప్రారంభించడానికి, దాని పేరును పేర్కొంటే సరిపోతుంది. docker-compose up clientఅప్పుడప్పుడు దాన్ని చేయడం మర్చిపోవద్దు. prune మరియు వనరులను ఖాళీ చేయడానికి కంటైనర్‌లు, నెట్‌వర్క్‌లు మరియు ఇమేజ్‌లను తొలగించడం.

పూర్తి కోడ్‌ను వీక్షించవచ్చు ఇక్కడఈ ప్రాజెక్ట్ ఇంకా అభివృద్ధి దశలో ఉంది.

మూలం: www.habr.com