<p>こんにちは。KMC 46thのmarimoです。 これは<a href="https://adventar.org/calendars/10502">KMC Advent Calendar 2024</a> 1日目の記事です。</p>

<p>KMCは<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%DF%A5%B1">コミケ</a>に合わせて部誌を年に二回刷っています。 C103までは<a class="keyword" href="https://d.hatena.ne.jp/keyword/LaTeX">LaTeX</a>を使っていました<sup><a id="fnr.bushi-template" class="footref" href="#fn.bushi-template" role="doc-backlink">1</a></sup>が、 年末のC105で頒布する予定の部誌をTypstで組んだので、その話をします<sup><a id="fnr.2" class="footref" href="#fn.2" role="doc-backlink">2</a></sup>。</p>

<p>Typstを紹介する記事はすでに多くあるので、Typst自体やその基本的な機能の紹介はそちらに譲ることとして、 実際に印刷物を作る上で必要だったことを書くことにします。</p>

<p>この記事はTypst v0.12.0を前提としています。</p>

<h1 id="ファイルの分割">ファイルの分割</h1>

<p>長い文書は複数のファイルに分割したくなります。 そのための機能として<a href="https://typst.app/docs/reference/scripting/#modules">includeとimport</a>があります。 機能としては書いてある通りでincludeはファイルを文書として読み込み、 importはファイルをプログラムとして(moduleとして)読み込みます。</p>

<pre class="code typst" data-lang="typst" data-unlink>#include &#34;foo.typ&#34;</pre>


<p>だとfoo.typを評価した結果(Contents型の値)が入ります。 つまり、<a class="keyword" href="https://d.hatena.ne.jp/keyword/LaTeX">LaTeX</a>のincludeなどのようにテキストがそのまま展開されるのではないので、中で書いた設定が外に漏れたりはしません(うれしい)。</p>

<h1 id="目次queryの活用">目次、queryの活用</h1>

<p>Typst標準でoutlineという関数がありますが、凝ったことをするには機能が足りません。 部誌は寄稿誌の形態をとっているので、目次には題だけでなく著者も載せたいです。 今回はheadingの後に<a href="https://typst.app/docs/reference/introspection/metadata/">metadata</a>をおいて、<a href="https://typst.app/docs/reference/introspection/query/">query</a>で情報をとってくるという戦略でやります。</p>

<pre class="code typst" data-lang="typst" data-unlink>= chapter1
#metadata([alice]) &lt;author&gt;
= chapter2
#metadata([bob]) &lt;author&gt;</pre>


<p>このような文書があったときに</p>

<pre class="code typst" data-lang="typst" data-unlink>#let toc() = {
  let elements = query(heading.where(level: 1, outlined: true))
  for el in elements {
    let metadatas = query(selector(&lt;author&gt;).after(el.location()))
    let author = metadatas.first().value
  }
  &lt;略&gt;
}</pre>


<p>などとしてchapter(level-1のheading)のリストと、そのauthorを得ることができます。 実際にはコーナーケースに対応する必要があります。</p>

<p>Typstは<a class="keyword" href="https://d.hatena.ne.jp/keyword/LaTeX">LaTeX</a>などと同様、文書を単なる要素列として取り扱います。 したがって要素に付随する情報を得るためには列の位置に依存して頑張る必要があります。 <a class="keyword" href="https://d.hatena.ne.jp/keyword/LaTeX">LaTeX</a>はauxに書き出して収束するまで繰り返し<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%D1%A5%A4%A5%EB">コンパイル</a>する必要がありましたが、 Typstは外部ファイルを使わずにqueryでとってこれたり、勝手に収束するまで<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%D1%A5%A4%A5%EB">コンパイル</a>してくれたり、そもそも<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%F3%A5%D1%A5%A4%A5%EB">コンパイル</a>が速いといったうれしさがあります。</p>

<h1 id="凝ったページデザイン">凝ったページデザイン</h1>

<p>縁付けたりとか背景付けたりしたいときがあります。page関数のbackground,foregroundを使いましょう。</p>

<pre class="code typst" data-lang="typst" data-unlink>#set page(background: image(&#34;hogehoge.jpg&#34;))</pre>


<h1 id="フォント">フォント</h1>

