Docker / ES2015 sandbox 2018.8.3 Hamamatsu.js #4 @jacoyutorius ͱΓ͋͑ͣDockerͰWebαʔόʔΛཱͯͯjsΛॻ͍ͯΈΔ 

Yuto Ogi FOURIER.Inc Ruby, Rails, Javascript, Vue.js, AWS Hamamatsu.rb JAWS-UG Hamamatsu @jacoyutoirus 

Contents ES2015ͷ৽ػೳΛࢼ͢؀ڥΛDockerͰ࡞Δ 

Contents Docker v18.06 / Kitematic Editor 

Purpose खܰʹWebαʔόʔΛཱ͍ͯͨ ϩʔΧϧʹΠϯετʔϧͨ͠Webαʔόʔ͸ઃఆมߋ͕໘౗ Ծ૝Ϛγϯ͸ىಈ͕஗͍ ͦΖͦΖDocker͍ͬͱ͔͘ɾɾɾ .htmlϑΝΠϧΛ௚ʹ։͘ͱCORSͷ੍ݶʹҾ͔͔ͬΔ 

Dockerfile FROM nginx MAINTAINER jacoyutorius USER root RUN apt-get update 

docker-compose ෳ਺ͷ%PDLFSΠϝʔδΛҰׅ؅ཧͰ͖Δɻ 

docker-compose version: "3" services: webserver: build: context: "./" image: nginx ports: - "5000:80" 

docker-compose up $ docker-compose up Creating network "hmjs4_default" with the default driver Creating hmjs4_webserver_1 ... done Attaching to hmjs4_webserver_1 webserver_1 | 172.22.0.1 - - [02/Aug/2018:14:01:33 +0000] "GET / HTTP/1.1" 200 612 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Kitematic/0.13.0 Chrome/ 45.0.2454.85 Electron/0.35.4 Safari/537.36" "-" webserver_1 | 172.22.0.1 - - [02/Aug/2018:14:01:34 +0000] "GET / HTTP/1.1" 200 612 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/ 537.36" "-" webserver_1 | 2018/08/02 14:01:35 [error] 8#8: *2 open() "/usr/share/nginx/html/favicon.ico" failed (2: No such file or directory), client: 172.22.0.1, server: localhost, request: "GET /favicon.ico HTTP/1.1", host: "localhost: 5500", referrer: "http://localhost:5500/" webserver_1 | 172.22.0.1 - - [02/Aug/2018:14:01:35 +0000] "GET /favicon.ico HTTP/1.1" 404 571 "http:// localhost:5500/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36" "-" 

Kitematic 

localhost:5000 

docker-compose up -d %BFNPOϞʔυɻόοΫάϥ΢ϯυͰ%PDLFS͕ىಈ͢Δɻ 

docker-compose exec EPDLFSDPNQPTF
FYFD
XFCTFSWFS
CJOCBTI ·ͨ͸ɺ 

html/index.html

Hello!



docker-compose up version: "3" services: webserver: build: context: "./" image: nginx volumes: - “./html:/usr/share/nginx/html” ports: - "5000:80" 

localhost:5000 

html/js/script.js window.onload = () => { const p = document.createElement("p") p.innerText = "How are you?" document.body.appendChild(p) } 

html/index.html

Hello!



localhost:5000 

html/js/modules/greet.js export default (name) => { return `How are you? ${name}` } 

html/js/script.js import greet from “/js/libs/greet.js" window.onload = () => { const p = document.createElement("p") p.innerText = greet("yuto") document.body.appendChild(p) } 

localhost:5000 

tree . ᵓᴷᴷ Dockerfile ᵓᴷᴷ docker-compose.yml ᵋᴷᴷ html ᵓᴷᴷ index.html ᵋᴷᴷ js ᵓᴷᴷ libs ᴹ ᵋᴷᴷ greet.js ᵋᴷᴷ script.js 

ES2015 Arrow Function String literal module 

end Arrow Function String literal module