How to setup a development environment - fetus-hina/stat.ink GitHub Wiki

Set up with Vagrant

See statink/devenv-vagrant

Manual Setup

To simplify the explanation, this setup procedure is not intended for actual operation. If you set up this kind of setup in actual operation, you will encounter security problems.
このセットアップ手順は説明の簡略化のため、実際の運用を前提とはしていません。実運用でこのような設定を行うと、セキュリティ上の問題等が発生します。

Setup a Virtual Machine / 仮想マシンのセットアップ

  1. Install Oracle VM VirtualBox or other virtual machine software.
    Oracle VM VirtualBox またはその他の仮想マシンソフトをインストールします。

  2. Download Minimal ISO (CentOS 7) from CentOS Website.
    Do NOT download CentOS 8/8-Stream. This guide and stat.ink app does not support them yet.
    CentOS ウェブサイトから CentOS 7 の Minimal ISO をダウンロードします。
    CentOS 8/8-Stream はダウンロードしないでください。このガイドや stat.ink アプリは EL 8 環境をサポートしていません。

  3. Run VirtualBox and create new virtual machine.
    VirtualBox を実行し、仮想マシンを作成します。

    • Name/名前: "CentOS 7" or something
    • Type/種類: Linux
    • Version/バージョン: Red Hat (64 bit)
    • Memory/メモリ: 1024 MB
    • Disk/ディスク: Create new VDI/VDIを作成, 15 GB

  4. Start it and "insert" the ISO file you've downloaded.
    作成した仮想マシンを実行し、ダウンロードしたISOファイルを「挿入」します。

  5. Choice "Install CentOS 7"
    "Install CentOS 7" を選択します。

  6. Install CentOS 7 system. (Google for detailed instructions if you need)
    CentOS 7 システムをインストールします（詳細は検索してください。丁寧に解説したページがあります）

(After this step, I recommend you using a terminal-emulator software like PuTTY.)
(このステップの後は、端末エミュレータ、たとえばPuTTYを使用することをおすすめします)

