はじめに イマドキのJavaScript開発環境記事第3弾。 過去記事は以下。 第1弾 VSCodeの設定～Linter 第2弾 自動テスト 今回は、モジュールバンドラーを用いてアプリケーションの…

こんにちは、wattak です。 50の手習いで Web アプリを作ってみよう、と色々と調べておりまして、自分の備忘録もかねて作ってみた実装をこちらに投稿しようと思います。 今回のプログラム 任意の…

概要 Google Formsで自分の回答の字数を知りたい！ Chrome拡張ってどうできているの？何ができるの？ という思いからGoogle Formsの自分の回答に字数を表示する拡張機能を作り…

はじめに 以前ご紹介させていただいた、下記記事からの続編(第③弾)になります。 https://qiita.com/y-tetsu/items/d1a5c7485cb34ae5c904 プログラム…

作ったもの インスタライブのような同期チャットにエモート機能を載せるということで JSとCSSアニメーションでひな形の挙動を作ってみました。 コード HTML <link rel="stylesh…

いつも忘れること M1　macbookに変えてから、npm使っているとたまに下記サイトのようなエラーに出会う。 https://zenn.dev/catnose99/scraps/6c9e7eba…

はじめに もっと良い方法があるかもしれないですが、調べた中で上手くいったコードをメモがてら記載 コード const [qiita, setQiita] = useState(''); const …

はじめに Next.jsでBasic認証を導入しようと思いましたが、TypeScriptで記載されたサンプルしか見つけられなかったため、JavaScript版を作成しました。 Next.jsでBa…

今週の学び JavaScriptなど sort()で()内に何も入れない時どうなるか 何もなければ a - b になる reduceメソッド 配列のそれぞれの要素に対して順番通りに、ユーザーが提供…

用途 JavaScriptでセッションに値を保存したい時、値を取得したい時に使う。 使用方法 保存方法 sessionStorage.setItem('hoge','保存したい値'); 第1引数 …

自称・画期的なアニメーションライブラリ「FlipPlayer」を作ったので、宣伝も兼ねて開発記を書いていきます。 FlipPlayer http://spice-tortoiseshell-base…

用途 textarea などで空白や改行のみが入力された際に、空文字判定にしたい時に使用する。 使用方法 空白や改行のみの場合に空文字判定 var hoge = $('#hoge').val();…

用途 textarea などで空白や改行のみが入力された際に、空文字判定にしたい時に使用する。 方法 var hoge = $('#hoge').val(); // idがhogeのtextare…

用途 「aタグ」をクリックした際にリンクの処理を無効化したい時に使う。 onClick での処理は行いたいけど、ページ遷移はさせたくない時に使う。 使用方法 <a href="javascript…

はじめに 今回は「独学でプログラミング学習するロードマップ」について紹介していきます。 「独学でプログラミング学習したいけど何すれば良いかわからない...」 「独学でプログラミング学習してるけど、…

Web Streamは便利で性能もいいのですが、まだ新しいAPIということで必要最低限の機能しか実装されていません。 以下で紹介するような新しいメソッドを使うと、シンプルにストリーミング処理が書ける…

jQueryの読み込み jQueryのバージョンはコピペなので古い。。。 if(typeof jQuery === "undefined") { var script = document.cre…

この記事は、Prisma公式の「Deploying to AWS Lambda」の和訳（意訳）です。 翻訳元とライセンスについてはページ下部に記載しています。 このハンズオンでは、Serverles…

JavaScriptの開発で連想配列を使ったので調べてまとめてみました！ 間違っていればご指摘お願いします！ 結論 「連想配列とは、配列で添字（インデックス）に数字を与えているのに対して、好きな文字…

仕事が終わり、ご飯作って洗い物して犬の世話してようやく勉強タイムです。 javascriptでは欠かせない、ＤＯＭについて学習しました。 DOM(Document Object Model) HTM…