お楽しみWeb制作講座と思って履修したら大変な事に...IT5007 Software Engineering on Application Architecture

さて、遂に我が足掛け3年に渡るNUSの理系転向プロジェクトはひとまず終わりを迎える事になった。総括については別途書くとして、ここでは最終セメスターに履修したIT5007 Software Engineering on Application Architectureの体験記を記しておく。

IT5007 Software Engineering on Application Architectureの概要

授業概要は以下を参照。

具体的にはこんな感じである。

*javascript, css, htmlの3点セットを簡単に学習、簡単なホームページを作成する所からスタート。

*アプリ開発で必要になるgitやDocker、Linux環境での各種コマンド、開発のいろは等も一通り学習、授業やプロジェクトの中で使いながら習熟。

*Node.js、React、MongoDB、フロントエンドとバックエンドを繋ぐgraphql等を一通り学習。

*スマホの開発にも対応できるようにReact Nativeの使い方も一通り学習。

*その他セキュリティやパフォーマンス計測の基本を一通り学習。

全体として、フロントエンド、バックエンドを含めたフルスタック開発を実際に簡単なウェブアプリやモバイルアプリを作りながら学んで行きましょう、と言った実践演習色の強い内容の講座である。

今までの自身の講座の取り方はPython、データアナリティクス、機械学習周りに傾斜していた事、特にフロントエンド周りの知識が全くなく基本事項位は身につけておきたいと感じていた事、DockerやLinuxコマンド等のスキルを身につけた上でgitにもより慣れたいと言ったニーズがあった事、加えて「もう片方の授業は理論で数学が重たいので、他の授業はもう少し箸休めっぽいのが良い、趣味的な感じが良い」と言った下心ので受講した感じである。

後述するが、上述の狙いは概ね満たす事はできたが「箸休めで趣味的な感じ」については自身の勘違いであり、全然箸休めでもなかったし、相応にしんどい行軍をする事となった。

実際の授業内容、参考書等

授業内容については、Courseraの以下の講座が比較的近いものとして挙げられる。

実際には、授業では以下のPro MERN Stackの書籍をもとに順次解説をしてゆくと共に、節々で学んだ事を確認する形で個人課題が提出されるスタイルであった。それに加えて、2人ペアでチームを組んで自分達でウェブアプリの企画から最終的な実装までして提出すると言うものであった。配点は個人課題や授業参加が半分弱、グループプロジェクトの提出物が半分強、試験はなし(グループプロジェクトの提出を以て最終課題とする形式)であった。

序盤戦は楽々カルチャー講座のように思われたが...

序盤戦では、javascript, css, htmlと言うウェブページ作成入門の内容でお馴染みの事柄を学ぶと共に、git、Docker、Linuxコマンドを用いた開発環境の構築、開発タスクへの習熟が為された。通例通り序盤戦はイージーで楽ちんであったし、DockerやLinux環境と言うのは自身的にも不安のある所であったので非常に助かった。

課題についても序盤戦は、20年以上前の懐かしい感じの個人ウェブサイト風味なものを作る素朴な感じであった。名前と電話番号を入力すればテーブルにそれらが加えられていきウェイトリストになる、予約のキャンセル時は指定の客を削除出来る、そうした機能を作る所から始める感じであった。テーブルにデータを加える、削除する等の作業を通じてウェブサイトやアプリ作りの基本を学ぶと言うのはある種お約束なのかなと言うようにも見受けられた。うわーい、ボタンとか配置してちゃんとウェブサイトが動いたどー♪。この段階ではまだ「お楽しみ講座」であった。

中盤戦以降はやっぱり泥沼の行軍...

