元Webデザイナー兼コーダーの備忘録のブログにようこそ!!
このページは、サイトマップです。毎月月末頃に更新しています。
- HTML入門
- CSS入門
- JavaScript入門
- Vue.js
- Three.js
- p5.js
- Tweakpane
- SVG
- mustache
- YAML
- Git・GitHub
- デザイン
- 参考書
- はてなブログカスタマイズ
- ブログ運営
- お金のこと
- 雑記
- その他
HTML入門
- HTMLとは
- HTMLの基本構造、ツリー構造
- ファイル作成、表示確認
- よく使うタグその1
- よく使うタグその2
- HTMLでつまずくところ
- タグの誤用
- HTMLのコメントの書き方と注意点
- aタグの使い方
- Webサイトのページを構成する部品の名称
- ページのレイアウト
- リストタグの使い方
- ウェブサイト公開の手順
- 引用タグの使い方
- HTML,CSS,JavaScriptの役割
- 【HTML入門】HTML入門の記事まとめ
CSS入門
- CSSとは、CSSの書き方
- CSSを記述する場所
- セレクタの種類と書き方
- 優先度
- CSSでつまずくところ
- CSSでアニメーションする方法
- 色の指定方法
- aタグのCSSについて
- リストのCSSについて
- z-indexの使い方
- borderプロパティの使い方
- border-radiusプロパティの使い方
- box-sizingプロパティの使い方
- text-shadowプロパティの使い方
- box-shadowプロパティの使い方
- コメントの役割とコードの視認性
- overflowプロパティの使い方
- 【Sass】Sassを始める・試す
JavaScript入門
- 【JavaScript入門】JavaScriptでできること
- 【JavaScript入門】JavaScriptの全体像について把握する
- JavaScriptでアニメーションする方法
- 【JS中級者向け参考書】「[改訂新版]JavaScript本格入門～モダンスタイルによる基礎から現場での応用まで」の感想
- 【JavaScript】必須パターン
Vue.js
- 【Vue.js】Vue.jsの導入
- 【Vue.js】条件付きレンダリング:v-ifとv-showで表示の制御
- 【Vue.js】リストレンダリング:v-for
- 【Vue.js】属性の書き換え:v-bind
- 【Vue.js】イベントハンドリング:v-on
Three.js
- 【Three.js入門】Three.jsの導入と基本
- 【Three.js入門】アニメーション:requestAnimationFrame()
- 【Three.js入門】ヘルパー:Helpers
- 【Three.js入門】色の指定:THREE.Color()
- 【Three.js入門】物体操作:position,scale,rotation
- 【Three.js入門】カメラの手動制御:OrbitControls
- 【Three.js入門】図形:Geometries
- 【Three.js入門】質感:Materials
- 【Three.js入門】影
p5.js
- 【p5.js】p5.jsの導入
- 【p5.js】p5.jsの基本的な書き方
- 【p5.js】四角形をアニメーションさせる
- 【p5.js】色の指定
- 【p5.js】定義済み変数とrectMode()
- 【p5.js】楕円と直線:ellipse(),line()
- 【p5.js】塗りと線:fill(),stroke()
- 【p5.js】テキストの描画
- 【p5.js】図形の変形:push(),pop()
- 【p5.js】マウスの座標を取得してインタラクティブなものを作る:mouseX,mouseY
- 【p5.js】キー入力を取得してインタラクティブなものを作る:keyIsPressed,keyTyped(),keyIsPressed()
- 【p5.js】乱数で模様を描く:random()
- 【p5.js】三角関数:sin(),cos()
- 【p5.js】DOM:crerateSlider(),createButton()
- 【p5.js】p5.jsで作成したものを画像として保存する
- 【p5.js】canvasタグを任意の場所に表示させる
- 【p5.js】円を追いかける円のアニメーション
- 【p5.js】カメラの軌道制御とデバッグモード:orbitControl(),debugMode()
- 【p5.js】画像の読み込みと表示:preload(),loadImage(),image()
- 【p5.js】p5.jsの全体像と入門記事のまとめ、今後の展望
- 【p5.js】3Dモデルの表示:preload(),loadModel(),model()
Tweakpane
- 【Tweakpane】Tweakpaneの導入
- 【Tweakpane】パラメータの調整
- 【Tweakpane】値の範囲の制限:min,max,step,options
- 【Tweakpane】色の調整
- 【Tweakpane】チェックボックスの追加(真偽値を扱う)
- 【Tweakpane】グルーピング:addFolder()
- 【Tweakpane】ボタンの追加:addButton(),refresh()
- 【Tweakpane】値の書き出し:exportPreset(),JSON.stringify()
- 【Tweakpane】Tweakpaneの記事まとめ
SVG
- 【SVG】SVGについて
- 【SVG】SVGの基礎
- 【SVG】基本形状の描画
- 【SVG】パス
- 【SVG】テキスト
- 【SVG】座標系の変換:transform
- 【SVG】線の形状
- 【SVG】アニメーション1(属性値の変化)
- 【SVG】アニメーション2(座標系の変換)
- 【SVG】アニメーション3(パスに沿った移動)
- 【SVG】CSSの記述
- 【SVG】スクリプトの基礎
- 【SVG】イベント
- 【SVG】イベントオブジェクト
- 【SVG】イベントを介した属性値の取得・設定
- 【SVG】テキストオブジェクト
- 【SVG】特定の要素の取得
- 【SVG】要素の追加と削除
- 【SVG】テキスト要素の生成と追加
- 【SVG】イベントリスナによるイベント処理
- 【SVG】アニメーションの開始と終了の制御
- 【SVG】setInterval()を使ったアニメーション
- 【SVG】サンプルアニメーション:円
- 【SVG】SVGの表示・読み込み
- 【SVG】SVGの素材を作る・書き出す
- 【SVG】サンプルアニメーション:サークルのアニメーション
- 【SVG】クリッピング
- 【SVG】クリッピングとイベント
- 【SVG】グループにまとめる:g要素,symbol要素,use要素,defs要素
- 【SVG】path要素を分割して個別にスタイルを適用する
- 【SVG】素材の再利用:symbol
- 【SVG】JavaScriptを含むSVGをHTMLに読み込ませる
- 【SVG】SVG記事のまとめと今後の取り組み
mustache
- 【mustache入門:Ruby版】mustacheの導入
- 【mustache入門:Ruby版】データの埋め込み
- 【mustache入門:Ruby版】HTMLタグの埋め込み
- 【mustache入門:Ruby版】区切り記号の変更
- 【mustache入門:Ruby版】真偽値(セクション)
- 【mustache入門:Ruby版】複雑なデータ(セクション)
- 【mustache入門:Ruby版】テンプレートファイルの部品化(partials)
- 【mustache入門:JS版】mustacheの導入
- 【mustache入門:JS版】コードの整理
- 【mustache入門:JS版】データを別ファイル(JSONP)にして読み込む
- 【mustache】mustacheの記事まとめ
YAML
- 【YAML入門】YAML記法を試す
- 【YAML入門】スカラー
- 【YAML入門】シーケンス(配列)
- 【YAML入門】マッピング(ハッシュ)
- 【YAML入門】複雑なデータ
- 【YAML入門】改行を含むデータの扱い
- 【YAML入門】アンカーとエイリアス
- 【YAML入門】ハッシュのマージ
- 【YAML入門】一つのYAMLファイルに複数のデータセットを記述する
- 【YAML入門】YAML記法の確認:to_yaml
- 【YAML入門】YAMLの記事まとめ
Git・GitHub
デザイン
参考書
- IT系の技術書の選び方
- 【デジマがイラストで分かる】「デジタルマーケティング見るだけノート」の感想
- 【JS中級者向け参考書】「[改訂新版]JavaScript本格入門～モダンスタイルによる基礎から現場での応用まで」の感想
- 【jQueryの入門書】「Web制作の現場で使う jQueryデザイン入門[改訂新版]」の感想
- 【サーブレット/JSPの入門書】「基礎からのサーブレット/JSP 新版」の感想
- 【セールスエンジニアとして働いていくためのノウハウを紹介】「ふつうのエンジニアは営業でこそ活躍する」の感想
- 【リーダーに必要な5つのポイント】「リーダーの仮面「いちプレーヤー」から「マネジャー」に頭を切り替える思考法」の感想
- 【イラストで分かる】「人生を変える! 理想の自分になる! 超速! 習慣化メソッド見るだけノート」の感想
- 【アジャイルな組織のつくり方】「ここはウォーターフォール市、アジャイル町」の感想
- 【資産形成の入門】「ジェイソン流お金の増やし方」の感想
- 【2021年の読書】2021年に読んだ本の紹介
- 【ビジネスとデザイン思考】「21世紀のビジネスにデザイン思考が必要な理由」の感想
【現場で活きる基本を身につける】「ずっと受けたかったソフトウェアエンジニアリングの新人研修 第3版 エンジニアになったら押さえておきたい基礎知識」の感想
はてなブログカスタマイズ
- はてなブログカスタマイズ:グローバルメニューの追加
- はてなブログカスタマイズ:目次と見出しなど
- はてなブログカスタマイズ:サイドバー、aboutページ、Not Foundページなど
- はてなブログカスタマイズ:各ページのクラス名
- はてなブログカスタマイズ:レスポンシブ対応
- はてなブログカスタマイズ:関連記事
- はてなブログカスタマイズ:サイドバー
- はてなブログカスタマイズ:高度なカスタマイズ
- はてなブログのaboutページの活用方法について考える
- はてなブログのアイコンフォントの使い方
- はてなブログカスタマイズ:更新日の表示
ブログ運営
- ブログの記事作成を効率化するためにローカルで下書きをすることにしました
- Google AdSenseに合格するまでにしたこと
- Google Search Consoleにサイトマップを登録する
- ブログ開設1年目の振り返り
- 2021年の反省と2022年の目標
- はてなブログのトピックに記事が掲載されました
- ブログ記事のURLの修正
- ブログの収益化についてあれこれ考えてみた
- ブログの執筆スタイル
お金のこと
- 【お金のこと】iDeCoとNISAのテレビ番組を見て思ったこと
- 【お金のこと】iDeCoと(つみたて)NISAの勉強
- SBI証券メインポイントの切り替え(Vポイント→Tポイント、Pontaポイント、dポイント)
- 【お金のこと】iDeCoとつみたてNISAを始めてみる
- 【お金のこと】FIREという考え方について
雑記
- Windowsパソコンの基本操作
- Atomで書いたコードを印刷する3つの方法
- 現状のプログラミング学習法の紹介(アナログ・デジタル)
- プログラミング学習ノート作り
- 個人がネット上で情報発信する際に取り得る手段
- 画像ファイルの種類
- 画像ファイルの形式を知ることの利点
- 覚えておくと便利なショートカットキー
- ブラウザとウェブサイト制作の関係
- PC買い替え時にやること
- スマホ買い替え時にやること
- 【2021年】ハイスペックスマホを使わない理由
- 【プログラミング初心者の方へ】プログラミング学習に向けて
- パーティション分割
- 初めてプログラミングを勉強する方にJavaScriptをオススメします
- 【Windows】環境変数について調べました
- 【TVアニメ】ゴジラS.P<シンギュラポイント>で出てくるハッシュ関数(MD5)について
- Vue.jsを勉強し始めたら収拾がつかなくなりそうになった話
- 【アプリ】Spotifyを使ってみての感想
- reCAPTCHA(リキャプチャ)v3とは
- プログラミングの考え方1:反復処理
- プログラミングの考え方2:分岐処理
- 【Java】クラスライブラリ、パッケージについて調べた
- Android Studioのエラーメッセージの文字化けを解消する
- jQuery本体の中身を見る
- Atom起動時の高速化