Phoenix公式ページのデザインが刷新！変化した点を徹底解説

**Phoenix公式ページが刷新され、さらに進化！**
デザインだけでなく、Hello World的なアプリ作成手順の追加も行われました。これにより、初心者から上級者まで、よりアクセスしやすく、学びやすい内容になっています。本記事では、その変化の詳細を徹底解説していきます！

# はじめに

皆さん、最新のPhoenix公式ページをご覧になりましたか？

[Elixir](https://elixir-lang.org/)のWebアプリケーションフレームワークのデファクトスタンダードである[Phoenix](https://www.phoenixframework.org/)の公式ページの見た目ががらっと様変わりしていました。
それと、Hello World的なPhoenixアプリを作る手順が追加されていました。

この2つを書きます。

# Phoenixの公式ページの見た目ががらっと様変わり

私は、2024-12-14気づきました。

![スクリーンショット 2024-12-14 17.10.30.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/131808/09ba763c-b2fe-7581-c1f3-bed76d8510a1.png)

いつから変わったのだろう？

たぶん、トップページは[phoenixframework/phoenix](https://github.com/phoenixframework/phoenix)リポジトリでは管理されていないようです。
情報をお持ちの方はぜにひコメント欄にてお便りをお寄せください。

ChatGPT Plus(4o)は次のように言っております。

> 公式サイトのデザイン変更時期を特定するため、ウェブアーカイブサービス「Wayback Machine」を用いて調査しました。その結果、2024年12月上旬にデザインが刷新されたことが確認されました。具体的には、2024年12月1日時点のアーカイブでは旧デザインが表示されており、12月10日時点のアーカイブでは新デザインに切り替わっています。したがって、デザイン変更はこの期間内に行われたと推測されます。なお、公式ブログやGitHubリポジトリには、このデザイン変更に関する公式アナウンスやコミットは見当たりませんでした。そのため、詳細な変更日時や内容については、公式からの発表を待つ必要があるかもしれません。

# Hello World的なPhoenixアプリを作る手順が追加

https://hexdocs.pm/phoenix/up_and_running.html

[Up and Running](https://hexdocs.pm/phoenix/up_and_running.html)ページに、Hello World的なPhoenixアプリを作る手順が追加されていました。

![スクリーンショット 2024-12-14 23.58.43.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/131808/b582c072-498e-294d-846e-f4cab465c577.png)

2024-12-14現在、Phoenixのバージョンは`1.7.18`です。
この手順は、Phoenix 1.7.16 から追加されています。

Commitは[これ](https://github.com/phoenixframework/phoenix/commit/5e62a394670f4800268fde036c8ec39d9dafd5df)です。

Elixirの作者である[José Valim](https://twitter.com/josevalim)さん、ご本人がコミットされています！


## https://new.phoenixframework.org/myapp


```
$ curl https://new.phoenixframework.org/myapp | sh
```

こういう手順って、[Homebrew](https://brew.sh/ja/)のインストールと似ていますよね。

この手順のポイントである
https://new.phoenixframework.org/myapp
をすこしだけ解説します。


https://new.phoenixframework.org/myapp の中身が気になりますよね？
なりませんか？

2024-12-15時点のシェルスクリプトを掲載しておきます。


```bash
#!/bin/sh
#
# To run locally without | sh:
#
#     $ curl -fsS -o myapp_new.sh https://new.phoenixframework.org/myapp
#     $ sh myapp_new.sh
#
# Installs Elixir from Elixir's official isntall.sh script, then runs phx.new.
#
# See latest Elixri install.sh version at:
# https://github.com/elixir-lang/elixir-lang.github.com/blob/main/install.sh

set -eu

echo_heading() {
  echo "\n\033[32m$1\033[0m"
}

main() {
  elixir_version='1.17.3'
  elixir_otp_release='27'
  otp_version='27.1.2'
  root_dir="$HOME/.elixir-install"

  # Install Elixir if needed
  if command -v elixir >/dev/null 2>&1; then
    echo_heading "Elixir is already installed ✓"
  else
    echo_heading "Installing Elixir..."

    if [ ! -d "$root_dir" ]; then
      mkdir -p "$root_dir"
    fi

    curl -fsSo "$root_dir/install.sh" "https://elixir-lang.org/install.sh"

    (
      sh $root_dir/install.sh "elixir@$elixir_version" "otp@$otp_version"
    )
    if [ $? -ne 0 ]; then
      echo "Failed to install elixir"
      exit 1
    fi
    # Export the PATH so the current shell can find 'elixir' and 'mix'
    export PATH=$HOME/.elixir-install/installs/otp/$otp_version/bin:$PATH
    export PATH=$HOME/.elixir-install/installs/elixir/$elixir_version-otp-$elixir_otp_release/bin:$PATH
  fi

  # Use 'mix' to install 'phx_new' archive

  mix_cmd=$(command -v mix)

  if [ -z "$mix_cmd" ]; then
    echo "Error: mix command not found."
    exit 1
  fi

  echo_heading "Installing phx_new archive..."
  mix archive.install hex phx_new --force

  app_name="myapp"

  app_args="$@"

  # Choose db adapter => postgres, mysql, sqlite
  db_option=""

  if command -v psql >/dev/null 2>&1; then
    echo_heading "Postgres is installed. Using Postgres for the Ecto adapter."
    # Do nothing, default is postgres
  elif command -v mysql >/dev/null 2>&1; then
    echo_heading "MySQL is installed. Using Postgres for the Ecto adapter."
    db_option="--database mysql"
  else
    echo_heading "Using SQLite for the Ecto adapter."
    db_option="--database sqlite3"
  fi

  echo_heading "Creating new Phoenix project '$app_name'..."
  mix phx.new "$app_name" $db_option $app_args --install --from-elixir-install

  echo_heading "$app_name created. Starting Phoenix server..."
  cd "$app_name"
  mix setup
  mix phx.server --open
}

main "$@"
```


解説します。

- Elixirがインストールされていなかったらインストールをしています
    - インストールスクリプトは https://elixir-lang.org/install.sh です
        - GitHubのリリースアーティファクトからErlangとElixirをそれぞれのZipをダウンロードして解凍してインストールをしているようです
        - https://github.com/elixir-lang/elixir-lang.github.com/blob/main/install.sh で管理されています
- Phoenixのインストールをしています
- データベースはPostgreSQL、MySQL、SQLiteの順に利用できるデータベースを利用するようになっています



---

# まとめ

Phoenix公式ページの刷新と、Hello World的なアプリ作成手順の追加は、これからPhoenixを始める人にも、すでに活用している人にも大きなチャンスを提供しています。特に以下のアクションを試してみることで、Phoenixの進化をプロジェクトや学びに活用できるはずです。

1. **公式手順でPhoenixアプリを構築してみる**  
   [Up and Running](https://hexdocs.pm/phoenix/up_and_running.html)に掲載されている手順に従って、簡単なアプリを構築してみましょう。このプロセスを通じて、最新のPhoenixバージョンに触れながら、フレームワークの使い方を理解できます。

2. **公式シェルスクリプトを使ったインストール方法を試す**  
   `curl https://new.phoenixframework.org/myapp | sh` を実行して、公式が提供するスクリプトでのセットアップを体験してください。これにより、インストールプロセスの効率性や新たな仕組みへの理解が深まります。

3. **コミュニティに質問やフィードバックを投稿する**  
   公式ページやGitHubで、今回のデザイン変更や追加機能について質問やフィードバックを送ることで、コミュニティの一員として貢献することができます。他のユーザーとの交流が新たな学びや発見につながるかもしれません。

---
Phoenixはますます**過激**に進化しています。
私もそのスピードについていき、いつかは追い越したいと思います。

猪木さんはこう語りました。

_守りに入るということは、現状維持でよしとすること。現状に満足していたら、いつか停滞期がやってきて、そして衰退につながる。そうならないためにも、常に攻めの姿勢を持ち続けていないといけないのだ。_
（『最後の闘魂（アントニオ猪木）』 プレジデント社）

Phoenixの進化もまた、あなたの一歩から始まります。記事を読んだ今こそ、手を動かし、公式ページの新たな手順や進化を体験してみてください。挑戦を通じて、次のステージへの扉を開きましょう！