楽屋

プログラミング学習の記録(になる予定)です。

日報:「ブロック25」をつくる その2

今日やったこと

ブロック25を作る

データベースからクイズを出すようにする

・文字部分はすんなり行ったけど画像がうまく表示されなくて困った

・正誤判定がめちゃくちゃランダムになってしまった

→出題時と正誤判定時にそれぞれデータベースからランダムにクイズを選んでいるので、出題時と正誤判定時で違うIDのクイズを参照していることがあるっぽい

→クイズのIDを受渡してちゃんと照合するように変更。難しかった……

 

・グリッドデザインに苦戦

→なんとなくうまく行ったものの、まだ改良の余地あり

 

・とりあえず今はこんな感じ

Render.comを使ってみる

・人に見せたいのでとりあえずデプロイというやつをしてみた。

この記事を参考にやってみたらとりあえずできたっぽい。

 

雑感

明日からしばらくオーストラリア研修で、パソコン触る時間もあまりなさそうなのがちょっと残念。研修自体はすごく楽しみだけど、今せっかくモチベ高いのにな〜〜とは思う。

日報:「ブロック25」を作る その1

今日やったこと

競プロのコードをGitHubに投稿できるようにした(かった)

この記事を見てAtCoderに提出したコードを自動で取得するように設定しようとしたけど、procon-gardener archiveしようとしたらunexpected end of JSON inputというエラーが出てしまい、うまくいかなかった。

Twitterで検索してみたところどうも私に太刀打ちできる問題ではなさそうで、とりあえずしばらく手動で保存することにした。

 

「ブロック25」というゲームを作り始めた

・ブロック25は、アタック25の地中海クルーズを賭けた画像クイズとブロック崩しを組み合わせたもの。

・ブロックを崩して行くと画像が出てきて、その画像に関するクイズに答えるというゲーム。

 

・とりあえずMDN Web Docsのチュートリアルを見てブロック崩しの原型を作る。

 

・背景画像を設定して、ポーズ機能をつけたところでとりあえずJavaScriptはひと段落にする。

 

Golangを書き始めようと思ったけどgo mod initの意味がよくわからず苦戦。

ここを見ながらやることにした。

 

・とりあえず、1問だけだけどクイズができた。

・明日以降データベースを作ってクイズ問題を増やしたり、トータルスコアを計算したりできるようにする。見た目も改善する。

Build@Mercari 2024体験記(文系未経験編)

結論:Build@Mercariは最高のプログラムだし、初心者でも文系でもまったく問題ないので、気になったら即応募するのが吉です。

 

この記事は7000文字ほどありますので、とりあえずこの結論だけは覚えて帰ってください。

また、以下の目次から気になるところだけ読むのもおすすめします。

内容に何か問題がありましたらご連絡ください。

 

 

Build@Mercari 2024とは何か

「Build@Mercari」とは、これまでさまざまな事情でチャンスが巡ってこなかった方、特にSTEM分野(Science, Technology, Engineering, Mathematics)・IT分野におけるマイノリティである女性やLGBT+コミュニティの方を対象に、トレーニングとインターンシップのオンラインプログラムです。2019年から開始され、2024年に5回目の開催を迎えます。

mercan.mercari.com

メルカリさんが開催しているエンジニアリング初心者向けのトレーニングプログラムです。詳しい内容や形式は後述しますが、二週間でWeb開発の基礎を学べる、(ほぼ)オンラインプログラムになっています。

 

私がどういう人間か

2024年3月現在学部3年生。大学でやっているのは人文系の学問(演劇学)で、コンピューターサイエンスには縁がない人生を送ってきました。統計なども特に使っていません。参加前のコーディング経験もほぼほぼ皆無です(AtCoderで灰色の問題をちょこちょこ解いたことがあるくらい)。

 

選考について

※このセクションに書かれていることは推測を多く含みます

自分の時はオンラインでのコーディングテスト+エントリーシートでした。エントリーシートは形式自由の履歴書と400字程度の作文複数を含んでいました。

 

コーディングテストについて

私の時はかなり簡単な内容でした(綺麗に書けたとは言っていない)。しかし私はそれでも一問テストケースを通せませんでした。それにもかかわらず合格しているので、コーディングテストは選考のためというよりもレベルチェックの意味合いの方が大きいと思われます。

 

コーディングテストの対策について

AtCoderもいいのですが、LeetCodeを一回はやっておくことを強く勧めます。

