【Docker】DockerとGithubを連携させてみる

研究
この記事は約4分で読めます。

この記事は1年前の記事です。当時の情報、理解に基づいておりますのでご留意ください

はじめに

環境はともかくいまどきは必ず通る道なので、食わず嫌いしてないでいま学んでしまいましょう。

前提条件

・Dockerにアカウントがあり、コマンドラインでログインしている。
・Dockerデスクトップをダウンロードしている。
・GithubとDockerアカウントを連携している。

参考サイト

Docker HubとGitHubを連携してリポジトリからDockerイメージを自動ビルドする方法(2020/4/30時点) - delhi09の勉強日記
Docker HubにはGitHubのリポジトリからDockerfileを取得してイメージのビルド・タグ付けを自動で行ってくれる機能が存在する。 docs.docker.comGitHubにDockerfileを上げているのであれば、この方が逐一ローカルでイメージをビルドしてpushするよりも断然楽なので、方法について...

試してみましょう

Docker DesktopにサインインしているとタスクバーのDockerメニューからRepositoriesを参照

試しにView Allしてみます。No Repositoryですね。

Create…してみます。

ここから紐付けが分からなかったんですが…

なるほど、ここにpushしろというコマンドがいただけます。

って、この手順だけだとDockerにしかリポジトリはできません。

この画面下部でgithub側の紐付けをしないとなりませんです。
紐付け先のリポジトリは先に用意しておかないとプルダウンに出てきてくれません。
あと参考サイトを参照し、ビルドルールを設定します。

丸コピ。

さてここでまた大前提を読み飛ばしたw

Docker Hubでイメージを公開したいDockerfileが存在するリポジトリを作成しておく。

https://kamatimaru.hatenablog.com/entry/2020/04/30/184615

私が入り口をDockerHubだと勘違いしてたんですが、要するにGithubにあがったソースコードをDockerHubに引っ張ってきてビルドしてくれるということなんですね。

ということはめんど臭がらずにGithubを使う習慣づけをするんだ。

昨晩の状態のソースコードを転用。

【Docker】DockerにてVue.jsのhello worldまでを試行してみる
はじめにまとまった時間がなかなか取れず勉強できなかったDockerを勉強する。前提条件・Dockerにアカウントがあり、コマンドラインでログインしている。・Dockerデスクトップをダウンロードしている。試...

言いつつ、後からGitHubにコードを配置したので、参考サイト通りならばビルドが通っている筈。

こういうことか。

最後に、いま作ったイメージをpullできるか確認します。

$ docker pull mayatan/vue_js_first
Using default tag: latest
latest: Pulling from mayatan/vue_js_first
e7c96db7181b: Already exists 
96ed4fdcea75: Already exists 
c1504b6f0fcb: Already exists 
16d47b051efb: Already exists 
a969539de418: Pull complete 
afad87ff34d8: Pull complete 
Digest: sha256:9d9c99beca6b4b3d00f1762f74d49a525017ecb5cfb3bdca3d1ec2ebcc9a62e3
Status: Downloaded newer image for mayatan/vue_js_first:latest
docker.io/mayatan/vue_js_first:latest
$ docker images | grep "/vue_js_first"
mayatan/vue_js_first        latest               ddecbf4808e3        15 minutes ago      383MB

できた。
ということは、このDockerFileを使うならdocker-compose.ymlはこうなるのね。

version: '3'
services:
  app:
    image: mayatan/vue_js_first
    build: .
    ports:
      - 9050:9050
    volumes:
      - .:/usr/src/app
    stdin_open: true
    tty: true
    command: /bin/sh

動いた。
あとvue.config.jsの置き場所問題を解決したら、MySQL繋いでなんかやってみる。

ところでなんか亜種っぽいOctocatがあちこちにいると思ったら、公式がOctocatメーカーを作っていたんですね。ハシビロ先輩じゃ肖像権取られそうだからOctocatにするかなw

Build your own octocat
Take a break from your build and create an Octocat that’s all you, from whisker tip to tail.

コメント

タイトルとURLをコピーしました