டோக்கரில் VueJS + NodeJS + MongoDB பயன்பாட்டை எவ்வாறு தொகுப்பது

டோக்கரில் VueJS + NodeJS + MongoDB பயன்பாட்டை எவ்வாறு தொகுப்பது
முந்தைய கட்டுரையில் இருந்து நீங்கள் புரிந்து கொள்ள முடியும் என, நான் வெவ்வேறு திட்டங்களில் வேலை செய்தேன். ஒரு புதிய குழுவில் முதல் நாட்கள் வழக்கமாக அதே வழியில் செல்லும்: பின்தொடர்பவர் என்னுடன் அமர்ந்து, பயன்பாட்டை நிறுவவும் பயன்படுத்தவும் மந்திர செயல்களைச் செய்கிறார். முன்-இறுதி டெவலப்பர்களுக்கு டோக்கர் இன்றியமையாதது ஏனெனில்... பின்தளமானது பெரும்பாலும் PHP/Java/Python/C# அடுக்குகளின் பரந்த அளவில் எழுதப்படுகிறது, மேலும் எல்லாவற்றையும் நிறுவி வரிசைப்படுத்த முன்பக்கம் ஒவ்வொரு முறையும் பின்தளத்தை திசை திருப்ப வேண்டியதில்லை. ஒரு இடத்தில் மட்டுமே நான் ஒரு வெளிப்படையான வரிசைப்படுத்தல், பதிவுகள் மற்றும் தானியங்கு சோதனைகள் கொண்ட Docker-Jenkins கலவையைப் பார்த்தேன்.

டோக்கரைப் பற்றி பல விரிவான கட்டுரைகள் எழுதப்பட்டுள்ளன. VueJS/Vue Router ஐப் பயன்படுத்தி ஒரு ஒற்றைப் பக்க பயன்பாட்டைப் பயன்படுத்துவதைப் பற்றி இந்தக் கட்டுரை பேசும், சேவையகப் பகுதி NodeJS உடன் RESTful API வடிவில் உள்ளது, மேலும் MongoDB தரவுத்தளமாகப் பயன்படுத்தப்படுகிறது. பல கண்டெய்னர் பயன்பாடுகளை வரையறுக்கவும் இயக்கவும் டோக்கர் கம்போஸ் பயன்படுத்தப்படுகிறது.

ஏன் டோக்கர் தேவை

டோக்கர் பயன்பாட்டைப் பயன்படுத்துவதற்கான செயல்முறையை தானியங்குபடுத்த உங்களை அனுமதிக்கிறது. டெவலப்பர் இனி சொந்தமாக நிரல்களை நிறுவவோ அல்லது அவரது கணினியில் பதிப்பு இணக்கமின்மையை சமாளிக்கவோ தேவையில்லை. நீங்கள் செய்ய வேண்டியது டோக்கரை நிறுவி 1-2 கட்டளைகளை கன்சோலில் தட்டச்சு செய்யவும். இதைச் செய்வதற்கான மிகவும் வசதியான வழி லினக்ஸில் உள்ளது.

தொடங்குதல்

நிறுவு கூலியாள் மற்றும் டோக்கர் இசையமைத்தார்

கோப்புறை அமைப்பு

கிளையன்ட் மற்றும் சர்வர் பயன்பாடுகளுக்காக 2 கோப்புறைகளை உருவாக்குகிறோம். .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

நாங்கள் டோக்கரில் 3 சேவைகளை உருவாக்குகிறோம்: NodeJS, MongoDB மற்றும் Vue இல் நிலையான சேவைகளுக்கு. கிளையண்டை சர்வருடன் இணைக்க சேர்க்கப்பட்டது சேவையகத்தைப் பொறுத்தது. மோங்கோடிபியை சர்வர் ஏபிஐயுடன் இணைக்க, பயன்படுத்தவும் இணைப்புகள் மோங்கோ. சர்வர், கிளையன்ட், மோங்கோ - சேவைகளின் பெயர்கள்.

VueJS கிளையன்ட்

கோப்புறையில் /வாடிக்கையாளர் பயன்பாடு VueJS ஐ அடிப்படையாகக் கொண்டது. பயன்பாடு பயன்படுத்தி உருவாக்கப்பட்டது Vue Cli. ஒரு படத்தை உருவாக்கும்போது, ​​கிளையன்ட் பயன்பாடு கோப்புறையில் நிலையான கோப்புகளின் தொகுப்பில் கட்டமைக்கப்படுகிறது / மாவட்டம். ஒரு படத்தை உருவாக்குவதற்கான கட்டளைகளின் தொகுப்பை Dockerfile விவரிக்கிறது:

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. இந்த கட்டளை pack.json இல் விவரிக்கப்பட்டுள்ளது:


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

கோப்புறையிலிருந்து கோப்புகளை இயக்க / மாவட்டம், உலகளவில் நிறுவப்பட்டது http-server, மற்றும் dev-சார்புகளில் தொகுப்பு spa-http-serverஅதனால் Vue ரூட்டர் சரியாக வேலை செய்கிறது. --புஷ்-ஸ்டேட் கொடி index.html க்கு திருப்பி விடப்படுகிறது. 1 வினாடி மதிப்பு கொண்ட -c கொடி சேர்க்கப்பட்டது http-சேவையகம் ஸ்கிரிப்ட்களை கேச் செய்யவில்லை. இது ஒரு சோதனை உதாரணம்; உண்மையான திட்டத்தில் nginx ஐப் பயன்படுத்துவது நல்லது.

Vuex கடையில் நாம் ஒரு புலத்தை உருவாக்குகிறோம் apiHost: 'http://localhost:3000', NodeJS Api போர்ட் பதிவு செய்யப்பட்டுள்ளது. கிளையன்ட் பகுதி தயாராக உள்ளது. இப்போது கிளையண்டிலிருந்து பின்பக்கத்திற்கான அனைத்து கோரிக்கைகளும் இந்த url க்கு செல்கின்றன.

NodeJS சர்வர் API

கோப்புறையில் /server உருவாக்க server.js மற்றும் Dockerfile:


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

В server.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

கருத்தைச் சேர்