フレームワーク

当てる方法はいくつかある。 従来のHTML＋CSS形式 classを設定してスタイルを適用する。 ただしclassが予約語のため使用できない。JSX中ではclassをclassNameと記述すればclassとして適用され […]

State React.Componentで状態データを保持する変数。オブジェクトとして様々な値を持たせることができる。 setState()というメソッドを用いてプロパティを変更すると、その変更を検知して再レンダリング […]

ソースの一部を切り出してコンポーネント化することができる。 切り出し前ファイル 例として以下のソースからLayoutクラスを切り出して別ファイルにする。 コンポーネント用のファイルを作成。 コマンドで書いたけど普通にFi […]

JSX ReactではhtmlをJSXでjs内に記述する。 複数のタグを最上位に記述することはできない。以下の記述はエラーとなる。 以下のようにラップするタグがあって、それが一つであればOK 変数、数式、関数などを{}で […]

下記ページを参考にまずはチュートリアル ほとんど参考サイトそのままになるが、記録のためにターミナルから入力した操作を転記。 下準備 フォルダ作成 react-turotrialというフォルダを作成し、その中にsrc/js […]

vue-slickにスライドの一つとしてyoutubeを埋め込む方法 動いたソースの必要箇所抜粋 実際に使用しているソースからの抜粋。 保存された画像一覧からデータを読み出してslickで展開する処理の一番うしろにyou […]

instagramの情報をスクレイピングして自動で整理できないかと目論んで、調べてみた。 結果としてinstagramのウェブページからはスクレイピングはできなかったが、スクレイピングの手法だけでもメモとして残す。 Nu […]

Nuxt.jsでLightBoxを実装 vue-image-lightboxを使用。 インストール plugins /pluginsフォルダ下にインポート用のjsファイルを作成する。 なおこの時点でvue-image-l […]

画像はassetsとstaticに置くことができる。 assetsにおいた画像はwebpackに含められてbuildされるので、容量の大きなものは向かない。アイコンとか飾り程度向き。 写真など、普通にコンテンツとして画像 […]

Nuxtのプロジェクト作成時にUIフレームワークを選択できるが、Vuetifyはその選択肢に含まれているのでcreate-nuxt-appの実行時に選べばそのまま使えるはず。 ? UI framework: Vuetif […]