Laid Back Code

date
Jan 2, 2022
repo_url
slug
bio-blog
status
Published
summary
概要文
type
Page
thumbnail_url
tags
outer_link
アウトプット用のインデックスサイト
notion image
Blogはどこかに投稿するほどでもない小さなアウトプット・自分用のメモやTipsなどをゆるく投稿していきます。

nextTickについて

isIntegerメソッドを使って値が整数であるかどうかを判定する

スペースを使ってJSON出力をフォーマットする

OR演算子を使ったデフォルト値の設定とその問題点について

分割代入構文を活用する

関数のデフォルトパラメータ

スプレッド演算子を使用してオブジェクトや配列の浅いコピーを作成

Set() を利用して配列から重複しているものを取り除く

複数の Promise が完了するまで待つ

map()で配列内の値をキャスティングする

コードの実行時間を計る

astro dev でブラウザを自動で立ち上げる

非同期処理のテスト

TypeScriptの型の階層構造

ChatGPT プロンプト公式リファレンス

Provide/Injectの使い所

オブジェクトを見失ったときの対処方法

名前つきSlotにHTMLを渡すv-slot

Provideではref()ではなくreactive()を使う理由

v-modelでのemitの記述

Vueにおけるアクセシビリティチェックツール

Emitの定義・流れ

Propsのデフォルト値

watchEffect()とwatch()の使い分け方

watch()で即時実行する

Modifiersの活用例

リストデータのオブジェクト操作

Mapのデータ操作

配列のデータ操作

filter()でループ対象のデータを絞り込む

カウンタ変数を利用するv-for

オブジェクトやオブジェクトの配列ループサンプル

Mapでのv-for

v-if/v-showの違いと注意事項

Reactの<></>はVueでは<template>

v-if/v-else-if/v-elseの注意点

レンダリング終了までマスタッシュ構文を非表示にするv-cloak

データバインドを一度だけ行うv-once

テンプレート記述を無効化するv-pre

v-htmlのXSS脆弱性

v-modelの修飾子

inputタグのtype=”file”はv-modelが使えない

build.assetsInlineLimit:0 で常にアセットファイルとして出力する

クリックイベント・キーイベント

v-onの修飾子 Modifiers

v-onでイベントオブジェクトとそれ以外の引数を組み合わせる方法

v-onでイベントオブジェクト以外を引数とするイベントハンドラメソッド

v-onでイベントオブジェクトを引数として受け取る

v-on イベントおさらい

テンプレート内とスクリプトブロック内の画像パスの違い

v-bind 複数の属性

v-bind Dynamic Arguments

v-bind 属性値のない属性へのバインド

v-bind 基本構文

まとめてリアクティブにするreactive()

算出プロパティは読み取り専用

Boolean()を使ってコードの見通しをよくする例

ref()の働き

オブジェクトにカメラを追従させる

オブジェクトがない箇所にピントを合わせたいとき

Astro環境でPrettierを設定する手順

devコマンドでローカルサーバーを自動起動する(for Windows)

オブジェクト追加時のメニューを再表示するショートカット

Laid Back Code (当サイト)の制作について

原点の視点に戻るショートカットキー

Sculptingモードでのブラシの大きさを変えるショートカットキー

パッケージ「classNames」で動的クラス・複数クラスを制御する

非同期コンポーネントのユニットテスト

Reactの公式が推奨しているReact Testing Libraryを使ったコンポーネントのユニットテスト

StorybookのViewport/Background

Storybookのアドオン

StorybookのControlsタブを使ったpropsの制御

StorybookのActionsを使用したコールバックのハンドリング

Storybookを使ったコンポーネント管理と基本的な使い方

pages/_appの役割

styled-componentsのThemeProvider

Next.jsのコンポーネントにスタイルを適用する

スタイルを別のコンポーネントで使用する(as の利用)

「型エイリアス」と「インターフェース」の違い


© Hayato Kamiyama 2023 - 2024 - Build with Next.js & Notion