我ワクチン注射にも屈さず開発を施行する
※この記事は「木更津高専アドカレ2021 1本目」の記念すべき25日目の記事です!
前→ 木更津高専と雄峰寮、サバイバル術 by @chizuchizu
「フォッフウデイタイォッフォッ Merry X-"SMASS"!」
はじめまして、NIT Kisarazu C 情報工学科2年~~のサンタ、~~とすあっぷと申します。
ほぼ初めての記事なので、至らぬ点が多数あるかと存じますが、お手柔らかにご指摘ください。
全くクリスマスにふさわしくないので、クリスマスに相応しい記事を見たい方は、こちらをご覧ください。
ちなみに今日ワクチン打ちました。2回目です。
タイトルはそういうことです。
何を書くんだい?
色々書きたいことはあるのですが、今回は**「開発初心者な私がたった1ヶ月でウェブサービス(笑)を展開するまで」**を書かせていただきたいと思います。
学寮のことはみんな書いてるからいいでしょ
もくじ
- 採用篇 ~私、どうなっちゃうのー!?~
- 開発篇 その1 ~うわっ…俺の技術力、ゴミ過ぎ?!~ | With Rust
- 開発篇 その2 ~C#こそ至高…え?!Webも書かなきゃなんですか?!~ | With C#(ASP.NET), JavaScript(Vue.js)
- 開発篇 その3 ~開発の刄 無限議論編~ | With Team
1. 採用篇
そもそもなんでこんな事態になったのか、ご説明致します。
「第4回高専防災コンテスト 2ndステージ」に採択された
おしり
ーーー
ⓃⒾⓉ
無責任ですね。ちゃんとご説明致します。
私が所属(笑)している木更津高専 情報工学科2年チーム Trialでは、「避難所の運営を紙媒体からデジタル媒体へ」というアイデアを年始から練り始め、様々なコンテストへ応募して参りました。
最初はRFIDタグを用いたものから、次第にユーザーへ寄り添ったサービスへ。
最終的に考え出されたのはナウでヤングな"QRコード"を用いたシステムでした。
それが第4回 高専防災コンテストで採択された「避難所運営をサポートするITシステム Shelter Management And Support System 【SMASS】」です。
このシステムのウリは「アプリのダウンロードがいらない点」等ですが、このご時世、何をどう考えてもアプリがないと辛いですよね。めちゃんこデメリットだと思います。
2. 開発篇 その1
このシステムを作成するにあたって、サーバーサイド、クライアントサイドの作成、そしてデータベース設計が必要になります。
私は「どうせ私しかAPIサーバー書けんのやろうな」とサーバーサイド開発、チームメイトが他を作成してくれることになりました。
開発言語はAll Rust。DB設計者の希望です。
私はすでに嫌な予感がしていましたが、まあどうにかなるだろうと開発を開始しました。
(なお、この中でRustを書ける人は誰一人としていません。) <- ここ重要
さて、採用されたのは10月中旬。開発完了予定までは2ヶ月半あります。
最初は全員ゴリゴリ書いていました。最初は。
1ヶ月ほど経ち、それぞれ気づきます。
***「これ無理くね?」***と。
そらそうなんですよね。私はC#er、開発メンバーはJavarとPythonerです。
私がSAN値チェックに失敗し、発狂をキメ、開発言語は私のプレゼンテーションによりC#に変更になりました。
それが試験直前だというのは、また別の話。
3. 開発篇 その2
C#に変わっても開発パートは変わらず。
そこで私気づきます。
「サーバーサイドってもしかしてフルスタックやらんとあかん?」
と。(そのとおりなのは、また別の話。)
生粋のVSerである私は、VS2022の新機能、VueとC#を同時に開発できそうな機能を用いて開発を開始しました。
私「Vueの勉強からか…(試験直前)」
チームメイト「俺ら触ったこと無い言語やから、がんば」
何度でも言いますが、アプリケーションにしたほうが絶対都合がいいですよね。
ということで環境構築の方法です。
今回の環境は以下です。
OS: Windows 11 Dev(22494.1000)
CPU: AMD Ryzen 7 5700U
RAM: 16GB (DDR4-3200)
ROM: WDのNVMeみたいなやつの512GBのやつだと思う
GPU: Radeon Graphicsくん(専用512MB)
使用するソフトウェア等
IDE: Visual Studio Community 2022 v17.0.2 (以下VS)
データベース: MySQL v8.0.27
.NETフレームワーク: .NET 6
JS環境: Node.js v14.18.1
あと Vue v2.6.14
(待機時間を除いて)人によっては3分で出来る環境構築〜!
- VSをDLする!
- 入れる!
終わり! やったあ!
(詳しい入れ方は調べてください)
Vueで書き進めていくうちに様々な困難が…というかそもそも知らないのでそんなこと?って思われるかもしれない壁にぶち当たっては砕け散ってます。
あまりにも動かなくて環境消し飛ばしを15回くらいやってるので、環境再構築RTAは世界新だと思います。多分。(適当)
折角なので私が困ったことも書こうと思います。
1. CORSポリシーに超引っかかった
バチバチに引っかかりました。
同じlocalhost
でもポートが違うとダメなんですね。
ということでプロキシ機能を使いました。
module.exports = {
devServer: {
// ここから --
proxy: {
'/api/': {
target: 'https://localhost:5001'
}
},
// -- ここまで
}
}
これで/api/
にリクエストを投げると、https://localhost:5001
で待機しているバックエンドにリクエストが飛びます。やったね!
2. Visual Studioで、「クライアントサイドライブラリ」を追加しても追加されへん
追加されへんのよね。
開発ディレクトリでコンソール開いて、npm install hogehoge --save
ってしたらimportできました。
なんでか知ってる人教えてください。
3. ビルドが一個しか出来へん。何?
ここに書いてあって素敵。
4. 開発が滞ってます
知りません。頑張ってください。
4. 開発篇 その3
無限議論してます。
メンターさんとのMTGは月1回。
他にも毎日Microsoft TeamsやGitHubなどを用いて、様々な情報共有をしています。
POSTがPASTでBOOSTしたり。(?)
Issueたてたり夕焼け見たり。
開発?知らない子ですね。
今度、地域の学校で検証させていただく予定です。楽しみ。
最後に
投げやりな記事でごめんなさい。許してください。
あと開発頑張ります。
最後までご覧頂きありがとうございました。