<p>これはそこそこ知られていますが、v0.12.0現在、<a class="keyword" href="https://d.hatena.ne.jp/keyword/%CF%C2%CA%B8">和文</a>と欧文のフォントを別に設定するのに困難があります。 <a class="keyword" href="https://d.hatena.ne.jp/keyword/%C0%B5%B5%AC%C9%BD%B8%BD">正規表現</a>をつかうと禁則処理が壊れるなどの問題があります。</p>

<pre class="code typst" data-lang="typst" data-unlink>#show regex(&#34;[\p{scx:Han}\p{scx:Hira}\p{scx:Kana}]&#34;): set text(font: &#34;Hoge Font&#34;)</pre>


<p>フォントのフォールバックを使ったほうがいいです。</p>

<pre class="code typst" data-lang="typst" data-unlink>#set text(font: (&#34;Latin Font&#34;,&#34;Japanese Font&#34;))</pre>


<h1 id="段組みの注意">段組みの注意</h1>

<p>Typstはpage(column: 2)とすれば2段組ができます。 あとは、v0.12.0になって段抜きの浮動図を置くことができるようになりました。 しかしv0.12.0現在、最後のページでバランスすることはできません(<a href="https://github.com/typst/typst/issues/466">#466</a>)。</p>

<h1 id="さいごに">さいごに</h1>

<p>京大<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DE%A5%A4%A5%B3%A5%F3">マイコン</a>クラブ(KMC)は、C105の2日目(月曜日)西-08aで参加します。 年2回発行の部誌に加えて、今回はKMCが管理するAS59128の本も出す予定です。 <a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B3%A5%DF%A5%B1">コミケ</a>に参加する方はぜひお願いします。</p>

<p>さいごに参考にしたドキュメントを紹介します。 Typst公式の<a href="https://typst.app/docs/">ドキュメント</a>は今どきらしく綺麗にまとまっています。 また、技術書展17で頒布された<a href="https://techbookfest.org/product/3zT3xbGrxx4bdwSNGsD83e?productVariantID=VsMLWXRzNEC2YjyfPkeYh">Typstで技術同人誌を書こう！すぐに役立つ20のトピック</a>も大いに参考になりました<sup><a id="fnr.hn-attention" class="footref" href="#fn.hn-attention" role="doc-backlink">3</a></sup>。 テンプレートの例としては<a href="https://github.com/typst/templates">公式のtemplates</a>を見ると良いです。 Typstは開発が活発でその辺のコードは使い物にならないことがあるので(この記事含め)、基本的には公式のものを見ることになります。</p>

<h2 id="Footnotes">Footnotes</h2>

<p><sup><a id="fn.1" class="footnum" href="#fnr.1">1</a></sup> <a href="https://github.com/kmc-jp/bushi-template2">https://github.com/kmc-jp/bushi-template2</a></p>

<p><sup><a id="fn.2" class="footnum" href="#fnr.2">2</a></sup> ちなみにC104でも私が<a class="keyword" href="https://d.hatena.ne.jp/keyword/%C1%C8%C8%C7">組版</a>を担当して、そのときは<a href="https://github.com/gfngfn/SATySFi">SATySFi</a>を使いました。</p>

<p><sup><a id="fn.3" class="footnum" href="#fnr.3">3</a></sup> たまたまハンドルネームが一致していますが別人です。</p>


こんにちは。KMC 46thのmarimoです。 これはKMC Advent Calendar 2024 1日目の記事です。
KMCはコミケに合わせて部誌を年に二回刷っています。 C103まではLaTeXを使っていました1が、 年末のC105で頒布する予定の部誌をTypstで組んだので、その話をします2。
Typstを紹介する記事はすでに多くあるので、Typst自体やその基本的な機能の紹介はそちらに譲ることとして、 実際に印刷物を作る上で必要だったことを書くことにします。
この記事はTypst v0.12.0を前提としています。
ファイルの分割
長い文書は複数のファイルに分割したくなります。 そのための機能としてincludeとimportがあります。 機能としては書いてある通りでincludeはファイルを文書として読み込み、 importはファイルをプログラムとして(moduleとして)読み込みます。
#include "foo.typ"
だとfoo.typを評価した結果(Contents型の値)が入ります。 つまり、LaTeXのincludeなどのようにテキストがそのまま展開されるのではないので、中で書いた設定が外に漏れたりはしません(うれしい)。
目次、queryの活用
Typst標準でoutlineという関数がありますが、凝ったことをするには機能が足りません。 部誌は寄稿誌の形態をとっているので、目次には題だけでなく著者も載せたいです。 今回はheadingの後にmetadataをおいて、queryで情報をとってくるという戦略でやります。
= chapter1
#metadata([alice]) <author>
= chapter2
#metadata([bob]) <author>
このような文書があったときに
#let toc() = {
  let elements = query(heading.where(level: 1, outlined: true))
  for el in elements {
    let metadatas = query(selector(<author>).after(el.location()))
    let author = metadatas.first().value
  }
  <略>
}
などとしてchapter(level-1のheading)のリストと、そのauthorを得ることができます。 実際にはコーナーケースに対応する必要があります。
TypstはLaTeXなどと同様、文書を単なる要素列として取り扱います。 したがって要素に付随する情報を得るためには列の位置に依存して頑張る必要があります。 LaTeXはauxに書き出して収束するまで繰り返しコンパイルする必要がありましたが、 Typstは外部ファイルを使わずにqueryでとってこれたり、勝手に収束するまでコンパイルしてくれたり、そもそもコンパイルが速いといったうれしさがあります。
凝ったページデザイン
縁付けたりとか背景付けたりしたいときがあります。page関数のbackground,foregroundを使いましょう。
#set page(background: image("hogehoge.jpg"))
フォント
これはそこそこ知られていますが、v0.12.0現在、和文と欧文のフォントを別に設定するのに困難があります。 正規表現をつかうと禁則処理が壊れるなどの問題があります。
#show regex("[\p{scx:Han}\p{scx:Hira}\p{scx:Kana}]"): set text(font: "Hoge Font")
フォントのフォールバックを使ったほうがいいです。
#set text(font: ("Latin Font","Japanese Font"))
段組みの注意
Typstはpage(column: 2)とすれば2段組ができます。 あとは、v0.12.0になって段抜きの浮動図を置くことができるようになりました。 しかしv0.12.0現在、最後のページでバランスすることはできません(#466)。
さいごに
京大マイコンクラブ(KMC)は、C105の2日目(月曜日)西-08aで参加します。 年2回発行の部誌に加えて、今回はKMCが管理するAS59128の本も出す予定です。 コミケに参加する方はぜひお願いします。
さいごに参考にしたドキュメントを紹介します。 Typst公式のドキュメントは今どきらしく綺麗にまとまっています。 また、技術書展17で頒布されたTypstで技術同人誌を書こう！すぐに役立つ20のトピックも大いに参考になりました3。 テンプレートの例としては公式のtemplatesを見ると良いです。 Typstは開発が活発でその辺のコードは使い物にならないことがあるので(この記事含め)、基本的には公式のものを見ることになります。
Footnotes
1 https://github.com/kmc-jp/bushi-template2
2 ちなみにC104でも私が組版を担当して、そのときはSATySFiを使いました。
3 たまたまハンドルネームが一致していますが別人です。

TypstでC105に出す部誌を組みました

<p>こんにちは！KMC 45thの進捗ゼミです。</p>

<p>2024年6月14日に、<a href="https://www.happyelements.co.jp/">Happy Elements</a>さんをお招きし、「<a class="keyword" href="https://d.hatena.ne.jp/keyword/Happy%20Elements">Happy Elements</a>式 ゲーム開発の基礎語ります」という新歓イベントを開催しました！</p>

<p>ゲーム開発現場で活躍しているゲームデザイナーの方に、ゲームを面白くするためのコツや、時間の無い中でゲームを完成させるための工夫、
社内でのゲーム開発事例についてご講演をいただきました。</p>

<h3 id="当日の様子">当日の様子</h3>

<p><figure class="figure-image figure-image-fotolife" title="15人もの新入生が参加してくれました"><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240619/20240619091537.png" width="720" height="542" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span><figcaption>15人もの新入生が参加してくれました</figcaption></figure></p>

<p><figure class="figure-image figure-image-fotolife" title="少人数チームでのゲーム開発のコツについて学びました"><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240619/20240619091731.png" width="1200" height="904" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span><figcaption>少人数チームでのゲーム開発のコツについて学びました</figcaption></figure></p>

<p><figure class="figure-image figure-image-fotolife" title="手作り感がいい感じの会場の飾りつけ"><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240619/20240619091518.png" width="720" height="542" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span><figcaption>手作り感がいい感じの会場の飾りつけ</figcaption></figure></p>

<p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Happy%20Elements">Happy Elements</a>社内で短期間でゲームを完成させる<a href="https://superlite.games/">Super Lite</a>プロジェクトの事例についてお話いたしました。</p>

<p><figure class="figure-image figure-image-fotolife" title="解説していただいたゲーム事例。Super LiteのWebページから遊べます！"><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240619/20240619091955.png" width="640" height="360" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span><figcaption>解説していただいたゲーム事例。Super LiteのWebページから遊べます！</figcaption></figure></p>

<p><figure class="figure-image figure-image-fotolife" title="実際にゲームを遊びながら学びました"><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240619/20240619091623.png" width="720" height="542" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span><figcaption>実際にゲームを遊びながら学びました</figcaption></figure></p>

<h3 id="KMCとゲーム開発">KMCとゲーム開発</h3>

<p>KMCでは、毎年新入生がチームを作ってゲームを開発する「みんなでゲームを作る」という新歓プロジェクトを開催しています。
初心者がぶっつけ本番で挑むプロジェクトなので、すんなりいくチームもあれば、苦戦するチームもいます。</p>

<p><figure class="figure-image figure-image-fotolife" title="2023年NFに展示されたゲーム"><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240619/20240619091302.png" width="720" height="401" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span><figcaption>2023年NFに展示されたゲーム</figcaption></figure></p>

<p>スムーズなゲーム開発をサポートするため、ゲームの規模感と開発のスケジュールについて現場のリアルを学んでもらいたいという思いから、今回のイベントを企画しました。</p>

<p>今回のイベントに参加した新入生が刺激を受け、楽しみながら面白いゲーム開発をしてくれたらうれしいです！</p>

<h3 id="ご参加ありがとうございました">ご参加ありがとうございました！</h3>

<p><a class="keyword" href="https://d.hatena.ne.jp/keyword/Happy%20Elements">Happy Elements</a>の皆様、参加者の皆様、本当にありがとうございました！
<span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240619/20240619092132.png" width="720" height="405" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>


こんにちは！KMC 45thの進捗ゼミです。
2024年6月14日に、Happy Elementsさんをお招きし、「Happy Elements式 ゲーム開発の基礎語ります」という新歓イベントを開催しました！
ゲーム開発現場で活躍しているゲームデザイナーの方に、ゲームを面白くするためのコツや、時間の無い中でゲームを完成させるための工夫、
社内でのゲーム開発事例についてご講演をいただきました。
当日の様子
15人もの新入生が参加してくれました
少人数チームでのゲーム開発のコツについて学びました
手作り感がいい感じの会場の飾りつけ
Happy Elements社内で短期間でゲームを完成させるSuper Liteプロジェクトの事例についてお話いたしました。
解説していただいたゲーム事例。Super LiteのWebページから遊べます！
実際にゲームを遊びながら学びました
KMCとゲーム開発
KMCでは、毎年新入生がチームを作ってゲームを開発する「みんなでゲームを作る」という新歓プロジェクトを開催しています。
初心者がぶっつけ本番で挑むプロジェクトなので、すんなりいくチームもあれば、苦戦するチームもいます。
2023年NFに展示されたゲーム
スムーズなゲーム開発をサポートするため、ゲームの規模感と開発のスケジュールについて現場のリアルを学んでもらいたいという思いから、今回のイベントを企画しました。
今回のイベントに参加した新入生が刺激を受け、楽しみながら面白いゲーム開発をしてくれたらうれしいです！
ご参加ありがとうございました！
Happy Elementsの皆様、参加者の皆様、本当にありがとうございました！

「Happy Elements式 ゲーム開発の基礎語ります」を開催しました！

<p>こんにちは！<a href="http://blog.hatena.ne.jp/crashrt/">id:crashrt</a> です。</p>

<p>6/1(土) に今年の新入生を呼んで新歓BBQを開催しました！
今年入部してくれた新入生が18人も参加してくれて賑わっていました</p>

<h2 id="BBQの様子">BBQの様子</h2>

<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/c/crashrt/20240602/20240602003904.jpg" width="1200" height="904" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/c/crashrt/20240602/20240602004900.jpg" width="1200" height="675" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>新入生の一人が「一致するまで終われまテン」という<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%DF%A5%CB%A5%B2%A1%BC%A5%E0">ミニゲーム</a>を遊べるサイトを教えてくれたのでみんなで遊びました。
珍回答続出で大盛り上がりでした。教えてくれた方ありがとうございます〜</p>

<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/c/crashrt/20240602/20240602004805.jpg" width="1200" height="675" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>時間に少し余裕があったので、自然の中を散歩してきた人たちもいたみたいです。</p>

<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/c/crashrt/20240602/20240602004433.jpg" width="1200" height="900" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<h1 id="最後に">最後に</h1>

<p>参加してくれた新入生の皆様、ありがとうございました！
これからもよろしくお願いします！よきKMCライフを！</p>

<p>そして、新入生の参加費無料はOBの方々のカンパのおかげで成り立っています。
カンパしてくださったOBの皆様、本当にありがとうございました！</p>

<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/c/crashrt/20240602/20240602003930.jpg" width="1200" height="675" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>


こんにちは！id:crashrt です。
6/1(土) に今年の新入生を呼んで新歓BBQを開催しました！
今年入部してくれた新入生が18人も参加してくれて賑わっていました
BBQの様子


新入生の一人が「一致するまで終われまテン」というミニゲームを遊べるサイトを教えてくれたのでみんなで遊びました。
珍回答続出で大盛り上がりでした。教えてくれた方ありがとうございます〜

時間に少し余裕があったので、自然の中を散歩してきた人たちもいたみたいです。

最後に
参加してくれた新入生の皆様、ありがとうございました！
これからもよろしくお願いします！よきKMCライフを！
そして、新入生の参加費無料はOBの方々のカンパのおかげで成り立っています。
カンパしてくださったOBの皆様、本当にありがとうございました！

新歓BBQを開催しました！

<p>こんにちは！KMC 46th の <a href="http://blog.hatena.ne.jp/walnuts1018/" class="hatena-id-icon"><img src="https://cdn.profile-image.st-hatena.com/users/walnuts1018/profile.png" width="16" height="16" alt="" class="hatena-id-icon">id:walnuts1018</a> です。</p>

<p>2024 年 4 月 25 日に、<a href="https://corp.moneyforward.com/">Money Forward</a> の皆さんをお招きし、「Go 言語ワークショップ with Money Forward」という新歓イベントを開催しました！</p>

<p>初心者向けには、Go 言語の基本的な文法を学んで HTTP Client / Server を実装するという内容、上級者向けには、「<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%B2%A1%BC%A5%E0%A5%A8%A5%F3%A5%B8%A5%F3">ゲームエンジン</a> Ebitengine を使ってアートを描いてみよう」という内容で、それぞれハンズオンを行っていただきました。</p>

<p>詳細な内容やコードについては、以下の<a class="keyword" href="https://d.hatena.ne.jp/keyword/%A5%EA%A5%DD%A5%B8%A5%C8%A5%EA">リポジトリ</a>にて公開していますので、ぜひ体験してみてください！
<iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fgithub.com%2Fkmc-jp%2Fmoneyforward-2024-04-25" title="GitHub - kmc-jp/moneyforward-2024-04-25" class="embed-card embed-webcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 155px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://github.com/kmc-jp/moneyforward-2024-04-25">github.com</a></cite></p>

<h2 id="当日の様子">当日の様子</h2>

<div class="images-row mceNonEditable">
  <span itemscope itemtype="http://schema.org/Photograph"><a href="http://f.hatena.ne.jp/kmc-log/20240430201815" class="hatena-fotolife" itemprop="url"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240430/20240430201815.jpg" width="800" height="600" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></a></span>
  <span itemscope itemtype="http://schema.org/Photograph"><a href="http://f.hatena.ne.jp/kmc-log/20240430202350" class="hatena-fotolife" itemprop="url"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240430/20240430202350.jpg" width="800" height="600" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></a></span>
</div>


<div class="images-row mceNonEditable">
  <span itemscope itemtype="http://schema.org/Photograph"><a href="http://f.hatena.ne.jp/kmc-log/20240430205622" class="hatena-fotolife" itemprop="url"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240430/20240430205622.jpg" width="800" height="600" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></a></span>
  <span itemscope itemtype="http://schema.org/Photograph"><a href="http://f.hatena.ne.jp/kmc-log/20240430204317" class="hatena-fotolife" itemprop="url"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240430/20240430204317.jpg" width="800" height="600" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></a></span>
</div>


<div class="images-row mceNonEditable">
  <span itemscope itemtype="http://schema.org/Photograph"><a href="http://f.hatena.ne.jp/kmc-log/20240430203606" class="hatena-fotolife" itemprop="url"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240430/20240430203606.jpg" width="800" height="600" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></a></span>
  <span itemscope itemtype="http://schema.org/Photograph"><a href="http://f.hatena.ne.jp/kmc-log/20240430202400" class="hatena-fotolife" itemprop="url"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240430/20240430202400.jpg" width="800" height="600" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></a></span>
</div>


<div class="images-row mceNonEditable">
  <span itemscope itemtype="http://schema.org/Photograph"><a href="http://f.hatena.ne.jp/kmc-log/20240430202724" class="hatena-fotolife" itemprop="url"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240430/20240430202724.jpg" width="800" height="600" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></a></span>
  <span itemscope itemtype="http://schema.org/Photograph"><a href="http://f.hatena.ne.jp/kmc-log/20240430202409" class="hatena-fotolife" itemprop="url"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240430/20240430202409.jpg" width="800" height="600" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></a></span>
</div>


<h2 id="KMC-のお仕事">KMC のお仕事</h2>

<p>ワークショップの内容についてはすべて Money Forward さんにお願いしましたが、KMC ではオンライン開発環境の提供を行いました。</p>

<p>KMC 内のオンプレサーバーにて、<a class="keyword" href="https://d.hatena.ne.jp/keyword/VSCode">VSCode</a> のブラウザ版 (<a href="https://github.com/coder/code-server">coder/code-server</a>)をセルフホストし、参加者の方々に使っていただきました。</p>

<p>裏側では結構てんやわんやでした...</p>

<p><figure class="figure-image figure-image-fotolife" title="VM のメモリ割り当てをドタバタで増やしている様子">
  <span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240430/20240430212912.png" width="551" height="239" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span>
  <figcaption><a class="keyword" href="https://d.hatena.ne.jp/keyword/VM">VM</a> のメモリ割り当てをドタバタで増やしている様子</figcaption>
</figure></p>

<p><figure class="figure-image figure-image-fotolife" title="オンライン開発環境用 Pod のメトリクス">
  <span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240430/20240430212918.png" width="800" height="405" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span>
  <figcaption>Pod のメトリクス</figcaption>
</figure></p>

<p>また、質問対応やサポートを他の部員にお願いしました。
スタッフとして参加していだたいた部員の皆さん、ありがとうございました！</p>

<h2 id="ご参加ありがとうございました">ご参加ありがとうございました！</h2>

<p>Money Forward の皆様、参加者の皆様、本当にありがとうございました！
<span itemscope itemtype="http://schema.org/Photograph"><a href="http://f.hatena.ne.jp/kmc-log/20240430205631" class="hatena-fotolife" itemprop="url"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kmc-log/20240430/20240430205631.jpg" width="800" height="450" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></a></span></p>


こんにちは！KMC 46th の id:walnuts1018 です。
2024 年 4 月 25 日に、Money Forward の皆さんをお招きし、「Go 言語ワークショップ with Money Forward」という新歓イベントを開催しました！
初心者向けには、Go 言語の基本的な文法を学んで HTTP Client / Server を実装するという内容、上級者向けには、「ゲームエンジン Ebitengine を使ってアートを描いてみよう」という内容で、それぞれハンズオンを行っていただきました。
詳細な内容やコードについては、以下のリポジトリにて公開していますので、ぜひ体験してみてください！
github.com
当日の様子

  




  
  




  
  




  
  



KMC のお仕事
ワークショップの内容についてはすべて Money Forward さんにお願いしましたが、KMC ではオンライン開発環境の提供を行いました。
KMC 内のオンプレサーバーにて、VSCode のブラウザ版 (coder/code-server)をセルフホストし、参加者の方々に使っていただきました。
裏側では結構てんやわんやでした...

  
  VM のメモリ割り当てをドタバタで増やしている様子


  
  Pod のメトリクス

また、質問対応やサポートを他の部員にお願いしました。
スタッフとして参加していだたいた部員の皆さん、ありがとうございました！
ご参加ありがとうございました！
Money Forward の皆様、参加者の皆様、本当にありがとうございました！

お知らせ

例会日程

活動内容

ブログ

TypstでC105に出す部誌を組みました

「Happy Elements式ゲーム開発の基礎語ります」を開催しました！

新歓BBQを開催しました！

「Go言語ワークショップ with Money Forward」を開催しました！

お知らせ

例会日程

活動内容

ブログ

TypstでC105に出す部誌を組みました

「Happy Elements式 ゲーム開発の基礎語ります」を開催しました！

新歓BBQを開催しました！

「Go言語ワークショップ with Money Forward」を開催しました！

「Happy Elements式ゲーム開発の基礎語ります」を開催しました！