jQuery アンド条件で要素を表示する タグのようにいくつかのキーワードが紐づく要素があり、それぞれ複数のタグを持つ可能性があるとき、ボタンを複数選択することで絞り込むUIのサンプルです。 例えばボタンが5つあり、要素が8こあるとします。 ボタンを押すと、押したキーワードに紐づく要素だけが表示されるようにします。 複数のキーワードを... 2023-11-29 23:04:02
grepのメモ しばらく使わないと忘れてしまうgrepのコマンドのメモです。 文字列をファイルから探す時のgrepのサンプルです。 [[grep -r 「検索したい文字列」 「検索するフォルダ」]] スピードをアップさせるためにfindコマンド... 2023-11-12 18:21:18
AI OpenAIのChatGPTを使ってみた OpenAIを使ってみた。そして、ChatGPTのAPIをトライアルで利用し、CSSで整形してみました。 OpenAIのアカウントを作って、ChatGPTを使ってみました。 Image: Open AI そうするとこんな感じでAIとチャットができます。 Image: Open AI... 2023-04-10 22:45:13
laravel よく使うコマンド Laravelの開発で自分がよく使うコマンドを記載していきます。 Laravlバージョンの確認 [[php artisan -V ]] configは以下の設定を変更したときのキャッシュクリア [[php artisan config:cache]] 2023-01-28 04:02:20
JS 配列要素の読み込みと表示 プレーンJavaScriptでJSONを非同期通信(AJAX)で読み込み表示するサンプルです。 jQueryなどのライブラリを使うともっと記述は減らせますが、あえて使いたくないときは以下のように書きます。 XMLHttpRequestはJSONも対応しているため、JS... 2023-01-15 17:46:25
JS Ajaxをプレーンで実装 プラグインを使わずにプレーンのJavaScriptで非同期通信Ajaxを実装するサンプルです。 XMLHttpRequestの関数を利用します。 XMLとありますが、JSONを使うケースが多いためJSONの例を掲載します。 [[ const xhr = new XMLHttpRequest();... 2023-01-06 00:12:08
JS タブボタンで要素切り替え プレーンJSでタブの表現を実装するサンプルです。 jQueryなどを使わずにボタンを押すと、コンテンツを入れ替える表現を実装しました。 一つ目の要素がデフォルトで表示されます。 ボタン1... 2023-01-04 00:15:20
laravel JS,CSSをまとめる laravel-mixを利用して、複数のJSやCSSをそれぞれ一つにまとめるサンプル。 laravelをインストールするとpackage.jsonにあれば、laravel-mixもインストールされる。 repository直下にあるwebpack.mix.jsを開く。 CSSを束ねたい場... 2022-11-11 06:41:01
CSS スタイルの非同期の外部参照 重要なCSSと、後から読み込んでもよいCSSを分けて実装するサンプルです。 昨今、表示の速さは検索エンジンが細かく評価するようになりました。 ページを表示する際に必要なスタイルだけ読み込み、重要でないスタイルは後で読み込むよ... 2022-11-06 10:07:47
SVG カンマのサンプル カンマ(コンマ)マークをSVGで描くサンプルです。 引用するときのマークやちょっとした用途で大きなカンマを使うときのSVGを用意しました。 3つの大きさがあるので、調整してお使いください。 大きなカン... 2022-09-18 16:43:48