ut-code · aster-void · Mar 20, 2025 · Mar 20, 2025 · Mar 20, 2025 · Mar 20, 2025
diff --git a/README.md b/README.md
@@ -9,49 +9,39 @@
 
 [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/ut-code/website)
 
-### 手動
+### ローカル
 
 - (必須) Bun >= v1.1.39
 - 任意のエディタ https://docs.astro.build/en/editor-setup/
 
-```shell
+```sh
 bun install --frozen-lockfile
 ```
 
 ## 開発
 
-```shell
+```sh
 bun dev
 ```
 
 <http://localhost:4321/> で開発用サーバーが起動します。
 
 ## ビルド
 
-```shell
+```sh
 bun run build
 ```
 
 ## ディレクトリ構造
 
-- `contents`: 記事のデータです。`/templates` ディレクトリ内のファイルで HTML への変換ルールが定義されます。
-  - `articles`: 記事です。`/articles/サブディレクトリ名` に出力されます。
-  - `members`: メンバーの情報です。現状メンバー専用ページは用意していませんが、記事ページから表示できます。
-  - `projects`: プロジェクトの情報です。`/projects/サブディレクトリ名` に出力されます。
-- `src`
-  - `components`: 共通コンポーネント
-  - `images`: 記事ではなくデザインに用いる画像です。import しない限り出力されません。
-  - `pages`: Gatsby の機能によりファイル名がパスに変換されます。
-  - `styles`: CSS ファイルです。
-  - `templates`: `contents` ディレクトリ内の Markdown ファイルを HTML に変換するルールを定義します。対応関係は `gatsby-node.ts` で定義されています。
-  - `gatsby-types.d.ts`: GraphQL クエリの型情報が入ります。自動生成されます。
-  - `images.d.ts`: TypeScript ファイルから画像ファイルを import できるようにするための型定義ファイルです。
-- `gatsby-{browser,config,node}.ts`: Gatsby の設定ファイルです。
-- `apollo.config.js`: Apollo Language Server が動作するために必要なファイルです。削除してもウェブサイトの動作には影響を与えません。
-- `{postcss,tailwind}.config.js`: Tailwind 用の設定です。
-
-## プルリクエストを出す前に
-
-```shell
-npm run lint && npm run type-check
-```
+- `contents/`: 記事のデータです。Astro の Content Collection を使って `src/pages` から読み込みます。
+- `src/`
+  - `images/`: 記事ではなくデザインに用いる画像です。
+  - `pages/`: Astro の機能によりファイル名がパスに変換されます。
+  - `islands/`: Astro で読み込む Island の集合です。
+  - `content.config.ts`: Astro の Content Collection の設定を書きます。
+  - `global.css`: Tailwind の設定ファイルです。
+- `astro.config.ts`: Astro の設定ファイルです。Vite の設定もここに書きます。
+- `biome.jsonc`: Biome の設定ファイルです。Biome のフォーマット部分は Astro に対応していないので、Lint だけ使っています。対応したら両方 Biome にしましょう。
+- `.prettier{rc,ignore}`: Prettier の設定ファイルです。 Prettier には、 astro と svelte と tailwind のプラグインが入っています。
+- `svelte.config.js`: 最もフィジカルで、最もプリミティブで、そして最もフェティッシュなフレームワークでいかせていただきます。
diff --git a/contents/articles/2019/09-30_2019a-first-lecture/index.mdx b/contents/articles/2019/09-30_2019a-first-lecture/index.mdx
@@ -4,7 +4,7 @@ date: 2019-09-30T23:10:44+09:00
 categories:
   - "info"
 author: tnagaya
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 A セメスターが始まり、本日で一週間となりました。教養学部の皆様は、そろそろ履修が確定している頃ではないでしょうか。

diff --git a/contents/articles/2019/09-30_2019a-schedule/index.mdx b/contents/articles/2019/09-30_2019a-schedule/index.mdx
@@ -4,7 +4,7 @@ date: 2019-09-30T15:52:03+09:00
 categories:
   - "info"
 author: tnagaya
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 ## 開講日程

diff --git a/contents/articles/2019/09-30_syllabus-supports-2019a/index.mdx b/contents/articles/2019/09-30_syllabus-supports-2019a/index.mdx
@@ -4,7 +4,7 @@ date: 2019-09-30T03:55:32+09:00
 categories:
   - "info"
 author: tnagaya
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 本年度 S セメスターでも大変多くの方にご好評をいただいた「[Syllabus by ut.code();](https://syllabus.utcode.net/)」が、A セメスターの授業に対応しました。

diff --git a/contents/articles/2019/10-01_windows-home-to-education/index.mdx b/contents/articles/2019/10-01_windows-home-to-education/index.mdx
@@ -4,7 +4,7 @@ date: 2019-10-01T14:26:13+09:00
 categories:
   - "utokyo"
 author: tnagaya
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 皆さんが購入された Windows マシンに搭載されている OS は、最近であれば Windows 10 Home であることが多いかと思いますが、この Home エディションでは、開発に必須の Hyper-V（仮想化支援機能）が有効化できなくなっています。幸いなことに、東京大学は学生に向け、Windows 10 の最上位エディションと同等の機能が利用できる Education ライセンスを無償で提供しています。この記事では、そちらの利用方法を解説します。

diff --git a/contents/articles/2019/10-03_2019a-first-lecture-record/index.mdx b/contents/articles/2019/10-03_2019a-first-lecture-record/index.mdx
@@ -4,7 +4,7 @@ date: 2019-10-04T03:36:06+09:00
 categories:
   - "events"
 author: tnagaya
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 2019/10/2（水）、2019/10/5（土）に実施された[第一回「エンジニアになろう」講習会](https://utcode.net/2019/info/2019a-first-lecture/)の講義スライドを書き起こした資料です。説明の簡略化のため、一部不正確な書き方をしている部分がありますが、ご了承ください。東京大学の学生が A セメスターで学習することを想定しています。

diff --git a/contents/articles/2019/10-14_lecture-34-announcement/index.mdx b/contents/articles/2019/10-14_lecture-34-announcement/index.mdx
@@ -4,7 +4,7 @@ date: 2019-10-15T02:38:24+09:00
 categories:
   - "info"
 author: tnagaya
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 「エンジニアになろう」講習会第三回・第四回を、以下の日程・場所で開講いたします。

diff --git a/contents/articles/2019/11-03_utcode-lectures-01/index.mdx b/contents/articles/2019/11-03_utcode-lectures-01/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #1"
 date: 2019-11-03T09:29:17+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 ようこそ！ut.code();へ。

diff --git a/contents/articles/2019/11-03_utcode-lectures-02/index.mdx b/contents/articles/2019/11-03_utcode-lectures-02/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #2"
 date: 2019-11-03T09:30:33+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 ## 黒いアイツ

diff --git a/contents/articles/2019/11-03_utcode-lectures-03/index.mdx b/contents/articles/2019/11-03_utcode-lectures-03/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #3"
 date: 2019-11-03T09:30:56+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 今回からお待ちかねプログラミングの時間です！まずはターミナルで

diff --git a/contents/articles/2019/11-03_utcode-lectures-04/index.mdx b/contents/articles/2019/11-03_utcode-lectures-04/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #4"
 date: 2019-11-03T09:31:18+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 今回はデザインです。ある意味 Web 開発の一番楽しいところですね。ある程度までは非常にスムーズに進められるのですが、こだわり始めると途端に面倒になってきます。

diff --git a/contents/articles/2019/11-03_utcode-lectures-05/index.mdx b/contents/articles/2019/11-03_utcode-lectures-05/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #5"
 date: 2019-11-03T09:31:53+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 ## 環境構築

diff --git a/contents/articles/2019/11-03_utcode-lectures-06/index.mdx b/contents/articles/2019/11-03_utcode-lectures-06/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #6"
 date: 2019-11-03T09:32:28+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 ## JavaScript から始めるオブジェクト指向

diff --git a/contents/articles/2019/11-03_utcode-lectures-07/index.mdx b/contents/articles/2019/11-03_utcode-lectures-07/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #7"
 date: 2019-11-03T11:50:11+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 前回の記事はだいぶ抽象的な内容が多く辛かったかと思いますが、今回からはまた具体的な内容に入っていきます。

diff --git a/contents/articles/2019/11-03_utcode-lectures-08/index.mdx b/contents/articles/2019/11-03_utcode-lectures-08/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #8"
 date: 2019-11-03T13:45:01+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 久しぶりに楽しい回です。次回からまた辛い部分になってくるので、気合を入れて頑張りましょう！

diff --git a/contents/articles/2019/11-07_utcode-lectures-09/index.mdx b/contents/articles/2019/11-07_utcode-lectures-09/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #9"
 date: 2019-11-07T16:26:46+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 ## 環境構築

diff --git a/contents/articles/2019/11-10_utcode-lectures-10/index.mdx b/contents/articles/2019/11-10_utcode-lectures-10/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #10"
 date: 2019-11-10T17:34:28+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 ## クライアントがデータを送信する仕組み

diff --git a/contents/articles/2019/12-22_utcode-lectures-12/index.mdx b/contents/articles/2019/12-22_utcode-lectures-12/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #12"
 date: 2019-12-22T09:04:30+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 辛い回が続きます・・・もう少しの辛抱です！

diff --git a/contents/articles/2019/12-23_utcode-lectures-13/index.mdx b/contents/articles/2019/12-23_utcode-lectures-13/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #13"
 date: 2019-12-23T17:25:06+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 今回はフロントエンドに戻ります。ここからは比較的新しい開発手法を取り入れていきます。

diff --git a/contents/articles/2020/02-15_utcode-lectures-14/index.mdx b/contents/articles/2020/02-15_utcode-lectures-14/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #14"
 date: 2020-02-16T00:58:01+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 前回、JavaScript が ECMAScript（ES と略されることが多いです）をベースとしていることを学習しました。ECMAScript は、バージョンが 5 から 6 に上がると同時に、大幅な機能追加が行われました。現代の JavaScript は巨大化・複雑化の一途を辿っていますが、この理由の一端は、ES6 以降に実装された文法機能が劇的に開発効率を上げたことにもあります。この回では、昨今の JavaScript では必須の考え方である不変性（イミュータビリティ）の考え方について学びます。

diff --git a/contents/articles/2020/02-16_utcode-lectures-15/index.mdx b/contents/articles/2020/02-16_utcode-lectures-15/index.mdx
@@ -3,7 +3,7 @@ title: "ut.code(); 学習カリキュラム #15"
 date: 2020-02-16T15:46:31+09:00
 categories:
   - "internal"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 今回は、昨今のフロントエンド開発の人気ライブラリ React を用いて開発する手法を学びます。

diff --git a/contents/articles/2021/09-24_tuk-programming-workshop/index.mdx b/contents/articles/2021/09-24_tuk-programming-workshop/index.mdx
@@ -3,7 +3,7 @@ title: "丁友会 × ut.code(); 合同プログラミング教室開催のお知
 date: 2021-09-25T08:49:44+09:00
 categories:
   - "events"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 ut.code();は、丁友会と合同で、プログラミング教室を開催します。 丁友会は、工学部・工学系研究科の学生の親睦を目的とした団体ですが、このイベントは東京大学・東京大学大学院に所属する学生の方であればどなたでも参加できます。

diff --git a/contents/articles/2021/11-20_kf-utnp-202111/index.mdx b/contents/articles/2021/11-20_kf-utnp-202111/index.mdx
@@ -3,7 +3,7 @@ title: "東京大学新聞 2021年11月号に掲載されました"
 date: 2021-11-20T09:45:13+09:00
 categories:
   - "events"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 ut.code();の第 92 回駒場祭企画「[はじめてのプログラミング教室](https://www.komabasai.net/72/visitor/kikaku/373)」が、2021 年 11 月発行の東京大学新聞 (第 2969 号)に掲載されました。
diff --git a/contents/articles/2021/11-23_komaba-fes-72/index.mdx b/contents/articles/2021/11-23_komaba-fes-72/index.mdx
@@ -3,7 +3,7 @@ title: "第72回駒場祭に参加しました"
 date: 2021-11-23T19:16:32+09:00
 categories:
   - "events"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 第 72 回駒場祭は、オンラインでの開催となりました。

diff --git a/contents/articles/2022/05-09_mf-utnp-202205/index.mdx b/contents/articles/2022/05-09_mf-utnp-202205/index.mdx
@@ -3,7 +3,7 @@ title: "東大新聞オンラインに掲載されました"
 date: 2022-05-09T21:32:19+09:00
 categories:
   - "events"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 ut.code();の第 95 回五月祭企画「[はじめてのプログラミング教室](https://gogatsusai.jp/95/visitor/campus/kikaku/325)」が東大新聞オンラインの【第 95 回五月祭おすすめ企画 7 選】として掲載されました。

diff --git a/contents/articles/2022/11-18_komaba-fes-73/index.mdx b/contents/articles/2022/11-18_komaba-fes-73/index.mdx
@@ -3,7 +3,7 @@ title: 第73回駒場祭に参加しています
 date: 2022-11-18T21:54:48+09:00
 categories:
   - "events"
-image: ../../../../src/images/no-image.svg
+image: +/images/no-image.svg
 ---
 
 ut.code(); は 11 月 18 日（金）〜21 日（日）、3 年ぶりに駒場キャンパスに帰ってきた駒場祭に参加しています。

diff --git a/contents/articles/2023/08-06_-hackathon-invitation/index.mdx b/contents/articles/2023/08-06_-hackathon-invitation/index.mdx
@@ -16,6 +16,6 @@ ut.code(); はこの夏、ハッカソンを開催いたします！
 
 プログラミング初心者の方もキャッチアップいたします！この機会にぜひご参加ください。
 
-参加希望の方は[こちらのフォーム](https://forms.gle/C2MufQXgWpfJ8hZD9)に回答していただき、ut.code();の[Slackに参加](../../join)をお願いいたします。
+参加希望の方は[こちらのフォーム](https://forms.gle/C2MufQXgWpfJ8hZD9)に回答していただき、ut.code();の[Slackに参加](/join)をお願いいたします。
 
-前回のハッカソンの様子は[こちらの記事](../hackathon-202206)をご覧ください。
+前回のハッカソンの様子は[こちらの記事](/articles/2022/06-13_hackathon-202206)をご覧ください。
diff --git a/contents/articles/2023/09-18_a-seminar/index.mdx b/contents/articles/2023/09-18_a-seminar/index.mdx
@@ -6,7 +6,7 @@ categories:
 image: ./image.png
 ---
 
-import ActionButton from "./../../../../src/components/ActionButton.astro";
+import ActionButton from "+/components/ActionButton.astro";
 
 2023年度 A セメスター 、ut.code(); はプログラミングや Web 技術を学び始める人のために、全学自由研究ゼミナール「現代の Web アプリケーションの構築方法の学習と実践」を開催することになりました。
 

diff --git a/contents/articles/2023/12-13_kick-off-party/index.mdx b/contents/articles/2023/12-13_kick-off-party/index.mdx
@@ -6,7 +6,7 @@ categories:
 image: ./image.png
 ---
 
-import ActionButton from "./../../../../src/components/ActionButton.astro";
+import ActionButton from "+/components/ActionButton.astro";
 
 今年も ut.code(); 大忘年会を開催します！
 

diff --git a/contents/articles/2024/03-31_welcome-events/index.mdx b/contents/articles/2024/03-31_welcome-events/index.mdx
@@ -7,7 +7,7 @@ image: ./image.png
 author: ywatahiki
 ---
 
-import ActionButton from "./../../../../src/components/ActionButton.astro";
+import ActionButton from "+/components/ActionButton.astro";
 
 ut.code(); では、2024 年度の新歓活動を以下の通りに実施します。以下の情報は随時更新していきます。
 

diff --git a/contents/articles/2024/04-27_GW-events/index.mdx b/contents/articles/2024/04-27_GW-events/index.mdx
@@ -7,7 +7,7 @@ image: ./image.jpg
 author: hhashimoto
 ---
 
-import ActionButton from "./../../../../src/components/ActionButton.astro";
+import ActionButton from "+/components/ActionButton.astro";
 
 ut.code(); では、新歓体験会に続くイベントとして、GW 講習会を以下の通りに実施します。以下の情報は随時更新していきます。
 

diff --git a/lefthook.yml b/lefthook.yml
@@ -2,8 +2,11 @@ pre-commit:
   parallel: true
   commands:
     check:
-      glob: "*.{js,ts,jsx,tsx,html,svelte,css,md,mdx,astro}"
-      run: bun fix:staged {staged_files}
+      glob: "*.{js,json,ts,jsx,tsx,html,svelte,css,md,mdx,astro}"
+      run: bun check:only
+    fix:
+      glob: "*.{js,json,ts,jsx,tsx,html,svelte,css,md,mdx,astro}"
+      run: bun format:staged {staged_files}
       stage_fixed: true
     sync:
       run: bun sync
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "website",
-  "version": "3.0.0",
+  "version": "3.1.0",
   "private": true,
   "description": "website of ut.code();, version 3",
   "author": "aster-void and others",
@@ -13,9 +13,11 @@
     "prepare": "lefthook install && bun sync",
     "sync": "astro sync",
     "dev": "astro dev",
-    "check": "biome check . && astro check && bun prettier --check .",
-    "fix": "biome check . --fix --unsafe && bun prettier . --write",
-    "fix:staged": "biome check . --fix && astro check && bun prettier --write",
+    "check": "bun check:only && bun format:check",
+    "check:only": "astro check",
+    "format": "biome check . --fix --unsafe && bun prettier . --write",
+    "format:check": "biome check . && bun prettier --check .",
+    "format:staged": "biome check . --fix && bun prettier --write",
     "build": "astro build",
     "preview": "astro preview"
   },

diff --git a/src/components/ActivityPage/Layout.astro b/src/components/ActivityPage/Layout.astro
@@ -1,9 +1,9 @@
 ---
 import { Picture } from "astro:assets";
+import JoinUsCTA from "+/components/JoinUsCTA.astro";
+import GlobalLayout from "+/layouts/GlobalLayout.astro";
+import { Focus } from "+/schema";
 import type { ImageMetadata } from "astro";
-import GlobalLayout from "../../layouts/GlobalLayout.astro";
-import { Focus } from "../../schema";
-import JoinUsCTA from "../JoinUsCTA.astro";
 
 interface Props {
   type: string; // TODO: refine it more