大学をドロップアウトしても学士号を取りたい貴方へ

FUN Advent Calendar 2018 12/13の記事です。
昨日ははくすけニキの業務用ルーターのすゝめでした。
クソルーター使っててすまんの


お疲れ様です。不知火ぬいです。
去年は技術ネタを書きましたが今回は大学生活ネタ(?)です

書く事が見つかなくて泣きそうでしたがようやくネタが見つかったのです。

後半はポエムです。

自己紹介

不知火ぬい/病弱系幼女の不知火ちゃん(@shirasayav5)です。Twitterに生息する幼女です。
学年はundefinedですが2017年4月入学です。
一応C#の人と認識される事が多いですが、最近はDockerやAnsible等のインフラ方面に興味があるつもりです。

この記事で書く事

ある日、何らかの事情で大学から離れたいと思う事があるのでは無いでしょうか。
どうしても特定の分野の単位が取れない、やる気が迷子になった、大学と合わない、家庭の事情が急変して大学を辞めざるを得なくなったetcetc......

それでも、大学や大学院で研究したい、あるいは就職しつつ勉強を続けたい。そう思っている人もいるのでは無いでしょうか。

そこで本記事では、未来大のような全日制大学を退学した後に、学士号を取る方法を主に2つ程紹介したいと思います。

この記事で書かない事

お金が無いと単位は取れません……
ですがこの記事ではお金の稼ぎ方や就職の仕方等は書きません。ご了承下さい。

全日制大学ドロップアウト後に学位を取る方法

  1. 他の全日制大学に転入する
  2. 放送大学に転入する
  3. 大学改革支援・学位授与機構の単位積み上げ型の学士の学位授与制度を使い、学士号を取得する

私が知っている範囲だとこの3つです。他にもあるかもですが……

1. 他の大学に転入する

私、転校生です!みたいな感じです。
ご自分でお好きな大学を見つけて下さい。

2. 放送大学に転入する

概要

放送大学とは所謂通信制の大学です。
ここで全科履修生として入学し、124単位を取得する事で、学士(教養)の学位を取得する事が出来ます。

入学

高校を卒業しているならば、入学に際し特に制限等はありません。入学試験なるものもありません。お金を振り込めば入学できます。ちなみに中卒でも条件を満たせば入学出来ます。

放送大学には6つのコースがあり、その中の1つに情報コースがあります。

入学時にコースを選択する事になり、卒業には入学時に選んだコースから34単位以上を取得しなければいけません。その他にも卒業要件があります

ただ、かなり自由に自分の取得したい科目を選ぶ事が出来るという印象です。
なので、「ひたすら情報系を学びたい!」というのもアリですし、「色んな学問分野を少しずつ触ってみたい!」というのも出来ると思います。 このように、非常に科目履修の自由度が高い事が特徴です。

入学後

入学後、どのように講義を受けるかですが、放送大学の科目の多くを占める放送授業では、自分の好きな時間に好きな場所でスマホやPCで講義を受ける事が出来ます。

学期中間に、Web上や送られてきたマークシートで解答する通信指導というものと、学期末に日本各地にある放送大学の学習センターやブランチ試験場等に赴きテストを受ける、単位認定試験というものがあります。
単位認定試験で6割以上正解すれば単位が認定されます。
単位が貰えるかどうかはこの単位認定試験のみで判定されます。

科目によってはインターネット上で課題を解いたり討論に参加する、「オンライン授業」、学習センター等に赴き受講する、「面接授業」という形式を取っている場合もあります。

このように、非常に選択肢が広い大学です。

ただ、かと言って簡単に卒業できるかというとそういう訳でも無く、講義を見て内容をしっかり理解しないと解けない程度には試験の難易度は高いです。

雑感

私は現在科目履修生として、お試しで3科目履修しています。 いつでもどこでも講義を受ける事が出来るので、体調が優れない時は無理に受ける必要もなく、病弱系幼女としては嬉しい限りです。

未来大学事務局に問い合わせた所、未来大では他大学への科目履修生として入学は特に制限しないという事なので、未来大を続けるか迷っている方は一度休学して放送大学を試してみる、というのもありなのでは無いでしょうか。