Setup additional packages/追加のパッケージのセットアップ

  1. (Re-)boot the virtual machine and login as root.
    仮想マシンを(再)起動して root としてログインします。

  2. Run following commands to install and update basic packages: (# is a prompt, run as root)
    次のコマンドを実行し、基本的なパッケージをインストール・アップデートします: (# は root で実行することを示すプロンプトです（入力しません）)

    • # yum update -y
    • # yum install -y @base @core epel-release scl-utils
    • # yum-config-manager --enable epel

  3. Setup Remi-safe RPM repository:
    Remi-safe RPM レポジトリを設定します:

    • # yum install -y https://rpms.remirepo.net/enterprise/remi-release-7.rpm
    • # yum-config-manager --enable remi-safe

  4. Setup JP3CKI RPM repository (The repository is maintained by the author, AIZAWA Hina):
    JP3CKI RPM repository を設定します(作者の管理するRPMレポジトリです):

    • # curl -sL https://rpm.fetus.jp/jp3cki.repo -o /etc/yum.repos.d/jp3cki.repo
    • # yum-config-manager --enable jp3cki jp3cki-h2o-rolling

  5. Setup Node.JS RPM repository:
    Node.JS のレポジトリを設定します:

    • # curl -fsL https://rpm.nodesource.com/setup_16.x | bash -

  6. Setup PostgreSQL RPM repository:
    PostgreSQL のレポジトリを設定します:

    • # yum install -y 'https://download.postgresql.org/pub/repos/yum/reporpms/EL-7-x86_64/pgdg-redhat-repo-latest.noarch.rpm'

  7. Install packages:
    パッケージをインストールします:

    • # yum install -y ImageMagick brotli diff gcc-c++ git h2o jpegoptim make nodejs patch php82-php-cli php82-php-fpm php82-php-gd php82-php-intl php82-php-mbstring php82-php-mcrypt php82-php-opcache php82-php-pdo php82-php-pecl-msgpack php82-php-pecl-zip php82-php-pgsql php82-php-process php82-php-sodium php82-php-xml php82-runtime pngcrush postgresql12 postgresql12-server unzip zopfli

  8. Disable SELinux (Not recommended for real server):
    SELinux を無効化します (実運用時にはおすすめしません):

    • # setenforce 0
    • # sed -i -e "s/SELINUX=enforcing/SELINUX=disabled/" /etc/selinux/config

Create and switch user / ユーザの作成と切り替え

  1. Create user: (Skip this step if already created one at install-time.)
    ユーザを作成します: (インストール時に作成している場合はそのまま次に進みます)

    • # useradd statink (statink can be replaced to your name)

  2. Change the permission of your home directory: (Otherwise, H2O web server returns 403 forbidden later.)
    ホームディレクトリのパーミッション（権限）を変更します: （変更しない場合、後々 403 forbidden エラーが発生します）

    • # chmod 701 /home/statink

  3. Switch user to statink:
    statink に切り替えます:

    • # su - statink

      • The prompt will be changed to $.
        プロンプトが $ に変わります。

Setup user's account and the project / ユーザアカウントの設定とプロジェクトの設定

  1. Setup user's environment to use some application:
    いくつかの非標準アプリケーションを使用するために設定を追加します:

    • $ echo 'source scl_source enable php82' >> .bash_profile

  2. Reload user's environment:
    追加の設定を反映するために環境をリロードします:

    • $ source .bash_profile

  3. Test it:
    動作の確認を行います:

    • $ php -v (Should say "PHP 8.2.x (cli)" or something.)
    • $ node -v (Should say "v16.x.x" or something.)
    • $ psql --version (Should say "psql (PostgreSQL) 12.x" or something.)

  4. Clone stat.ink source: stat.ink のソースを clone します:

    • $ git clone https://github.com/fetus-hina/stat.ink.git (Or your repository URL forked / forkしたレポジトリのURLを指定してもかまいません)

  5. Initialize the project:
    プロジェクトの初期設定を行います:

    • $ cd stat.ink
    • $ make init (May take a VERY LONG TIME / とても長い時間がかかります)

  6. Find the initial DB password: (The password is auto-generated in previous step)
    データベースの初期パスワードを確認します: (前のステップでパスワードは自動生成されています)

    • $ cat config/db.php

      • The database configuration will be shown. Find the password and keep it safe.
        パスワードが表示されます。メモしておいてください。

  7. Back to root account:
    root アカウントに戻ります:

    • $ exit

Setup a database / データベースの設定

  1. Initialize DB structure:
    データベース構造の初期化を行います:

    • # PGSETUP_INITDB_OPTIONS="-E UTF-8 --locale=en_US.UTF8 -k" /usr/pgsql-12/bin/postgresql-12-setup initdb

  2. Edit client-authentication settings:
    認証のための設定を行います:

    • # echo 'local all all peer' > /var/lib/pgsql/12/data/pg_hba.conf
    • # echo 'host all all 127.0.0.1/32 md5' >> /var/lib/pgsql/12/data/pg_hba.conf
    • # echo 'host all all ::1/128 md5' >> /var/lib/pgsql/12/data/pg_hba.conf

    Note: First command has > and other commands have >>.
    THIS IS A IMPORTANT THING.
    (First one is overwrite the file. Second one is append to the file.)

    注意: 最初のコマンドは >、それ以降のコマンドは >> になっています。
    これはとても重要な違いです。
    （最初の操作はファイルの上書き、その後の操作は追加を行っています）

  3. Start the db server:
    データベースサーバの起動を行います:

  • # systemctl enable postgresql-12.service
  • # systemctl start postgresql-12.service

  1. Create a DB user ("role"): データベースユーザ(ロール "role" といいます)の作成を行います:

    • # sudo -u postgres createuser -DRSP statink
      • The prompt Enter password for new role: will be displayed. You should input the DB password that memorized previous section.
        Enter password for new role: と表示されたら、メモしたデータベースのパスワードを入力します。

  2. Create a db:
    データベースの作成を行います:

    • # sudo -u postgres createdb -E UTF-8 -l en_US.UTF8 -O statink statink

Setup the project, again / プロジェクトの設定の続き

  1. Switch to the user:
    ユーザを切り替えます:

    • # su - statink

  2. Change "current" directory to project's directory.
    カレントディレクトリを変更します:

    • $ cd stat.ink

  3. Run make command:
    make コマンドを実行します:

    • $ make

  4. DB test: (Update stages information) データベースのテストを行います: (試しに、ステージの情報を取得して更新します)

    • $ ./yii splatoon2-ink/update

Note: This action makes a request to splatoon2.ink (3rd party website/API). Please do not repeat this action.
メモ: このアクションは、splatoon2.ink （第三者の作成したウェブサイト/API）にアクセスします。このアクションを繰り返さないようにしてください。

  1. Back to root user and say "Yay!" root に戻ります。

    • $ exit

Setup PHP (PHP-FPM; FastCGI Process Manager) / PHP (PHP-FPM) の設定

  1. Change directory:
    カレントディレクトリを変更します:

    • # cd /etc/opt/remi/php82/php-fpm.d

  2. Edit the config file: (Replace process owner name, "apache" to "statink" (i.e. your account name))
    設定ファイルを更新します: （プロセス実行者の名前を "apache" から "statink"、つまりあなたのアカウントに変更します）

    • # perl -i -pe 's/^user = apache/user = statink/' www.conf

  3. Start it:
    起動します:

    • # systemctl enable --now php82-php-fpm

  4. Check running:
    動作の確認をします:

    • # ps aux | grep php-fpm

      • Some lines will be displayed, start with "statink(your account name)" and end with "php-fpm: pool www" like statink 13968 0.0 0.6 403688 7116 ? S 04:53 0:00 php-fpm: pool www
        statink(あなたのアカウント名)" で始まり、 "php-fpm: pool www" で終わる行がいくつか表示されるはずです。例: statink 13968 0.0 0.6 403688 7116 ? S 04:53 0:00 php-fpm: pool www

    • # netstat -ln | grep ':9000'

      • A line will be displayed like tcp 0 0 127.0.0.1:9000 0.0.0.0:* LISTEN
        次のような行が表示されるはずです: tcp 0 0 127.0.0.1:9000 0.0.0.0:* LISTEN

Setup H2O web server / H2O ウェブサーバの設定

  1. Copy configuration file from the project:
    設定ファイルをコピーします:

    • # cp -f /home/statink/stat.ink/docker/h2o/h2o.conf /etc/h2o/h2o.conf

  2. Adjust directory name if changed user name: (/home/statink to /home/****(your home directory))
    ユーザ名を変更しているなら設定ファイルの中身を調整します: (/home/statink と記載されているので /home/****、つまりあなたのホームディレクトリに変更します)

    • # perl -i -pe 's#/home/statink#/home/YOUR_ACCOUNT_NAME#g' /etc/h2o/h2o.conf

  3. Start it:
    起動します:

    • # systemctl enable h2o
    • # systemctl start h2o

Test running / 動作テスト

  1. Switch user to statink: (optional, but recommended)
    ユーザを statink に切り替えます: (切り替えなくても動きますが、切り替えることを強くおすすめします)

    • # su - statink

  2. Request to server:
    サーバへリクエストを投げます:

    • $ curl http://127.0.0.1/

      • Raw HTML document will be displayed.
        stat.ink の生の HTML が表示されるはずです。