これが中盤になると、(これもNUS MCompの授業のお約束なのだが)難易度が急カーブで上昇して行った。Node.js、Reactが導入され始め、コンポーネントであるとかstateを設定、更新、異なるコンポーネント間で渡しながら諸々行う、フロントエンド(クライアントサイド)とバックエンド(サーバサイド)のオペレーションを分ける、バックエンドにmongodbを導入してCRUDオペレーションができるようにして、ミドルウェアとしてgraphqlを導入してこれでAPIを作ってフロントエンドとバックエンドの連絡をする、フロントエンドからはAPIで欲しいデータをバックエンドに問い合わせて、計算処理等のロジックはバックエンド側で作ってあり結果だけフロントエンドに返す仕組みを作る...となって来るに連れて、授業や課題の負担感は増していくことになった。

また、後半ではReact Nativeによるスマホアプリの開発の初歩を学び、課題で簡単なものを作る事になったが、このセットアップが面倒な事面倒な事、エミュレータの動作が遅いし訳分からないエラーが出る事出る事、大変に苦しんだ。毎度の事だがこう言うのは環境を作って後はコードを書くだけと言う状況まで持っていくところが非常にしんどい。

このようにして、中盤以降は「やっぱりか」と言う感じだが、お楽しみ講座どころではなく、泥沼の行軍になって行った。

授業内容とグループプロジェクト課題の間のギャップに苦しむ...

加えて、授業の内容とグループ課題で実装する必要のある機能の間にやや分断を感じた面もあった。例えばログイン画面、ユーザネームとパスワードを入力してログインし、ログインしたユーザのユーザネームを他のページでも共有認識する事でパーソナライズされたページを作る(ランディングページに「Welcome xx(ユーザ名)!」と表示され、そのユーザ固有の情報のみが他のページでも見えるようにする)...と言うのはグループ課題の実装では基本にして最重要な内容であったが、授業で直接それが取り上げられる事はなく、かなりの程度自分で調べる必要があった。その他、複数ページ間の遷移の部分でRouterを使う必要があったのだがそこもPro-MERNの教科書やウェブサイト参照して自分で何とかしてくださいの形でありかなり厳しいものがあった。プロジェクトの中間提出時点では、まだサイト間のリンクも張られていない、クライアントサイドのみでサーバサイドと分けられていないシャビーなページが幾らか出来ただけであり、結構焦った。

NUSとしても担当の先生にしてもこうしたハンズオンのウェブアプリ開発の授業を行うのは初めてであったようで、ロジの部分も未整備な所、授業もパワポではなくzoom上でホワイトボードで板書?して行ったり上述のgithubのコードを追って行きながら解説するスタイルで、正直ややunorganizedな印象もあった。コードの解説はその場では理解した気になっても、実際に自分で手を動かしてみないと全く頭には入っておらず、結局授業の後に収録ビデオを再度確認しながら手を動かしていかないといけない面も多かった。結果として、復習や課題をやるのにも予想外に時間がかかり、時間リソースを圧迫する事になった。

授業の参加者についても、自身のようなjavascriptやウェブアプリ関連について全くの素人から、電気工学なり隣接学科出身である、IT業界で勤務歴がある等してある程度前知識がある、Linux環境での開発に慣れている生徒まで幅が広く、その点でも中々苦労する面があった(多分教える側も大変だったと思う)。ウェブのセキュリティ関連の話題等、生徒の質問の内容的に自分では付いていくのが難しい話題も比較的あった。

グループ課題のメンバー運の良さ、先生への質問攻めで救われる

一方で、グループ課題のメンバー運は今回非常に良かった。コンサル出身者でありグループワークのブレインストーミングを広げる、毎回の会議で役割分担と達成事項を明確にする、中間提出や最終提出に向けて収束させる、と言った辺りの呼吸が非常によく出来ている優秀な人で、非常にやりやすかった。加えて、ドキュメンテーションが非常に上手く、自身が比較的ラフなドラフトを書けば後は非常に素晴らしいレポートにまとめて頂いた。こちらからはgitやdockerの開発環境づくり、コード書き面でしっかり先手先手を打って貢献する事で先方が多数授業を取っていて多忙な面を補う事を意識した。