理由は二つあります。まず第一に英語での問題文に慣れるためです。私は英語のリーディングはそこまで苦手ではないと思っていますが、「英語のコーディングテスト」特有の単語や表現はいきなり出くわすと結構面食らいました。二つ目の理由は、テスト形式です。AtCoderはまっさらなところに標準入力から書き始めますが、LeetCodeはあらかじめ与えられた関数の中身を書くという形式です。今回のコーディングテストは後者でした。来年以降どちらの形式になるかわかりませんが、本番で見たことのない形式を見ると戸惑うかと思いますので、どちらが出てきても大丈夫なようにしておくのがいいと思います。

 

エントリーシートについて

おそらく重要なのはこちらです。特に作文で自分がこのプログラムに参加する目的・意義をしっかり伝えられるかが合否を分けると思います。ここに載せることはしませんが、私は自分のバックグラウンドと絡めて志望動機を書きました。それがプログラムの目的と比較的近かったために合格したのではないかと思っています。

 

やってよかったかもしれないこと

これはよかったのではないかなと思っているのが、GitHub Pagesでごく簡単なWebサイトを作って公開し、そのURLをエントリーシートに載せておいたことです。初歩的なHTMLとCSSで作った、プロフィール画像と自己紹介文が載っているだけの本当に簡素なサイトですが、やる気アピールにはなったと思います。

また、トレーニングプログラム中はGitHubを使うのですが、完全に初見だった方々は結構苦労していたように見えました。GitHubの基本的な使い方を身につける上でも、アカウントを作ってちょっといじっておくくらいはしてもいいかもしれません。

 

参加者はどんな人たち?

情報系の方が多めではありました。しかし私のように完全に初心者の方もちらほらいらっしゃいました。大学生が多いですが、大学院生、高校生、社会人の方々もいらっしゃいました。

 

内容について

※2024年の内容です

Golang(またはPython)、SQLite、Docker、TypeScriptなどを使って商品出品システムを作りました。詳しい内容はGitHubを見ていただくのが一番早いと思います。バックエンドからフロントエンドまで、Web開発の流れを体験できるような内容です。

 

プログラム全体の流れ

初日はメルカリさんのオフィスに招待されてオリエンテーリングがありました。この時に他の参加者の方々やメンターさんたちとお話しできました。また、STEP2の環境構築まではここで行われ、その場でメンターさんのサポートが受けられましたので、GolangPythonの環境構築で詰むことはないと思います。

二日目から最終日までは自宅等でそれぞれ自由に開発を進め、一日一回15分程度のミーティング(Slackのハドルという音声通話機能を用いました)で進捗報告や質問をするといったかたちでした。もちろん質問は随時Slackにも投稿できますし、GitHubでもアドバイスをいただけました。また、参加者で自主的にハドルを行い、トレイニー同士で相談や質問もできたので、初心者でもなんとか食らいついていけました。

最終日にはオンラインで成果発表会があり、一人一分程度で二週間で得た学びについて共有しました。

 

Build@Mercariは初心者でも大丈夫?

大丈夫だと思います。メンターさんやチームメンバーにいろいろ質問しながら進められますし、課題文には適切なヒントやリファレンスがあり、先に進んでいる人がどのように実装しているかも参考にできますので、見よう見まねでもなんとか食らいついていけます。

ただ、一日あたりの所要時間は多めに見積もったほうがいいかもしれません。単純に、コーディングやコンピュータの操作自体に不慣れだと人より時間がかかります。私はGolangSQLJavaScriptも初見だったので、毎ステップProgateで初歩の初歩を覚えるところからやっており、かなり時間を使いました。

StudyPlusというアプリで記録を取っていたのですが、私は平均して一日7時間くらいはやっていました。時間が取れる日は12時間くらいやっていた日もありました。取り組みを強制されることは一切ありませんし、トレーニング期間中のノルマなどが存在するわけでもないのですが、楽しくてもっと先に進みたくなって結果として一日中ぶっ通しでやってしまう可能性はけっこう高いと思います。

 

参加前・参加中にやってよかったこと

Progate

参加前にPythonGitCommand Line、参加中にGoSQLJavaScriptをやりました。特にGitとCommand Lineをやってから行くのはかなりおすすめです。2つ合わせても1~2時間で終わります。