ちなみに4年間放送大学で学び続けた際にかかる費用は70万円程度です。未来大は大体230万なので非常に安いのです。

尚、未来大学との相互単位認定はありません。編入学すれば一定の条件の元、未来大学で取得した単位を引き継げます。

3. 学位授与機構の学位授与制度を利用する

放送大学、非常に魅力的なのですが、貰える学位が学士(教養)のみです。単科大学なのでそれはそうなのですが……

あるいは、「未来大の2〜4年の講義を受けたいけど、2年生の進級条件を満たせない……」という方もいるのでは無いでしょうか?

そんな方には、大学改革支援・学位授与機構の制度があります。

さて、この学位授与機構の学位授与制度ですが、

  • 一定の資格を持つ人が
  • 科目等履修生制度等を用いて一定の単位を取得し、
  • その後学修成果(主にレポート)を提出し、
  • 更に4月と10月に行われる試験(小論文)を合格する事により
  • 学位を認定される

という制度です。

では一つずつ見ていきましょう

学位授与制度の基礎資格

学位授与制度には、前提条件として基礎資格が必要です
参考URLはこちら→ https://www.niad.ac.jp/n_gakui/tsumiage/degree_awards_system/1174157_845.html
短大、高専、専門学校を卒業した人、未来大だと3年次に編入学して来た民ですかね。
あるいは、「大学の学生として2年以上在学し62単位以上を修得した者」が主な条件になっています。未来大に1年からいる民はこの条件に当てはまらなければなりません。

未来大で1年次にドロップアウトした人は、放送大学等に転入する事でこの条件を満たさなければなりません。

単位取得

条件を満たした人は、学士号取得の為に全日制の大学に在籍する必要はありません。(そもそも学部生/全科履修生に在籍中はこの制度は使えない)
新しい学士への途」 から好きな専攻を選び、好きな大学等へ行って、科目等履修生として所定の単位(基礎資格等と全て合わせて124単位以上)を取得して下さい。

未来大生が興味を持ちそうな専攻は、理学の「数学・情報系」と工学の「情報工学」、「社会システム工学」でしょうか?

2018年12月18日追記
気になったので学位授与機構に電話で問い合わせたのですが、学位授与制度では、
基礎資格を得た後に科目等履修生として科目履修をする事が求められている
との事です。
なので、未来大を1年でドロップアウトした民は、次の年に科目等履修生で単位履修をしても意味がありません。
基礎資格を得てから科目等履修生制度を用いて単位を取得して下さい。

学修成果の作成

選んだ専攻に合ったテーマについてレポートを書きます。卒業論文みたいな物でしょうか?
10〜17ページ、文字数的には12000〜20400文字が必要なようですね。

試験

東京or大阪で試験を受けます。内容は小論文で、レポートの内容に関連した問題が各自出されるそうです。
オンリーワンな問題とか試験作る人大変そう(こなみ)

単位認定

試験に合格し、修得単位の審査も通った場合に学士号が授与されます。

雑感

このように科目等履修生として大学を続け、学位授与制度を利用して学位を貰う事が出来ます。 未来大も科目等履修生の制度はあるので、2年生進級の壁を強引に突破して、自分の興味のある科目をひたすら取得する、という道があります。

尚、未来大で科目等履修生として62単位を2年間かけて取得するには、最低1,072,280円かかる計算です。間違ってたら申し訳ない。参考資料はこちら→ https://www.fun.ac.jp/department/entrance_info/graduate_exam_applicants/

コスパ的に考えると放送大学単体の方が安いのですが、未来大というスペースの中で得られる経験や人脈は貴重な物ですし、その辺は考え方次第……でしょうか。

終わりに

私の周りに「2年生に上がれない」や、「大学つらい……辞めたい……」とTwitterにツイートしている民がいたので、少し前に調べた事をまとめてみました。
皆さんの進路選択に少しでも役立てば幸いです。
この文章を見て頂きありがとうございました。お疲れ様でした。
明日は_n_elさん(Daisenニキ)です。



