JavaScript

JavaScript

html2canvasをスマートフォン(iPhone iOS Safari, Android Chromeのレスポンシブページ)に対応させる方法【JavaScript】

先日、『【PNG画像出力&エクセル出力対応】チーム分けWebツール・重複なしで均等に【グループ分けや組み分けを行うランダム生成オススメWebアプリ】』と『【簡易画像キャプチャ機能付き】テキストを比較して差分を表示するdiffツール...
JavaScript

【簡易画像キャプチャ機能付き】テキストを比較して差分を表示するdiffツール【JavaScriptでWebツール】

#text-container { display: flex; justify-content: space-between; } #text-container span...
2023.11.13
JavaScript

Intersection Observer APIの使い方【基本的な事を分かりやすく・JavaScript】

以前、IEが消滅してフロントエンドエンジニア的にメリットを強く感じる旨の記事を掲載しました。『IE(InternetExplorer)のサポート終了から生まれるメリット5選!~フロントエンドエンジニアの観点からJavaScriptを考える...
2023.10.20
JavaScript

CDN Vue.js 3系でVCalendarを動作させられないので諦めた話

const { createApp } = Vue createApp({ data() { ...
JavaScript

【初心者向け】JavaScriptでモーダルウィンドウの作成方法と注意事項、サンプルコード

JavaScriptで書ける基本中の基本のギミックにモーダルウィンドウという効果があります。画像をクリックすると全画面で黒背景に大きな画像が表示され、視認性をよくするためのあれです。 HTMLコーダーにはモーダル、と聞くとアレルギー...
2023.11.01
JavaScript

初心者も押さえておくべきWebセキュリティ vol.2 『クロスサイトリクエストフォージェリ(CSRF)』からの保護対策

クロスサイトリクエストフォージェリ(以下、CSRF)は、Webセキュリティの重要な脅威の一つです。攻撃者は、被害者のアカウントを悪用し、不正なリクエストを送信することで、ユーザーの意図しないアクションを実行させることができます。この記事で...
JavaScript

初心者も押さえておくべきWebセキュリティ vol.1 JavaScript『クロスサイトスクリプティング(XSS)』 効果的な対策方法と最適な方法

Webアプリケーションのセキュリティは、ユーザーのデータ保護と信頼性の確保にとって不可欠ですね。特に、クロスサイトスクリプティング(以下、XSS)攻撃は、JavaScriptを使用して悪意のあるコードを注入し、ユーザーのブラウザ上で実行す...
2023.05.20
JavaScript

【インストール不要!】猫が喜んで遊ぶ(かもしれない)無料ブラウザアプリ「ぬあぴっぴ」(対応:PC, iPad, Androidタブレット)

我が家には猫が2匹かわいい子がいるのですが、PCに上がってきて邪魔ばかりしてきます笑。キーボードは踏むし、画面は見えないわで作業になりません。 そこで、発想を変えてもう遊んでもらっちゃえってことでJavaScriptで猫が好きそうな...
JavaScript

【入門】Vue.jsとは?初心者でも理解できるように現役エンジニアが徹底解説!【JavaScriptフレームワーク】

Reactに多少押されてはいるものの、まだ需要が高いVue.js。今回はVue.jsとはどんなフレームワークで実際どのようにコーディングしていくのかが分かるように概要から具体的な実践内容について解説していきます。 対象となるのはある...
2023.05.17
JavaScript

【JavaScript】スマホの利き手でフローティングボックス(コンバージョンボタンなど)を左右利き手の側へ動的に移動する方法

コンバージョンしたい @media screen and (min-width: 801px){ #floating-box { display: none; } } @media screen and (max-width: 80...
JavaScript

ChatGPTと対話してJavaScriptで映画マトリックス風のエフェクトText Rainをブラッシュアップした話【レスポンシブ対応】

もうね、エンジニアの存在意義が問われる時代になってしまったのを痛感してます。なかなか再現が難しかった映画マトリックスのあのエフェクト(通称、Matrix text rain)をどうやって表現しているのか気になってChatGPTに効いてみた...
JavaScript

ブラウザの言語設定を変更せずにGoogleで英語検索をする方法【スマホ対応】

プログラマーやエンジニアをしていると日本語のサイトでは情報が不足していて、どうしても海外のサイトを検索していく必要が出てきます。 例えば「fllutter」というキーワードを普通に検索をしてしまうと、日本語のWebページばかり出てき...
2023.04.20
JavaScript

文字数カウントWebアプリケーションをSEOライター、ブロガーに便利な機能追加!ライティングの効率化に是非

Webライティングをしていると、作業途中までのコンテンツの文字数を取得したいことが非常に多く、Web上に掲載されている文字数カウントを行ってくれるWebページを使うことが多いです。 WordやWordpressにも文字数の計測の機能...
JavaScript

デベロッパーツールのオーバーライドでHTML, CSS, JavaScriptを効率的に開発する方法

デベロッパーツールでのオーバーライドとは、WebページのHTMLやCSS、JavaScriptをリアルタイムに編集することで、表示上の見た目や動作を変更することができる機能です。 例えば、デザインやレイアウトの微調整や、JavaSc...
JavaScript

JavaScript slice: 文字列や配列を切り取る方法と使い方を徹底解説!

本記事では、JavaScriptの slice()メソッドについて詳しく解説します。slice()メソッドは、文字列や配列を切り取るためのメソッドで、JavaScriptの開発において非常に便利な機能です。 slice()メソッドの...
タイトルとURLをコピーしました