Elm でフーリエ級数展開やライフゲームを制作したので CI/CD を試してみました。 この記事では Elm で作ったものを GitLab CI/CD を使って GitLab Pages に deploy する方法を紹介します。
コードを書く
$ elm init
$ vim src/Main.elm
今回はsrc/Main.elm
を変換して公開します。
git 管理する
GitLab のアカウントを持ってない人はアカウントを作ってください。
$ git init
$ gibo dump elm > .gitignore
$ git add elm.json src/Main.elm .gitignore
$ git commit -m "first commit"
$ git remote add origin git@gitlab.com:<username>/<reponame>.git
$ git push --set-upstream origin master
- gibo は.gitignore を自動生成するコマンドです。(参考)
.gitlab-ci.yml を作成
$ vim .gitlab-ci.yml
以下を.gitlab-ci.yml にコピペする
image: node:alpine
pages:
cache:
paths:
- node_modules/
stage: deploy
script:
- npm install -g --unsafe-perm elm
- elm make src/Main.elm --optimize --output=public/index.html
artifacts:
paths:
- public
only:
- master
あとは
$ git add .gitlab-ci.yml
$ git commit -m "add .gitlab-ci.yml"
$ git push
src/Main.elm
の内容がindex.html
に変換され、
https://<username>.gitlab.com/<reponame>/
に公開されます。
- 公開されるまで少し時間がかかります。(10 分ぐらい?)
以降は master に commit して push するだけで自動で GitLab Pages に deploy されます。
感想
- シェルスクリプト書いてやってたことがサーバー側のコンテナでできるのは便利。
- テストを書きながら開発するのも Elm で試したい。
- Elm はアーキテクチャが決まってるから経験がなくても書きやすい。
- Haskell から難しさを取り除きつつ、Haskell の書きやすさを残したいい感じの言語だと思った。
参考サイト
- Elm の公式ガイド: An Introduction to Elm
- Elm の公式ガイド(和訳): Elm について (はじめに)
- この記事の元ネタ: How to run an elm project from gitlab?