ここからのお話

……お疲れ様です。不知火ぬいです。
ここからはポエムです。
電子の海(主にTwitter)に生息する「なんとか系幼女の不知火ちゃん / 不知火ぬい / 不知火さやか」では無く、1人の現実世界に生息する人間として、1人の未来大生としての、これまでの事を無限に羅列していこうかと思っています。
多分私は今回のAdvent Calenderが最後の参加となる気がします。なので書きたい事を書いて去ろうかなという魂胆です。

自己紹介

不知火ぬいです。2017年入学、留年して休学なので現在も書類上1年生です。
例え復帰するとしても2019年4月にもう1度1年生、卒業は2023年3月でしょうか?
2019年3月に大学を辞める可能性が高いですがまだ確定では無いのです。

数学について

先によく聞かれる質問について答えておきますね。
どうして数学できないなら人に聞かないの?

私は未来大あるあるの、「情報系は同期より知識があるけど、数学は全く出来ない」の典型的な例だと思っています。
そしてそのようなタイプの方が進級できている人と出来ていない人の差は大体、「プログラミング教えてあげるから数学教えて!」を出来ているか否か、だと思います。
私の場合は出来ていないので進級できていないのです。

出来なかった理由なのですが、「自分が何も知らなすぎて人に教えて貰うのが非常に申し訳無い……人の時間を無駄に浪費してしまう……ごめんなさい……1人でガンバリマス……ガンバリマス……」という思考に陥ったからです。
1人でガンバリマスが出来ていないので留年したのですが

「人に教えてもらうのが申し訳ない、人の時間を奪ってはいけない」という私の強い思考はどこから来ているのでしょうね……

2012年くらい?

中学生の頃、登校拒否して「私は普通の子じゃない!精神科連れて行って!」って泣き叫んだ記憶があります。
親からも、家に来た担任からも「君は普通の子だよ」と言われましたが、どこかズレた感覚がありました。
その感覚をちゃんと言語化出来たのは2018年に入ってからだと思います。

2014年

高校に入りました。普通科では無いのです。

2015年

プログラミングなるものを授業で習いました。
色々あって新聞に載ったりしたのですが、その件でSITの人にめっさ申し訳無さを感じているのです……
SITの方々の方が凄いのに、それを通り越して私が新聞に載った、という事があったのです……

2016年

高3です。基本情報を取りました。大学入試後に応用情報も取りました。
進路どうしようかな、と思っていましたが、情報系の分野に興味があって、大学で研究とかしてみたいな、みたなふんわりとした進路希望がありました。そこで、高校の教員に未来大をおすすめされました。
札幌圏の某情報系私立大学とか、専門学校も考えたんですけどね。でも未来大のオープンキャンパスが一番楽しかったので。
インタラクティブ展示でラズパイを用いたバックエンドについて先輩と議論した記憶があります。
で、未来大の入試を受けました。
AO入試です。選択は情報科学
筆記試験の為のお勉強は特にしていないのです……他の人に申し訳無いのです……。
皆さんが受験勉強を必死にしている中、私は何もせず大学に受かり、自動車学校に通っていたのですから……
ある意味今現在の状況は非常に正しいと思うのです。

2017年

未来大に入ったのです。
未来大1年で一番印象に残っている講義は科学技術リテラシです。自分の好きな分野をまとめるだけで単位貰えるなんて、なんて幸せなんでしょう。

未来大楽しいのです!

……という事にはならず、
…………初回から解析学の講義で何を言っているのか分かりませんでした。
今でも分かっていません。あの教員は何を言っているのか、試験では何を求められるのか。
何も分からない。ただホワイトボードに書かれた、見た事も無い記号をひたすらノートに書き写す日々。
あのようなアルファベットの書き方見た事無いし、記号の意味する事も分からないのです
「d」「h」がしばらく読めなくて何の数学記号だろう……って思っていたのです。

数ⅡB・数Ⅲ講習はちゃんと行きました。行きましたがやっぱり分からないのです。習った事前提の講習なのでずっと頭の上にハテナマークがあったのです。

