クモのようにコツコツと

フロントエンドエンジニア イイダリョウの技術ブログ。略称「クモコツ」

【React】クラスを使ったコンポーネントの書き方(React.Component、render()、super())

Reactの続きです。前回はコンポーネントでstyle属性や四則演算を設定しました。今回はクラスを使ってみます。Reactのコンポーネントでのクラスは、親クラスReact.Componentの継承、必須であるrender()メソッド、コンストラクタのsuper()、などの書き方があり…

【p5.js】Generative Design with p5.js「色 P_1_0_03」のコードを読み解く

p5.jsの続きです。前回は「Generative Design with p5.js」の色編の第二回でした。今回は3回目です。今回は円形に配置した色のスペクトル。three.jsの記事でやった三角関数が出てきます。それではいきましょう!

ブログの更新方針について(2020年4月版)

前回、ブログの更新方針を見直しました。その後、ブログの更新はコンスタントにできることができました。今回は、やりたいことのボリュームを俯瞰して並走テーマの更新頻度を見直しました。

【Express】静的HTMLファイルの表示(res.sendFile()、express.static())

Expressの続きです。前回はExpressをインストールしてハローワールドのテキストを表示しました。今回はHTMLを表示してみたく。res.send()でHTMLタグは表示。さらにres.sendFile()でHTMLファイル、express.static()で静的サイト全体を表示します。それではい…

【gulp】Sass(SCSS)以外のメタ言語をコンパイルするためフォルダ構成(src→dest)

gulpの続きです。前回はbrowser-syncでSass(SCSS)環境の自動リロードをしました。かなり楽になったので、Sass(SCSS)だけでなくAltJS(TypeScriptなど)やHTMLテンプレート(EJSなど)も一緒にコンパイルできるようフォルダ構成をsrc→destという形に変更しま…

【React】コンポーネントの属性値を読み込む(style、テキスト、四則演算)

Reactの続きです。前回はコンポーネントを事始めました。この時は一種類のテキストを読み込んで表示するのみでしたが、今回はstyle属性や四則演算の設定を追記して、コンポーネントのバリエーションを増やします。だんだんコンポーネントを使うメリットを感…

【Three.js】カメラ制御を実現している「三角関数」を理解する!(サイン、コサイン、タンジェント)

Three.jsの続きです。前回はジオメトリ設定で色々な形を作りました。今回はカメラの制御です。コードの理解のためには三角関数の理解が必要でした。サイン、コサイン、タンジェントとか聞き覚えはあったけど、それを使う目的はわかっていなかったです。それ…

Express事始め(インストール〜ハローワールドまで)

Expressの続きです。前回はExpressとJSフレームワークの違い、Expressの位置付けなどについて掘り下げました。その後、しばらくNode.jsを触っていましたが今回からExpressを触っていきます!まずはインストール〜ハローワールドまで。それでは行きましょう!

【gulp】browser-syncによる自動リロード(watch()の分離、defaultでSassと同時に実行)

gulpの続きです。前回はwatch()メソッドで自動コンパイルを体験しました。今回はもう一歩進んでブラウザも毎回リロードするのではなくファイルの修正→保存のたびにブラウザも自動リロードをしたく。「browser-sync」を使います。Sass(SCSS)コンパイルも同時…

【React】コンポーネント事始め(一文字目は大文字!)

Reactの続きです。前回はイベント属性を使ってみました。今回からはコンポーネント編に入ります。いよいよJSフレームワークっぽい内容になってきましたね。それではいきましょう!