JavaScript

JavaScript

ServiceWorkerとCache APIを使ってみる

はじめに ServiceWorkerとCache APIを使って、オフライン環境でも動作する静的サイトを作ってみる ServiceWorkerとは Service Workerは、ウェブアプリケーションのパフォーマンス向上とオフライン対応を...
JavaScript

【Vue3勉強】Todoアプリ 積み上げ4(最終回)

つくったもの 画面が白くなっているときは画面リロードしているが、セッションストレージに保存していたタスクを読み取っているので登録したタスクがそのまま残っている。 ※本機能がないときはTodoも完了タスクも空で表示される やったこと データの...
JavaScript

【Vue3勉強】Todoアプリ 積み上げ3

つくったもの やったこと タスクのソート機能追加 やってみたいこと データ保持 Github
JavaScript

【Vue3勉強】Todoアプリ 積み上げ2

つくったもの やったこと アプリケーションバーの追加 タスクの削除 やってみたいこと タスクソート データ保持 Github
JavaScript

【Vue3勉強】Todoアプリ 積み上げ1

つくったもの やったこと Vue3環境構築 Vuetifyインストール(アイコン、コンポーネント) 入力ボックスにタスク名を追加して、Enterキー押下でTodoリストにタスクを追加 未入力時は追加しない(入力チェック) Todoリストの左...
JavaScript

Vuetify3ことはじめ2(Vite)

はじめに 過去にVue CLIで作成したVueプロジェクトにVuetifyをインストールしたことはあるが、Viteだと少し手順が変わっていて上手く動かなかったのでVite版でやってみる。 本記事のゴール Viteで作成したVueプロジェクト...
JavaScript

Viteベースの「create-vue」を使ったVue3環境構築手順

はじめに 以前、Vue CLIを使ってVue3環境を構築したが、Vue3の環境構築においてVue CLIは主流ではなくなっておりメンテナンスモードになっていることを知った。 現在は、Viteという実行環境をベースにしたプロジェクト作成ツール...
JavaScript

Vuetify3ことはじめ

Vuetify3とは デザインスキルがなくてもマテリアルデザインのUIを簡単に作れるUI Component Frameworkのこと バージョン3が2022年11月と今月にリリースされたので、さっそく使ってみるVuetify - A UI...
JavaScript

Vue CLIを使ってVue.js環境を作ってみる

はじめに SPAでWebアプリを作りたいと思ったので、SPAフレームワークの中でも比較的難易度の優しいといわれているVue.jsの環境をVue CLIを使って構築してみる 本記事のゴール VueCLIで作ったVue.jsのアプリ骨格を起動す...
JavaScript

JavaScriptでテーブルの特定列を折りたたむ

作ったもの チェックボックスをチェックすることでテーブルの対応する列を折りたたむ。 処理としては、表示と非表示を切り替える(toggle)ことで折りたたんでいるように見せてる。 See the Pen 列折りたたみ by ashitaka1...