流石にやばいと思ったので何人かの人に基礎から教えて貰う事にしました。

ですが結果は前述した通りで、人に教えてもらうのが非常に申し訳無くなりました。
それ以来、数学がかなりトラウマになり、数学記号を見るだけで泣き出しそうになりました。

前期中間辺りの時点でかなり精神的に死んでしまい、7月以降ほとんど大学に行っていませんでした。
教養科目もほとんど落としているので、1年間大学に通学して取得した単位数は10くらいでしょうか?

後期は何をしていたかというと、C言語だけは単位を取りましたが、基本的にお家にずっと引きこもっていました。
大学行っても学べる事が無いし、精神的に少しでも楽な所にいました。

2018年

お金が無くなったのでアルバイトをしていました。
プログラミング系のアルバイトをしています。私のやりたい分野とは少し離れてしまっていますが。
ですが、気分が悪くて寝込んでしまい、頻繁にアルバイトをお休みしてたりします。

後は実家に帰って費用を節約したりとかしていました。
実家にいる間に、「今後どうしよう……。未来大に戻るのは……うーん……でも学位取って研究したいしな……」とぼんやり考えていたので、大学ドロップアウト後に学位を取る手段とかを調べていました。
そこで学位授与制度と放送大を知りました。

という訳で早速2018年10月に放送大の科目履修生として入学して、基礎科目の勉強をしています。

ただ、数学系の基礎科目を取ったのですが、数学に拒絶反応を起こして以来中学数学以降の知識が無くなっており、研究室で先輩方に教えて貰った後に2日間寝込んだ、みたいな事がありました。
どうしても数学の単位は取れないのです……

あと、2018年7月に札幌の精神科でうつ病ADHDの診断を受けました。
私が2012年頃に受けた「なんか人と違う」感は発達障害という事で言語化されました。
人の気持ちが全く読み取れないのでADHDASDなのでは……と疑っています。

これから

今のバイト先に、事実上2019年1月末に解雇する事を宣告されたので、生活費が無いのです。
ですが現状就活とかはほぼしていないのです。うつ病の病状を和らげないとどうしても動けないのです……
お家にいる時は大体ぐったりしています。

元気になったら就職とかしようかな……とか思っていますが、未来大のプロジェクト学習とかいくつか興味のある科目があるので、科目等履修生として未来大で学びたいな……と思っていたりもします。
放送大の全科履修生として単位を稼ぎつつ、未来大で興味のある分野だけを学びたいな……と思っています。
数学出来ない奴が情報系の研究なんか出来る訳無いだろ!と言われてしまえばそれはそうなんですけどね……
それに生活費や学費が無いし、稼ぐ能力にも乏しいのであまり現実的では無いのです
……

私の将来、どうなっていくんでしょうね……

2018年12月18日追記
科目等履修生として未来大に残る説を多少考えていたのですが、
単位数的に私が学位授与制度の基礎資格を満たすのは2020年以降になる可能性が高いです。 その為、2019年4月以降に科目等履修生として未来大で学んでも学士号には繋がりません。
学費や生活費等の関係で非常に現実味が薄い中、更に学士号にも結びつかない単位を修得するのは非常に絶望的かと思います。
予定通り2019年4月以降は未来大から離れる事になると思います。

発達障害についての考察

ADHDの異常な不注意・多動性・衝動性、ASDのコミュニケーション能力の低さやこだわり。
割と当てはまる事が多いのです…… ADHDは既に診断を貰っていますし、ASDのAQスコアの結果もかなりASDの可能性が高い数値だったのです……

「人に教えてもらうのが申し訳ない、人の時間を奪ってはいけない」という私の強い思考、発達障害方面から来ているのかなあ……と少し考察をしています。

「人に迷惑をかけてはいけない」という教えを頑なに守っていて、こだわりが強いというASDの特徴から来ているのかな……と、少し考えています。

それ以外にも私は人よりこだわりが強いな……と思う事が多くて、技術系もこの分野しかやらないぞ!みたいなこだわりが強くて、違う分野をやらされそうになった前のアルバイト先を辞めた、みたいな事がありました。

