クモのようにコツコツと

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

【p5.js】基本書式とsetup(キャンバス描画)、draw(四角、線、四角の原点) Coding Train(p5.js 1.3)

p5.jsの続きです。前回から、Dan先生のCoding trainのp5.js系の動画の副教材を目指してオンライン写経を始めました。今回は「1.3」。JSとp5.jsの基本書式。setup関数によるキャンバス描画、draw関数の中に四角や線を描いて四角の原点変更、という内容。それ…

【Vue.js】Vuetifyにパンくず、スライダー、タイル、アコーディオン、カレンダーを配置(v-carousel、v-carousel、v-card、v-expansion-panels、v-calendar)

Vue.jsの続きです。前回はVuetifyのヘッダー、フッターを配置してみました。今回はさらにいろんなパーツを配置してみます。パンくず(v-carousel)、スライダー(v-carousel)、タイル(v-card)、アコーディオン(v-expansion-panels)、カレンダー(v-cale…

【Tone.js】コード切り替えボタンと鍵盤の連携

Tone.jsの続きです。前回はコード切り替えボタンを設置しました。が、まだ鍵盤の音とは連携できていません。今回はその連携にチャレンジ。それではいきましょう!

【Vue.js】Vuetifyにヘッダー、フッターを配置(v-app-bar、v-footer)

Vue.jsの続きです。前回はボタンを配置してみました。今回はヘッダー、フッターを配置してみます。v-app-barとv-footerを使います。それではいきましょう!

【CSS】scroll-snapでスナップ(引っかかり)のあるスクロールがまったくカン・タン・だ!

CSS

スナップ(ひっかかり)のあるスクロールをするのに昔はJSを利用してましたが、CSSのscroll-snapだけでも実現できるようです。実際に作ってみたら、まったくカン・タン・だった。それではいきましょう!

【Vue.js】Vuetifyでボタンを並べてみる(v-app、v-content、v-container、v-layout、v-flex、v-btn)

Vue.jsの続きです。前回はVuetifyを事始めました。今回はもう少し進んで、ボタンを3つ並べてみました。v-layout、v-flex、v-btnなどを使いました。

【p5.js】楽しく学ぶ重要性:Coding Trainのダン先生に付いていく!(p5.js 1.1〜1.2)

p5.jsシリーズの続きです。前回、「Generative Design with p5.js」のコードを見てみました。今回からはYoutubeの「Coding Train」チャンネルのp5.js動画をレビューしてみます。それではいきましょう!

【Vue.js】UIフレームワーク「Vuetify」をCDNリンクで事始めた

Vue.jsの続きでず。前回まではコンポーネントについて触れましたが今回からはVue.jsのUIフレームワーク、Vuetifyにトライしてみます。CDNリンクで事始めることができました。それではいきましょう!

【CSS】form用のリセット設定(ノーマライズCSS、リセットCSSとの比較)

フォームのCSSって結構手間がかかったり、効いてくれなかったりで苦心しますね。TwitterでTAK(@tak_dcxi)さんがフォーム用のリセットCSSをツイートしていたので、実際に試してみました。それでは行きましょう!

【Vue.js】コンポーネントにpropsオプションで値を渡す

Vue.jsシリーズの続きです。前回はコンポーネントにカウンターを仕込みました。今回はコンポーネントに値を渡してみます。propsオプションを使います。それではいきましょう!