こんにちは。小川智也です。
本日夏休み毎日投稿 Day8は前回からスタートした家庭内稟議・精算アプリ「Ringee(リンギー)」の開発として、Dockerでの開発環境構築とトップページ＆ロゴ制作を行っていきたいと思います。
この記事は夏休み毎日投稿2025として執筆されたものです。
夏休み毎日投稿2025のすべての記事は下記から閲覧いただけます。
小川智也と申します。Webプログラマーな中学2年生です。
このブログでは主にITやガジェット系の情報を発信しています！
▼ おすすめリンク ▼
【 X(旧Twitter)・いえPay・個人事業主・ITパスポート・お問い合わせ 】
Dockerでの開発環境の構築
ということでまず初めに、開発を楽に進めるにあたってDockerを用いた開発環境を構築していこうと思います。
今回はdocker composeで下記のコンテナを立てていきます。
- Webサーバー PHP&Apache(php:8.3-apache)
- データベース MariaDB(mariadb:10.11)
- DB管理 phpmyadmin(phpmyadmin/phpmyadmin)
あとで痛い目を見そうなので先にphp.iniでタイムゾーンを日本に合わせて、mbstringもいい感じにしておきます。（1敗）
無事に環境を構築することが出来ました。Dockerfileでmysqliも入れてあるのでちゃんとDBへの接続もできます。
Docker便利すぎ🐋
トップページ制作
次に一番手を付けやすそうなトップページを制作していきます。
今回はクラウド型で公開するアプリケーションなので、よくあるWebサービスみたいな紹介ページを作っていきます。
フォントにZen Maru Gothicを入れてみたらめちゃくちゃおしゃれになった（気がする）
夕方から作業したせいで中身は全く出来ていませんが許してください。そのうち作る（作らない）
ロゴ制作
お次に、今後のやる気を上げるためにもサクッとロゴを作っていきます。諸々合わせて1時間かかったんですけどね。
フォントにはJostという某F○turaフォントに似ている無料のものを使っていきます。
eの上にある ^ を反対にしたみたいなやつは、金融関連のサービスだからお金っぽい要素を入れたいなーと数十秒悩んだ末に円マーク (￥)の上をいい感じに入れてみることにしました。
当初はお金っぽく赤色ではなく黄色にしようと考えていましたが、視認性がクッッソ悪かったのでオレンジ寄りにズラしていったらいつのまにか赤色になってました。
ミニトマトに見えてきた...
まとめ
いかがだったでしょうか。本日は夏休み毎日投稿 Day8ということで開発環境構築＋ちょい制作をしてみました。
これからも継続して作っていくのでご期待ください！
最後まで見ていただき、ありがとうございました。
この記事がいいと思った方はぜひ他の記事も見ていってください！
X(旧Twitter)のフォローもよろしくお願いします！
