なんでも無料でできると嬉しい…
私はプログラマーではないのですが、ブログというか自分のサイトを作りたく、アメブロから始まり、notionを使った自作ブログなどいくつか試しています。ただやっぱりかっこいいサイトを初心者が作るとなるとwordpressを使うというのが今の主流な気がします。cssとか触らなくていいのがとても嬉しいというのはnotionブログを作ったときに痛感しました。ただwordpressはレンタルサーバーが必須と聞いていて、有料だと思い込んでいました。そんな中、herokuを使えば無料でできるかも、という話を耳にし、やってみました。類似の記事はみましたが時期が古かったので。自分へのメモと初心者仲間への共有のため記事にします。2022年4月末です、GWの暇つぶしです。
結論としてはできましたが、後で触れる5MBのデータベースでどれくらい記事がかけるのかという将来の不安と、いろいろいじっているとしばしばデータベースとの接続が切れてしまうのでストレスはありますが、無料でできる気持ちよさで私は幸せになれました。notionをデータベースとして使えるといいのだけどまだそうした先人も見つけられないし、私の能力もありません…
前提として
・私はコピペでコードを打つのには抵抗はありませんが、理解はすごく浅いです。
・既存のブログの移管ではなく、新設です。(なので後で触れますがDBの容量が少ないことは一旦問題にしません。)
・自分のサイトを始めたいと書きましたが、継続するかは未定なので拡張性とかは気にしていません。また、続けるか不明なので、無料がいいです。
・初心者といいつつ、gitだとかは使える環境です。
実際に使ったサービス
・wordpress メインとなるサービス、記事書いたりするもの
・heroku ワードプレスを動作させる場所的なイメージ
・cloudinary 画像を保存する場所
Step1:wordpress-herokuのダウンロード
先に結論として、今回の作業を大体やってくれる先人が作ってくださったものがあります。
なのでここからはこちらの方のwikiに説明があります。
まず、wordpressはPHPという言語で動いているそうで、このPHPのパッケージマネージャー?であるcomposerをダウンロードしました。macを使っているので
brew install composer
ここを適当にやったのが後で問題になる気もしますが、この作業で2022年4月現在、Composer version 2.3.5が入ります。上記の先人のものはversion 1.15あたりを想定しているようで後にエラーとの戦いになります。
戦いの結果としてですが、上記先人のgithubのpull requestに2021年時点のものに更新されているものがあり、こちらを使いました。
具体的には適当な自分のPCフォルダにて以下を打ちます。ここからは私はVScodeというアプリ上で操作しています。完全に初心者の方はGitとVScodeをインストールして(詳細略)、自分のPCの書類にwordpressというフォルダを作って、VScodeの「フォルダーを開く」からさっき作ったwordpressというフォルダを開いて、そこで「新しいターミナルを開く」をして以下のコードを打つのかなと思います(ここは想像しただけなので上手くいくかはわかりません)。
git clone https://github.com/ptahdunbar/wordpress-heroku.git
また上記pull requestのやりとりを見ると修正版がmainになっていないようなので、次を打ちました。
git merge develop
次にcomposer.json(要は今回使う動作のために必要な先人の作ったライブラリをまとめたもの?)を修正します。
具体的には2ヶ所
・右側の数字4.0.12になっているかと思いますが変えました
"wpackagist-plugin/all-in-one-seo-pack":"4.2.0"
・以下のプラグインはサービス終了しているようです。おそらく何かあった時にメールを送るためのもの?私は利用シーンが想像できないのでシンプルに削除しました。離れた場所にありますが探して削除。
"wpackagist-plugin/sendgrid-email-delivery-simplified":"1.11.8”
"wpackagist-plugin/sendgrid-email-delivery-simplified"
ついでに画像無料でを扱うためのプラグインも入れていきます。以下でアカウントを作成

プラグインをcomposer.jsonに入れます。
#以下のrequireの中のどこかに
"require": {
〜〜〜
"wpackagist-plugin/cloudinary-image-management-and-manipulation-in-the-cloud-cdn":"3.0.3",
〜〜〜
}
#もう一ヶ所 以下の中にも
"web/app/plugins/{$name}/": [
〜〜〜
"wpackagist-plugin/cloudinary-image-management-and-manipulation-in-the-cloud-cdn"
〜〜〜
]
ここまでしたら上手くいくはずなので、以下を入れて必要なものをインストールします。
composer install
Step2:herokuの設定
まずherokuのアカウントを作ります。(詳細略)できたらログインします。ブラウザ開くので適宜。
heroku login
次にherokuのアプリを作成し、必要なアドオンや環境変数を入れていきます。(#以降はいりません。何をしているかの説明です。)
heroku create 適当なアプリ名 #アプリ作成
heroku config:set \ #環境変数 シークレットはそのままでも動くけど適宜入れ替えるべき
AUTH_KEY='SECRET' \
SECURE_AUTH_KEY='SECRET' \
LOGGED_IN_KEY='SECRET' \
NONCE_KEY='SECRET' \
AUTH_SALT='SECRET' \
SECURE_AUTH_SALT='SECRET' \
LOGGED_IN_SALT='SECRET' \
NONCE_SALT='SECRET'
heroku addons:create jawsdb:kitefin #データベースの作成
Step3:デプロイ
以下のコードを入れます
git push heroku master
そして開いてみると。。
heroku open
以上で以下の画面まで行けると思います。
ここからは案内の通り、wordpressのアカウント作って記事など書いたりするだけです。
Step4:プラグインの有効化
プラグインはデフォルトだとdeacitiveになっているようなのでacitiveにします。
これで完成!ストレスなくとは言えませんが、ブログは作れます。画像はそのまま貼り付けると一時的にしか保存されずに消えてしまうので、cloudinaryのタブにアップロードしてそこからコピーして貼り付けます。(cloudinaryは初回にsign inが必要ですが簡単なので略)
問題点
ひとえにデータベースとの接続がしばしば切れるところ。おそらく1時間に3600クエリ分のやりとりをすると接続が切れる。そうするとブログをいじったりできなくなるし、記事も0件扱いになる。この状況でもブログタイトルとかはみれたりするので、そうした情報はデータベース以外で持っているのかな。よくわからない…
ちなみにpostgreSQLで動かしているものも見つけたけど、半日戦って上手く動かなかった+将来性もなさそうなのでやめておきました…ちなみに参考にしたのはこれ
終わりに
あまり続けられる気がしないが、1日で解決できたので一旦満足。その他wordpressのバージョンを5.7にしたのはarkheというテーマが5.7以上となっていたからでした。
完成品(2023/2 heroku有料になったので閉じました。)
コメント