Merge pull request #188 from dummyeuy/dockerize-vuejs-app

Translate src/v2/cookbook/**dockerize-vuejs-app.md** by dummyeuy

Author: mandaputtra

src/v2/cookbook/dockerize-vuejs-app.md

@@ -1,134 +1,135 @@
 ---
-title: Dockerize Vue.js App
+title: Dockerize Aplikasi Vue.js App
 type: cookbook
 order: 13
 ---
+<!-- docs/hooks-faq.md ini diterjemahkan oleh dummyeuy (Muhammad Ghalib) -->
 
-## Simple Example
+## Contoh Sederhana
 
-So you built your first Vue.js app using the amazing [Vue.js webpack template](https://github.com/vuejs-templates/webpack) and now you really want to show off with your colleagues by demonstrating that you can also run it in a Docker container.
+Jadi, Anda membangun aplikasi Vue.js pertama Anda menggunakan [templat *webpack* Vue.js](https://github.com/vuejs-templates/webpack) yang menakjubkan dan kini sangat ingin menunjukkannya pada teman-teman Anda dengan sebuah mendemonstrasi yang mana bisa Anda jalankan juga pada sebuah wadah *Docker*.
 
-Let's start by creating a `Dockerfile` in the root folder of our project:
+Mari mulai dengan membuat sebuah`Dockerfile` di folder dasar proyek kita:
 
 ```docker
 FROM node:lts-alpine
 
-# install simple http server for serving static content
+# pasang (install) server http sederhana untuk menjalankan static content
 RUN npm install -g http-server
 
-# make the 'app' folder the current working directory
+# buat folder 'app' pada direktori yang sedang dikerjakan
 WORKDIR /app
 
-# copy both 'package.json' and 'package-lock.json' (if available)
+# salin 'package.json' dan 'package-lock.json' (jika ada)
 COPY package*.json ./
 
-# install project dependencies
+# pasang dependecy proyek
 RUN npm install
 
-# copy project files and folders to the current working directory (i.e. 'app' folder)
+# salin berkas-berkas proyek serta folder-foldernya ke direktori yang sedang dikerjakan (misal. folder 'app)
 COPY . .
 
-# build app for production with minification
+# bangun aplikasi untuk produksi dengan minifikasi
 RUN npm run build
 
 EXPOSE 8080
 CMD [ "http-server", "dist" ]
 ```
 
-It may seem reduntant to first copy `package.json` and `package-lock.json` and then all project files and folders in two separate steps but there is actually [a very good reason for that](http://bitjudo.com/blog/2014/03/13/building-efficient-dockerfiles-node-dot-js/) (spoiler: it allows us to take advantage of cached Docker layers).
+Awalnya mungkin terlihat berlebihan untuk menyalin `package.json` dan `package-lock.json` serta seluruh berkas proyek dalam dua langkah terpisah, tetapi sebenarnya ada sebuah[alasan baik di baliknya](http://bitjudo.com/blog/2014/03/13/building-efficient-dockerfiles-node-dot-js/) (*spoiler*: hal tersebut mengizinkan kita untuk memanfaatkan lapisan-lapisan Docker dengan *cache*).
 
-Now let's build the Docker image of our Vue.js app:
+Sekarang ayo buat tampilan *Docker* untuk aplikasi Vue.js kita:
 
 ```bash
 docker build -t vuejs-cookbook/dockerize-vuejs-app .
 ```
 
-Finally, let's run our Vue.js app in a Docker container:
+Akhirnya, saatnya jalankan aplikasi Vue.js kita di sebuah wadah *Docker*:
 
 ```bash
 docker run -it -p 8080:8080 --rm --name dockerize-vuejs-app-1 vuejs-cookbook/dockerize-vuejs-app
 ```
 
-We should be able to access our Vue.js app on `localhost:8080`.
+Kita seharusnya dapat mengakses aplikasi Vue.js kita di `localhost:8080`.
 
-## Real-World Example
+## Contoh Dunia Nyata
 
-In the previous example, we used a simple, zero-configuration command-line [http server](https://github.com/indexzero/http-server) to serve our Vue.js app which is perfectly ok for quick prototyping and _may_ even be ok for simple production scenarios. After all, the documentation says:
+Pada contoh sebelumnya, kita menggunakan sebuah *command-line* [http server](https://github.com/indexzero/http-server) yang sederhana dan tanpa konfigurasi tertentu untuk menjalankan aplikasi Vue.js kita - yang mana sangat cocok untuk *prototyping* cepat dan _bisa jadi_ baik untuk skenario produksi-produksi sederhana. Lagipula, dokumentasinya mengatakan demikian:
 
-> It is powerful enough for production usage, but it's simple and hackable enough to be used for testing, local development, and learning.
+> Hal tersebut cukup baik untuk penggunaan dalam hal produksi, tapi juga cukup sederhana dan mudah diretas untuk pengujian, pengembangan lokal, serta pembelajaran.
 
-Nevertheless, for realistically complex production use cases, it may be wiser to stand on the shoulders of some giant like [NGINX](https://www.nginx.com/) or [Apache](https://httpd.apache.org/) and that is exactly what we are going to do next: we are about to leverage NGINX to serve our Vue.js app because it is considered to be one of the most performant and battle-tested solutions out there.
+Meskipun demikian, untuk kasus-kasus produksi yang kompleks secara nyata, akan lebih bijak untuk mengandalkan beberapa nama besar seperti [*NGINX*](https://www.nginx.com/) atau [*Apache*](https://httpd.apache.org/) dan itulah hal yang akan kita lakukan selanjutnya: kita akan  we are about memanfaatkan *NGINX* untuk menjalankan aplikasi Vue.js kita karena hal tersebut dipertimbangkan sebagai salah satu solusi dan pihak yang telah teruji dengan sangat baik.
 
-Let's refactor our `Dockerfile` to use NGINX:
+Mari me-*refactor* `Dockerfile` kita untuk menggunakan *NGINX*:
 
  ```docker
-# build stage
+# tahap pengembangan
 FROM node:lts-alpine as build-stage
 WORKDIR /app
 COPY package*.json ./
 RUN npm install
 COPY . .
 RUN npm run build
 
-# production stage
+# tahap produksi
 FROM nginx:stable-alpine as production-stage
 COPY --from=build-stage /app/dist /usr/share/nginx/html
 EXPOSE 80
 CMD ["nginx", "-g", "daemon off;"]
 ```
 
-Ok, let's see what's going on here:
-* we have split our original `Dockerfile` in multiple stages by leveraging the Docker [multi-stage builds](https://docs.docker.com/develop/develop-images/multistage-build/) feature;
-* the first stage is responsible for building a production-ready artifact of our Vue.js app;
-* the second stage is responsible for serving such artifact using NGINX.
+Baik, mari kita lihat apa yang terjadi kini:
+* kita sudah memisahkan `Dockerfile` asli milik kita ke dalam beberapa tahapan dengan memanfaatkan fitur [pengembangan *multi-stage*](https://docs.docker.com/develop/develop-images/multistage-build/) Docker;
+* tahap pertama bertujuan untuk mengembangkan sebuah *artefak* yang siap prduksi dari aplikasi Vue.js kita;
+* tahap kedua bertujuan untuk menjalankan *artefak* tersebut mengguankan *NGINX*.
 
-Now let's build the Docker image of our Vue.js app:
+Kini ayo bangun tampilan *Docker* dari aplikasi Vue.js kita:
 
 ```bash
 docker build -t vuejs-cookbook/dockerize-vuejs-app .
 ```
 
-Finally, let's run our Vue.js app in a Docker container:
+Pada akhirnya, jalankan aplikasi Vue.js kita dalam wadah *Docker*:
 
 ```bash
 docker run -it -p 8080:80 --rm --name dockerize-vuejs-app-1 vuejs-cookbook/dockerize-vuejs-app
 ```
 
-We should be able to access our Vue.js app on `localhost:8080`.
+Kita seharusnya bisa mengakses aplikasi Vue.js kita di `localhost:8080`.
 
-## Additional Context
+## Konteks Tambahan
 
-If you are reading this cookbook, chances are you already know why you decided to dockerize your Vue.js app. But if you simply landed on this page after hitting the Google's `I'm feeling lucky` button, let me share with you a couple of good reasons for doing that.
+Jika Anda membaca *cookbook* ini, ada kemungkinan Anda sudah tahu alasan mengapa Anda memilih untuk men-*dockerize* aplikasi Vue.js Anda. Tetapi jika Anda hanya tiba di laman ini tanpa alasan spesifik seperti di atas, izinkan kami bagikan pada Anda beberapa alasan baik mengapa membaca *cookbook* ini bermanfaat.
 
-Today's modern trend is to build applications using the [Cloud-Native](https://pivotal.io/cloud-native) approach which revolves mainly around the following buzzwords:
-* Microservices
-* DevOps
-* Continuous Delivery
+Tren modern kini adalah membangun aplikasi menggunakan pendekatan [*Cloud-Native*](https://pivotal.io/cloud-native) yang mana merevolusi terutama pada hal-hal berikut:
+* *Microservice*
+* *DevOps* (*Development and Operations*/ Pengembangan dan Operasi)
+* *Delivery* secara kontinyu
 
