概要
最近Tauriを使いアプリを作りたいと躍起になっている。
Rustも触ったことなかったので勉強し、いざ少しでもアプリを作ってみようとしたが、WEBアプリの知識も必要だということに気がついた。
HTMLなんて10年以上昔にFC2ブログをやっていた時以来触ってもいないため、全然わからない。
JavaScriptやTypeScriptなんて名前は良く聞くけど実際どういうものかもよくわからない。
こんな状況から色々勉強していくので、「何をどう学んだか」ということを残し、誰かの役に立つことを願いつつ自分がやったことを可視化して達成感を得るためのメモ書き記事。それがこれ。
HTMLの知識
HTMLの<p>とか<div>とかなんぞや?
初めてHTML見た時に思った疑問に答えてくれる。
全てのタグを網羅しているわけではないが、良くみるやつは大体書いてある。
サンプルコードとこのサイトを行き来して読み進めていく。
HTMLのヘッダーにあるviewportってなに？
responsiveなサイトを作る時とかに便利だということはわかった。
気になるから調べたけど、まだそこまで気にしないで良さそう。
ヘッダーの順番って関係あるの?
基本的になさそう。可読性が大事?
scriptやCSSは後読みのほうが優先とかなんとかあるらしい。
HTMLのidとclassを使い分ける基準は?
classが大枠でidが単一要素らしい。
CSSとかJavaScriptで参照するときにつかうんだってさ。
CSSの知識
そもそもCSSってなんで必要なの?
「HTMLにデザインをあててオシャレにするため」
HTMLに要素をどんどん増やしても、これがないとほぼplain textのような見た目になる。
以下のサイトにCSSの有り無し比較画像があるが、デザインの大切さを感じた。
このサイトめっちゃわかりやすくて大好き。
構文を知りたい
要素の幅を設定したいけど長さの単位がたくさんあってわからない
単位多すぎない?
今でも使い分けをどうしたらいいかわからないけど、とりあえず知識としては持っておく。
ボタンを横並びにしたい
CSSで実現しているということに感動した。HTMLじゃないんかい・・・
この辺りからCSSがいかに大切かが分かってきた。
TypeScript
そもそも何?
「型定義できるJavaScript」だそうです。
しかし自分はJavaScriptもわかりません。
JavaScript のごく一般的な用途は、(先ほど例示した) Document Object Model API を介して動的に HTML と CSS を変更し、ユーザーインターフェイスを更新することです。
HTMLとCSSって基本固定値だけど、JavaScriptを使うと動的に変更できるらしい。
ボタン押した時の挙動とかも設定できるらしいので、ここからバックエンドに繋げたりすることになるはず。
変数宣言
letとconstが使えれば良さそう。
!?
最近良く見るアイツ。
式の左辺で使うとエラーになったので注意。
async / await
非同期処理するための魔法の言葉。
Tauriのサンプルで良く見るので必須知識になりそう。
cast
コードをいじっていると頻繁に「型違うかもよ？」エラーが出てきた。
キャストするにも方法が2つあるらしいが、asを使う方が良いらしい。
〆
とりあえずはこの程度の知識でTauriのGUI部分を作れています。
本当はReactとかのフレームワーク使ったほうが良いとかあるかもだけど、まずは基礎を固めたい。
そもそもフレームワーク多くてどれが良いかわからない。