雑感

バイト先の上司に「世の中数百万人の人が出来る事をお前に出来ない訳がない。大学くらい卒業して見せろ。そうじゃなきゃお前を認めない(意訳)」 と言われたのですが、世の中の普通の人とは前提条件が全然違う(発達障害だったり、うつ病だったり……)のに比較できないんだよなあ……とか思っていました……
逃げているだけと言われればそれだけなんですが……

ほんとのさいごに

あの……見て頂きありがとうございましたなのです。
私が未来大で感じた事を少しまとめてみました。
まとまってないですが……

未来大生、なんだかんだ言いつつ大学楽しそうだな、というのを遠目に眺めている生活をしています。 未来大で得られる知識や経験は貴重な物……だと思います。
私のように途中でドロップアウトせず、未来大を卒業して就職なり院進なり出来るのが一番だな……と思います。

お疲れ様でした

ASP .NET Core + SignalR + p5.jsを使ってホワイトボードを作ってみるお話

2018年12月12日追記
この記事は2017年12月10日にGitHub Pagesに投稿した記事を一部追記した上で再投稿したものです。 この記事は2017年12月時点の情報を元に書かれています。
実際にSignalR等を使用する際は、必ず最新の情報を元に使用して下さい


この記事は、FUN Advent Calendar 2017 10日目の記事です。

概要 最近リリースされたASP .NET Core用の双方向通信ライブラリ「SignalR」の紹介の為、本学生なら一度は触っている「Processing」をJavaScriptに移植した「p5.js」を使って簡単なWebホワイトボードを作ってみます。

自己紹介

今回作るもの

  • オンラインホワイトボード
  • サイトを開いている人が全員同じ絵を見たり書き込んだり出来る
  • 超超簡易Realtime Board的な物
  • 双方向通信ライブラリにASP .NET Core SignalRを使う
  • 画面描画ライブラリにp5.jsを使う

尚、実装の簡易化の為、絵については「1つ前のフレームのマウス座標から現在のフレームのマウス座標まで直線を引いた物」とします。

今回使う技術について

全てMicrosoft社製のオープンソースライブラリです

.NET Core

  • クロスプラットフォームで.NETの開発・実行環境。
  • MacLinuxではコンソールアプリしか作れない為サーバーサイドの利用が多い。
  • 最新のメジャーバージョンである、2.0リリースは2017年8月14日

ASP .NET Core

  • .NET Core上で動くオープンソースのWebフレームワーク。
  • ASP .NETの.NET Coreへの移植版。
  • もちろんLinuxでも動く。もちろんDockerコンテナもあるよ (容量大きい……大きくない?)
  • 最近のメジャーアップデートである、バージョン2.0リリースは2017年8月14日(.NET Coreと連動)

ASP .NET Core SignalR

  • ASP .NET Core上で動く、クライアントとサーバーとの双方向通信ライブラリ
  • ASP .NET SignalRの移植版
  • WebSocketsやServer-Sent Events、ロングポーリング等をラップして、最適な物を用いて双方向通信を行う
  • RPCスタイルのAPIを採用しているのが特徴
  • サーバーとクライアントがそれぞれメソッドを持っていて、相互に呼び出しているイメージ
  • サーバーにC#やF#等、クライアントにJavaScriptC#等を使う事が出来る
  • 現在アルファ版段階で、最新版リリースは2017年9月14日

2018年12月12日追記
2018年5月30日にリリースされた.NET Core 2.1よりSignalRの正式版がリリースされています
現在の最新は2018年12月4日にリリースされた.NET Core /ASP .NET Core 2.2です

環境構築

.NET Coreを入れてみる

https://github.com/dotnet/core/blob/master/release-notes/download-archive.md
ここから最新のバージョンを選択、お使いのOSの通りにインストールしてください。
Arch Linuxをお使いの方はAURにdotnet-sdk-2.0があるので、yaourtかなんかで入れて下さい。
Community入りして欲しいなぁ(願望)
2018年12月12日追記
2018年に入ってからCommunity入りしています