-Let's see how these concepts actually affect our decision of dockerizing our Vue.js app.
+Mari lihat bagaimana konsep-konsep ini sebenarnya mempengaruhi keputusan kita dalam hal proses *dockerize* aplikasi Vue.js kita.
 
-### Effects of Microservices
+### Efek *Microservice*
 
-By adopting the [microservices architectural style](https://martinfowler.com/microservices/), we end up building a single application as a suite of small services, each running in its own process and communicating with lightweight mechanisms. These services are built around business capabilities and independently deployable by fully automated deployment machinery.
+Dengan mengadopsi [gaya arsitektural *microservice*](https://martinfowler.com/microservices/), kita berakhir pada membangun sebuah aplikasi tunggal sebagai sebuah rangkaian layanan-layanan (*service*) kecil, tiap layanannya berjalan pada prosesnya sendiri dan berkomunikasi dengan mekanisme yang ringan. Layanan ini dibangun di sekitar kapabilitas bisnis dan secara independen dapat diluncurkan oleh mesin peluncuran (*deployment*) yang sepenuhnya otomatis.
 
-So, committing to this architectural approach most of the time implies developing and delivering our front-end as an independent service.
+Jadi, memutuskan untuk menerapkan pendekatan arsitektural ini sering kali berdampak pada pengembangan dan peluncuran *front-end* kita sebagai sebuah layanan yang independen.
 
-### Effects of DevOps
+### Efek *DevOps*
 
-The adoption of [DevOps](https://martinfowler.com/bliki/DevOpsCulture.html) culture, tools and agile engineering practices has, among other things, the nice effect of increasing the collaboration between the roles of development and operations. One of the main problem of the past (but also today in some realities) is that the dev team tended to be uninterested in the operation and maintenance of a system once it was handed over to the ops team, while the latter tended to be not really aware of the system's business goals and, therefore, reluctant in satisfying the operational needs of the system (also referred to as "whims of developers").
+Mengadopsi kultur [*DevOps*](https://martinfowler.com/bliki/DevOpsCulture.html), perlengkapan serta praktik-praktik teknis yang tangkas (*agile*), di antara hal lain, telah memiliki dampak baik pada meningkatnya kolaborasi antara peran-peran dalam pengembangan dan operasi (*development and operations*). Masalah utama di masa lalu (tapi juga hingga hari ini pada beberapa kasus) adalah tim pengembang cenderung tidak tertarik dalam hal operasi dan pemeliharaan (*maintenance*) sistem selepas produk sudah dipindahtangankan pada tim operasi, ketika tim yang terakhir cenderung tidak begitu sadar akan tujuan bisnis sistem ini serta, oleh karenanya, dengan berat hati berusaha memuaskan kebutuhan operasional sistem (juga disebut-sebut sebagai "ke-pengecut-an pengembang").
 
-So, delivering our Vue.js app as a Docker image helps reducing, if not removing entirely, the difference between running the service on a developer's laptop, the production environment or any environment we may think of.
+Jadi, menyerahkan aplikasi Vue.js sebagai sebuah tampilan Docker membantu mengurangi -jika tidak menghilangkan seluruhnya- perbedaan antara menjalankan layanan di laptop pengembang, lingkungan pengembangan atau lingkungan apapun yang kita pikirkan.
 
-### Effects of Continuous Delivery
+### Efek *Delivery* secara Kontinyu
 
-By leveraging the [Continuous Delivery](https://martinfowler.com/bliki/ContinuousDelivery.html) discipline we build our software in a way that it can potentially be released to production at any time. Such engineering practice is enabled by means of what is normally called [continuous delivery pipeline](https://martinfowler.com/bliki/DeploymentPipeline.html). The purpose of a continuous delivery pipeline is to split our build into stages (e.g. compilation, unit tests, integration tests, performance tests, etc.) and let each stage verify our build artifact whenever our software changes. Ultimately, each stage increases our confidence in the production readiness of our build artifact and, therefore, reduces the risk of breaking things in production (or any other environment for that matters).
+Dengan memanfaatkan [*delivery* secara kontinyu](https://martinfowler.com/bliki/ContinuousDelivery.html) secara teratur kita membangun perangkat lunak dengan cara yng mana bisa dirilis kapan pun secara potensial. Praktik teknis demikian diperbolehkan agar [*delivery pipeline* berjalan secara kontinyu](https://martinfowler.com/bliki/DeploymentPipeline.html). Tujuan *delivery pipeline* secara kontinyu ini untuk membagi pengembangan menjadi beberapa tahap (misal, kompilasi, uji unit, uji integrasi, uji performa, dsb.) dan memperbolehkan tiap tahap memverifikasi artefak pengembangan kita kapanpun perangkat lunak kita berubah. Pada akhirnya, tiap tahap meningkatkan kepercayaan diri kita dalam hal kesiapan produksi pada artifak yang kita kembangkan, oleh karenanya, mengurangi resiko rusaknya beberapa hal dalam tahapan produksi (atau lingkungan lain yang penting).
 
-So, creating a Docker image for our Vue.js app is a good choice here because that would represent our final build artifact, the same artifact that would be verified against our continuous delivery pipeline and that could potentially be released to production with confidence.
+Jadi, membuat tampilan *Docker* aplikasi Vue.js adalah pilihan yang baik di sini karena hal tersebut akan merepresentasikan hasil akhir pengembangan artefak kita, barang yang sama yang akan diverifikasi dengan *delivery pipeline* kotinyu kita serta secara potensial dapat dirilis ke tahap produksi dengan yakin.
 
-## Alternative Patterns
+## Pola-pola Alternatif
 
-If your company is not into Docker and Kubernetes just yet or you simply want to get your MVP out the door, maybe dockerizing your Vue.js app is not what you need.
+Jika perusahaan Anda sekarang belum mengadopsi *Docker* dan/atau *Kubernetes* atau Anda hanya ingin meningkatkan kapabilitas diri Anda jadi yang terbaik, mungkin saja me-*dockerize* aplikasi Vue.js bukanlah hal yang Anda butuhkan.
 
-Common alternatives are:
-* leveraging an all-in-one platform like [Netlify](https://www.netlify.com/);
-* hosting your SPA on [Amazon S3](https://aws.amazon.com/s3/) and serving it with [Amazon CloudFront](https://aws.amazon.com/cloudfront/) (see [this](https://serverless-stack.com/chapters/deploy-the-frontend.html) link for a detailed guide).
+Alternatif-alternatif umum lainnya:
+* memanfaatkan sebuah *platform* yang *all-in-one* seperti [*Netlify*](https://www.netlify.com/);
+* men-*hosting* *SPA* Anda di [*Amazon S3*](https://aws.amazon.com/s3/) dan menjalankannya dengan [*Amazon CloudFront*](https://aws.amazon.com/cloudfront/) (lihat [tautan ini](https://serverless-stack.com/chapters/deploy-the-frontend.html) untuk penduan lebih rinci).