Programming Notes

🔰 Vue3入門｜TODOアプリで学ぶ「表示切り替え」と自動更新の仕組み Vueの基本文法を一通り学んだあと、こんな壁にぶつかる人は多いです。 ボタンを押したら表示が変わる仕組みがよく分からない DOMを触っていないのに、なぜ画面が更新されるのか不...

TODOアプリを「理解しながら」作る｜JavaScriptからVueへの橋渡し Vueのチュートリアルを一通り終えたあと、 「動くけど、なぜ動くのかわからない」「コードは読めるのに、ゼロから書けない」 そんなモヤモヤを感じていませんか？ この記事では、JavaScrip...

冬のサイトやクリスマスイベントページを作るとき、「もっと雰囲気を出したい」「動きのある背景を追加したい」と感じる人は多いはず。実は、Bootstrap × JavaScript（Canvas） を組み合わせるだけで、誰でも簡単に “雪が降る幻想的なトップページ” を作れ...

🔰 Vueのリアクティブが壊れるNG例集 〜画面が更新されない時、だいたいこれ〜 Vueでこんな経験ありませんか？ 値は変わってるのに画面が変わらない console.logでは合ってるのに表示されない 「Vue壊れた？」って思う 結論から言います👇Vu...

🔰 Vueの「リアクティブ」ってなに？初心者向けにやさしく解説 Vue.jsを勉強していると、必ず出てくる言葉。 「リアクティブ」 正直、最初は「なんか難しそうな横文字…」「雰囲気で流してしまった…」という人も多いと思います。 実はこれ、Vueを理...

はじめに JavaScriptで配列を扱っていると、 特定の位置の要素を削除したい 特定の文字（値）を削除したい 同じ値をまとめて削除したい といった場面はとてもよく出てきます。 この記事では、初心者の方でも理解できるように、配列から要素を削除する代表...

Webサイトをおしゃれに見せたいと考えたとき、「ガラス風デザイン（glassmorphism）」を取り入れたいと思ったことはありませんか？ ガラスのような透明感とぼかし効果を使ったデザインは、近年のWebトレンドとして注目されており、ポートフォリオやLP、Web...

【初心者向け】JavaScriptのshuffle関数とは？配列をランダムに並び替える方法を解説 配列の順番をランダムに入れ替えたい！クイズアプリ、ガチャ、ランダム表示などを作るときに必ず必要になるのが shuffle（シャッフル）関数 です。 この記事では、JavaS...

Bootstrap cardはとても便利ですが、デフォルトのままだと少し物足りない…と感じる方も多いのではないでしょうか。この記事では、初心者でもコピペだけで実装できる「Bootstrapカードのおしゃれアレンジ」をわかりやすくまとめました。 影（シャドウ）を付...

【完全版】Vue.jsとは？初心者にもわかる基本・仕組み・使い方をやさしく解説 「JavaScriptのコード量を減らしたい…」「リアルタイムで画面が変わるサイトを作ってみたい！」そんなときに役立つのが Vue.js（ヴュー・ジェイエス） です。 本記事では、初心...