Progateのいいところは、各練習課題が難しくないのでサクサク進められて短期間で初歩的な文法をさらえるところと、間違っていたときにどの辺りが間違っていたか教えてくれる機能がついているところです。この機能がなかったら「末尾に”;”がついていない」みたいなことに気付けずにしばらく悩んだりしていたと思います。

逆に、Progateの弱みは「Progateを終わらせた後、実際に何か作るまでのジャンプがやや大きい」ことではないかと個人的には思っているのですが、今回はBuild@Mercariがそこの橋渡しをしてくれました。そういった意味でもProgateとBuild@Mercariの相性はいいと思います。

 

ハドルに積極的に参加する

実は最初の三日くらいは「他の人に難しい話を振られてしどろもどろになったらどうしよう……」と思っていて、ハドルには定例ミーティングの時以外参加せず、それが終わったらそそくさと去っていました。しかし4日目にふと気づきました。コードも全然書けてないのでGitHubからも進捗が読み取れないし、Slackにもほとんど顔を出していなかったため、「いま自分は他の人から見て『どこで何をやっているのかよく分からない人』になっているのではないだろうか?」と。

そこでその日から積極的にハドルに参加するようにしました。といっても発言はハードルが高いのでマイクはミュートのままです。でも無言でも参加するといいことがあって、よく一緒に参加していた方となんとなく馴染み深くなれましたし、他の人の質問とそれに対する回答を一緒に聞いて勉強することもできました。

また、他チームにとてもコミュニケーション能力の高い方がいらして、その方とお話ししたのをきっかけに他チームのハドルにもときどき参加するようになりました。それで話すようになった他チームの方々もいて、勇気を出してみてよかったなと思っています。

 

文章を書く

同じく最初の頃は「他にレベル高い人が書いた記事やコメントがたくさんあるし、自分が何かを発信しても意味ないよな」と考えていたのですが、Slackの他のチャンネルをよく見てみると自分の他にも同じようなところで詰まっている初心者と思しき方々がちらほらいらっしゃることに気づきました。そこで、自分が詰まったところや、初心者でも読めるおすすめの本などについての文章を書いて上げるようになりました。

これがいい習慣だったと思う理由は、自分で調べたことも放っておいたら半日くらい経つと忘れてしまうし、すごく参考になったおすすめの記事も閲覧履歴に埋もれてどれだか分からなくなってしまうからです。

この習慣は今後も続けていこうと思ったのが、このブログを開設した理由でもあります。ちなみに参加中はNotionで書いており、ここにまとめてあります。よかったら読んでください。

 

もっとこうすればよかったなと思うこと

積極的に質問する

前述の通りハドルには積極的に参加していたのですが、ハドルで質問をするのが苦手で、メンターさんはいつも優しく「なんでも聞いてください」と言ってくださっていたのにあまり質問できませんでした。

もちろん詰まったところはたくさんあったのですが、いつも「もう少し自分で調べてみてから質問しよう」と思ってしまいました。自分でも何がわかっていないのかよくわかっていなかったのですが、とりあえず口頭で説明することにチャレンジしてみるべきだったな……と思います。ドキュメントのアドバイスにも15分調べて分からなかったら質問しようと書いてあったので、それを実践できたらもっとよかったです。メンターさんたちはみんな優しかったので質問すれば答えてくださったと思います。

 

人のプルリクエストに積極的にコメントする

GitHubにはプルリクエストという機能があって、そこで自分の書いたコードにコメントをもらったり他の方のコードにコメントを書いたりできるのですが、進捗が遅くて他の先に進んでいる方々が何をやっているのかよく分からなかったことと、初心者すぎて気後れしてしまって何をコメントすればいいか分からなかったことで、全然コメントできませんでした。でもチームメンバーのコードはめちゃくちゃ参考にしていたし、真似したところに「ここ真似させていただきました!」って書くだけでもすればよかったなと思いました。他の方は私のコードにたくさん改善点をコメントしてくださったのに、申し訳なかったです。

 

焦らずゆっくりやる

特に後半、理解があやふやなままでもとにかく動いたら次に行くと言う感じになってしまったことを反省しています。これには一応理由があって、実装して新しいことができるようになるのが面白すぎてどんどん先に進みたくなってしまったのです……。特にSTEP7のフロントエンドをやってみたすぎたことと、どうせなら最終発表会の時にフロントエンドまで作ってデモ動画を見てもらいたかったため、STEP5, 6はえいやという感じで進めてしまいました。前述の詰まったところメモもSTEP4までしか書いていないので、もったいなかったです。