また、先生についても、当初は授業がややオーガナイズされていない感、ロジが定まらない感もあったが、ロジは進んでいくに連れて段々とこなれて形になって行った。また質問すれば知識面の豊富さやアドバイスの的確さが感じられ、行き詰まった際に何度も助けて頂いた。

遂に提出、そしてNUS修士課程の全ての授業が終了...

今回は上記の通りでグループメンバーに救われた事もあり徹夜してまで云々と言うのはなかったものの、最終提出日の夕方までどっぷり作業をし、メンバーとwhatsappやteamsでチャットをしながらローカル環境依存等で生じる細かい問題を解決してゆき、提出とあいまった。最後の方で少し時間ができたので、グループチャット機能をTalkJSを用いて実装、授業ではビデオ講座のみの付録での取り扱いであったgoogle authenticationの導入をする等、最後まで少しでも「まだベータ版みたいなものにせよ、出来るだけそれっぽい機能を搭載」する事で得点アップを狙う事に努めた。

IT5007のこの課題の提出が自身にとってはNUSの修士課程の最後の課題であり、提出した後は過去数年の蓄積した疲れやらなんやらの諸々で、比喩ではなく涙が溢れて来た。ラスボス倒した感...

まとめ:IT5007で学べる事

以上がIT5007の体験レポであった。個人的には、以下のような収穫があった。

*Git, Docker, Linux環境での作業、と言った面で不安感がなくなった。違和感なく作業出来るようになった。これは非常に重要な事であり、個人的に大きな成果であった。手取り足取り先生に教えて頂きながら実際にウェブアプリを作る過程で身体でこれらのスキルを覚えて行く、と言う貴重な機会となった。これは非コンピュータサイエンス出身者がコンピュータサイエンス側に足を踏み入れようと言う際には重要な内容であると感じていたし、大変に助かった。

*フロントエンド、バックエンド、両者を一貫してやるフルスタック開発、と言った事柄について、実際の手を使った地に足の付いた理解が出来るようになった。工程の全体像のイメージが湧くと共に、フロントエンド、バックエンド各々でどのようなエンジニア像が求められるか等の土地勘が付いた。

*javascript, html, cssに加えて、Node.js、React周りについて基本的な知識が付いた。MongoDB、NoSQLと言う辺りについても基本的な知識が付いた他、graphql周り、APIを用意してフロントエンド側に提供する事でクライアント側とサーバ側でやり取りをする、と言った辺りについても体感的に理解出来た。

*極々初歩ではあるが、Router, React Nativeによるスマホアプリ開発、google authentication等の外部APIを用いた機能拡充、と言った話題にも着手が出来た。

*一方で、自身がフロントエンドのエンジニアになろう、それでご飯を食べようと言うのは止めよう、これはこの分野に詳しい方にお任せにしよう、と言う割り切りが出来た。Reactで少し前のブログやstackoverflow等の内容がもう使えなくなっている等にも直面し、技術面の変化の速さを実感する事になった。また、慣れない状態でここに手を出すと、「ユーザ名、パスワード入れて、パーソナライズされたページを作る」みたいな、この講座を受ける前までは何でもないように感じていた初歩的な機能を実装するのにやたら労力と時間がかかる事を痛感した。専門家へのリスペクトと共に、餅は餅屋にお願いしようと言う気分になった。外部にお願いする際に、ある程度自分の側でこうして一連の経験がある、コードを見て何をしているかは分かると言うのは役に立つであろうと思われる。

最終的な成績については、幸いにもA-を頂く事が出来た。

授業の進行、ややオーガナイズされていない面も感じた点については、次のセメスターからは恐らく今回のセメスターを踏まえて改善されているはずである。また、この手の内容は座学よりも実際にモノを企画して作り提出すると言う過程を経る、その際に先生が付いていてくれて困った際にアドバイスをくれると言う環境で修行する事自体が非常に重要であるとも思われる。上述のような点を身に付けたいと感じられるかたにはお勧め出来る講座であると個人的には感じている。



この記事が気に入ったらサポートをしてみませんか?