カテゴリー: 未分類

昨日、宣言したAngularのサーバ側のExpress化は、朝からハマってしまい、１日かけてやっと終わりました。少しの修正なんですがTypeScriptの基本知識がないのが響き、１日作業になってしまいました。基本は大事ですね。そのうちTypeScriptの基本もやろうと思います。メニュー＞分室＞分室：Angular に動くものをおいてあります。

さて、来週は、MongoDBを入れてExpress→MongoDBとつなぐか、Angularをさらにやるか、どちらかやろうと思います。

明日は、Angular日本語ドキュメンテーションのサンプルを改良して、サーバ側をExpress化して、できればMongoDB化にチャレンジしてみようと思う。このサイトにアップするまでいけたら最高ですね。

Angularに触れてMEANというスタックを知りました。

今までいくつかスタックを試してきて、大抵は「やはりLAMPがベスト」となっていたのですが、Angularを中心に考えるとNodeがすでにあるので、その上で動くExpressでサーバ処理を作ることにすれば、環境準備は簡単で、しかも、基本言語がJavaScriptと同じにすることができます。なるほど、これはいいですね。DBはMongoDBでRDBMSの汎用性はないのが気になりますが設計・使い方次第ですね。

私はLAMPが好きですが、それと同じぐらいMEANも好きになりそうです。（2020/5/6 追記 評価は早すぎました。AngularはTypeScriptで書くので、ブラウザに表示する最終ソースまで遠い。そのため、原因特定にひと手間かかり、ブラウザに表示される最終ソースまでたどり着くのが大変です。部品化できるので分担して開発するにはいいのですが、世にあるサンプルを試しつつ小さく始めて良さそうなら、そのまま発展してくことができるのが無駄がなくよいとおもう。それがReactやVueといった人気があるフレームワークなのか、はたまたピュアJavaScript、結局はjQueryがいいとなるかもしれない。試しながら考えてこうと思う。）

環境構築のコマンドはこのぐらいです。（詳細はネットで検索）
apt-get install -y nodejs npm //nodeとnpm OSにより異なる
npm install -g @angular/cli //Angular
npm install express　//Express
npm install –save mongodb //MongDB
＋
VSCode

うちの中３の息子がパソコンを触ってるので、いつものレポートだろうと思っていたら、夕飯前に見てほしいというので、覗いたら「Desmos」という数式を打ち込むとグラフにするサイトを開いてて、「ピッチャーが投げて、ホームランするまでを、時間とともに動くの作った」と見せてくれた。ボールの大きさ、マウント、スタンド等の距離も正確に再現とのこと。

メニュー＞いろいろ＞数式でホームラン　から実物見れます。
遷移先の左で「t」の左にある再生マークをクリックすると赤い点が動き始めます。

「ピッチャー振りかぶって第一級ーーー投げました。カキーン。打ったーーーーーーホームラン。」というナレーションが聞こえてきそうです。

Angularになれるため、今日もAngularでコーディングです。
良い例題がないかとあさっていたらAngularの日本語サイトに「MyStore」という例題があったので、これを作ってみることにしました。
書いてある通りに作っていくと少し躓くところがありましたが、これまでのちょっとした経験も役立にたったようでバグ取りは少し早くなった気がします。
明日は、もう一度「とほほAngular入門」をコーディングしながら、１つ１つの復習をしてみようかと思います。
私には「習うより慣れろ」が合うみたいで、何度もやって手に覚えさせようと思います。
メニュー＞分室＞分室：Angular に動くものをおいてあります。

TV会議（Janus）の画面を利用シーンにあったUI/UXにしていきたい。
いまどきAngular、Vue、Reactがよさそうなので、このうち、私が他でも使いそうなAngularで作ることにしました。
１年前に購入してさっと読んだ「AngularWebアプリ開発スタートブック　大澤文考さん」を引っ張り出して一通り試し、昔からお世話になってる「とほほWWW入門のAngular入門」の例題を一通り試してみました。
シングルページアプリケーションのぬるぬる動くことに感動し、いまどきは、Angularでここまで構造化した開発ができることに感動しまくりです。
ただ、構造化した反面、応用しようと思うと、結構つまづきそうなので、しっかり理解するために、もう２週間ぐらいいろいろ試してみようと思います。

メニュー＞分室＞分室：Angular に動くものをおいてあります。

いまだに「お問い合わせ」がテンプレのままだったことに気づき改修してみました。

iframeで上に透過のcanvasレイアを貼りそのレイアへ蛍光ペンで落書きする仕組みです。iframeなので挙動は安定しないものの、既存ページの変更が不要なのがよいですね。安定させたいなら、既存ページへ埋め込みが◎

• JupyterHub+Labで、データ加工・分析できる環境を整えよう。

• ホームページを作ろう。
• Twitterアカウントを作ろう。
• Web会議を作ろう。