今は時間がたくさんあるので、Udemyの講座や本でしっかり復習したいと考えています。

 

参加後のインターンプログラムについて

※2024年の内容です

実はBuild@Mercariは二段階に分かれていて、私が今回参加したのは「トレーニングプログラム」です。もう一つ、トレーニングプログラム修了者向けの「インターン」が存在し、いま私はこれを目指して勉強中です。

このBuildインターンは、メルカリのサイトで募集されている通常のインターンより難易度が低い育成に重点を置いたインターンになっています。また、Buildインターンはさらに二つに分かれており、実務に取り組むより実践的な2ヶ月のインターンと、出された課題に取り組む育成特化の1ヶ月のインターンがあります。インターンの参加形態は、日本国内在住か、学生の場合卒業年次はいつか、そして選考のためのコーディングテストの結果などで決まります。

このインターンの選考に申し込むには、選考開始までにトレーニングプログラムの所定のステップまで到達している必要があります。しかし、二週間のトレーニング期間で到達できなくても大丈夫なのでそこは初心者でも諦めなくていいと思います。

以上私の理解について書きましたが、インターンの制度などは年々変わっているそうで、このあたりのシステムについては参加したあとにメンターさんに質問するのが一番確実だと思います。

 

Build@Mercariとは私にとってなんだったのか

「プログラミングができるようになるには、なんでも好きなものを作ってみるのが一番いい」とよく言われます。でも私はそのハードルがとても高いものに思えて先に進めずにいました。

例えば私は趣味で絵を描く人間なのですが、絵を描いてみたいと思っている人で、いきなり紙と色とりどりの画材を渡されて「なんでも好きなものを描いてください」と言われてすぐ何を描くか決めて描きはじめられる人って多くはないのではないでしょうか? 自分もまさにこういう状態で、自分なりにプログラミングを勉強してみて、簡単なホームページや小さなおみくじを作ってはみたものの、それらと「自分が作りたいもの」の間にある長い道のりの全体像が見えなかったのです。

 

ところで、ピエール・バイヤール『読んでいない本について堂々と語る方法』という大変面白い本があります。この本で述べられていることを簡単にまとめると、「書物について重要なのはその中身よりもむしろその書物が知の体系の中でどこに位置付けられているかである」というようなことになります。

今回私がBuild@Mercariからもらった一番大きな財産は、Web開発の体系の、いちばん基礎の枠組みだと感じています。今はGoogle検索すれば無数の記事が出てくる時代ですが、今までの私は個々の記事を見てもその文脈を一切共有できていなかったため何も理解できずに終わってしまっていました。しかし、今回参加したことで、それらの記事や書籍を読む準備が少しだけ整いました。自分の中で完全に白紙だった「エンジニアリングの地図」におぼろげながら何かが浮かび上がってきた、というような感じです。

今後やってみたいことが今はたくさんあるので、Buildトレーニングで学んだことを活かしつつ、頑張っていきたいです。

 

今後やりたいこと

残りのステップに取り組む

まずはトレーニング期間中に終えられなかったSTEP8, Ex-1, Ex-2を完遂したいです。

特にEx-1.(アルゴリズム)はインターン応募の要件でもありますし、選考で行われるコーディングテストの練習も兼ねて頑張りたいです。

 

STEP7までの復習

前述した通り、理解できないまま進んでしまったところに戻ってもう一度勉強し直したいです。STEP5以降が特に理解が追いついていないと思うので、動画や書籍も使いながらゆっくりやっていきたいです。

 

Simple Mercariにいろいろな機能をつける

正直いま一番やりたいことはこれかもしれないです。キーワード検索機能をブラウザ上で使えるようにしたいですし、カテゴリ検索や、新しい順/古い順に商品を並べ替える機能をつけたら面白そうです。アイテム詳細ページも作りたいです。夢が膨らみます!

 

おわりに

思えばこんなに何かに夢中になったのはけっこう久しぶりかもしれません。とても楽しい二週間でした。楽しく、実りある二週間を過ごせたのは、メルカリの方々や一緒に頑張ったトレイニーの皆さんのおかげだと思います。本当にありがとうございました。

そして、私はまだ一歩目を踏み出したところで、これから勉強することも、これからできるようになることも無数にあるという事実にわくわくしています。これからも楽しくエンジニアリングをやっていきます!