一応Hello Worldしてみる

$ mkdir helloworld_dotnet
$ cd helloworld_dotnet
$ dotnet new console
$ dotnet run

Hello Wolrdが表示されればおっけーです

Webのテンプレを用意する

適当なフォルダにて

$ mkdir whiteboard_signalr
$ cd whiteboard_signalr
$ dotnet new web

dotnet newでテンプレートを用いてプロジェクトを作ってくれます。
今回はSingalRだけ使うので空のASP .NET Coreテンプレートを示すwebで十分です。

SignalRライブラリを入れる

.NETではライブラリ管理にnugetを用います。
.NET CoreではCLIで管理できるようになっています。
というわけでサクッと双方向通信ライブラリ、SignalRを追加しましょう

dotnet add package Microsoft.AspNetCore.SignalR --version 1.0.0-alpha2-final

2018年12月12日追記
バージョンが古いので、最新バージョンをご確認の上実行して下さい

実際に作ってみる(クライアントサイド・画面描画編)

$ cd wwwroot

wwwrootフォルダに移動して、そこで好きなエディタを使って書いて下さい

p5.jsを使ってホワイトボードを作ってみる

とりあえず下地となるHTMLファイルを作ります

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- ↓SignalR↓ -->
    <script type="text/javascript" src="signalr-client-1.0.0-alpha2-final.min.js"></script>
    <!-- ↓p5.js↓ -->
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.16/p5.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.16/addons/p5.dom.min.js"></script>
    <!-- ↓これから書くスクリプト↓ -->
    <script type="text/javascript" src="sketch.js"></script>
    <title>Whiteboard_signalr_p5</title>
</head>

<body>
<!-- ※今回はp5.jsでcanvasを作ります-->
</body>

</html>

ホワイトボードを実装してみます

function setup(){
    createCanvas(640, 480); //Canvas作る
    rect(0, 0, 639, 479); //Canvasの枠線
    frameRate(30); //フレームレートを下げる
    strokeWeight(3); //線を太くする
}
let past_x = 0; //1つ前のフレーム時のマウスのX座標
let past_y = 0; //1つ前のフレーム時のマウスのY座標

function draw(){
    if (mouseIsPressed){
        drawLineonSelf(); //マウスが押されている間描画
        past_x = mouseX;
        past_y = mouseY;
    }
}
function mousePressed(){
    past_x = mouseX;
    past_y = mouseY;
}
function drawLineonSelf(){
    //1つ前のフレーム時の座標から、現在のフレーム時のマウス座標まで、直線を書く
    if (past_x != mouseX || past_y != mouseY){
        line(mouseX, mouseY, past_x, past_y);
    }
}

これでお絵かきするキャンバスが出来ました。
ファイルを開いてマウスドラッグするとお絵かき出来ます

f:id:shiranuisayakanet:20181212223755p:plain
キャンパス完成

実際に作ってみる(サーバーサイド)

Hubを定義する

HubはSignalRにおいて、APIのエンドポイントであり、何か処理をしてクライアントのメソッドを呼び出すサーバーとなる物です
(良い説明が思い浮かばない……。Microsoftのドキュメントには 「Provides methods that communicate with SignalR connections that connected to a Hub」とあります)

今回は、「接続しているクライアントに、お絵かき中の(マウスドラッグしている)クライアントから『1つ前のフレーム時のマウス座標と現在のマウス座標』を受信し、他のクライアントにブロードキャストするHub」を定義します。

whiteboard_signalrフォルダに移動して、適当に新規作成して下さい

using System.Collections.Generic;
using System.Threading.Tasks;
using Microsoft.AspNetCore.SignalR;
namespace whiteboard_signalr
{
    public class WhiteboardHub : Hub //Hubクラスを継承しています
    {
        public Task Draw_Server(int prevX, int prevY, int currentX, int currentY)
        {
            // 送ってきたクライアント以外のクライアントに、データを送信します
            // this.Context.ConnectionIdがリクエストを送ってきたクライアントです
            
            // InvokeAsync(string: クライアントのメソッド名, object:送るデータ)
            return Clients.AllExcept(new List<string> { this.Context.ConnectionId }).InvokeAsync("draw_client", prevX, prevY, currentX, currentY);
        }
    }
}

後はStartup.csにSignalRを使う設定を書き足すだけ

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.Extensions.DependencyInjection;

namespace whiteboard_signalr
{
    public class Startup
    {
        public void ConfigureServices(IServiceCollection services)
        {
            services.AddSignalR(); //追加
        }

        public void Configure(IApplicationBuilder app, IHostingEnvironment env)
            {
                if (env.IsDevelopment())
                {
                    app.UseDeveloperExceptionPage();
                }
                app.UseFileServer(); //静的ファイルを配信する用。wwwrootディレクトリにあるファイルをルーティングしてくれる
                app.UseSignalR(routes => //追加
                {
                    routes.MapHub<WhiteboardHub>("draw");
                });
            }
    }
}

実際に作ってみる(クライアントサイド・双方向通信編)

SignalRのJSクライアントライブラリを入手する

npmで配信されているSignalRのクライアントライブラリを入手します
適当なフォルダにて

$ npm install @aspnet/signalr-client

node_modules/@aspnet/signalr-client/dist/browser/signalr-client-1.0.0-alpha2-final.min.jsがSignalRのJSクライアントなので、プロジェクトフォルダのwwwrootにコピーして下さい

SignalRのJSクライアントライブラリを使ってみる

let connection;
function setup() {
    createCanvas(640, 480);
    rect(0, 0, 639, 479);
    frameRate(30);
    strokeWeight(3);
    // ↓追加↓
    connection = new signalR.HubConnection('/draw');
    //↓クライアントのdraw_clientメソッドの定義。draw_clientメソッドでメッセージが来たら実行する
    connection.on('draw_client', function (prev_x, prev_y, x, y) {
        line(prev_x, prev_y, x, y)
    });
    connection.start(); //接続開始
    // ↑ここまで↑
}
let past_x = 0;
let past_y = 0;

function draw() {
    if (mouseIsPressed) {
        drawLineonSelf();
        past_x = mouseX;
        past_y = mouseY;
    }
}
function mousePressed() {
    past_x = mouseX;
    past_y = mouseY;
}
function drawLineonSelf() {
    if (past_x != mouseX || past_y != mouseY) {
        line(mouseX, mouseY, past_x, past_y);
        //サーバーのdraw_serverメソッドを呼び出します
        connection.invoke('draw_server', past_x, past_y, mouseX, mouseY);
    }
}

動かしてみる

これで完成です。実際にブラウザを2つ立ち上げて、localhost:5000にアクセスし、キャンバスの中でマウスドラッグしてお絵描きしてみると、ほぼ同時にもう片方に反映されると思います。

f:id:shiranuisayakanet:20181212223846p:plain
大体完成

終わりに

SignalRを使う事で、簡単に双方向通信を書く事が出来ました。
今回の記事で書いたソースコードこちらにあります。

もちろんASP .NET Coreは双方向通信ライブラリだけではなく、MVC用のルーティングやビューを作ってくれるライブラリ、認証ライブラリ等様々なライブラリがMicrosoftによって作られています。

ASP .NET Coreのリリースにより以前よりぐっとサーバーサイドC#の可能性が広がりました。
この記事をきっかけに、サーバーサイドC#の世界に興味がある方が1人でもいれば幸いです。
みんなC#をやろう(提案)

おまけ

今回作ったサンプルは機能が少なくて寂しいので、

  • 書いたデータをORマッパーを使いDBに保存する
  • 接続時にデータを渡す
  • 消去ボタンを追加する

の機能を加えたちょっと改良版をGitHubおよびshiranuisayaka.netに公開しています。よろしければそちらでも遊んでみて下さい

2018年12月12日追記
サーバーを再構成中につき停止しています。
また、GitHubソースコードには現在Security Alertが出ています
余裕がある時に修正しますが、このソースコードを使用する際は、ライブラリのバージョンを上げて使用する事をお勧めします

明日はichiren1さんです