javascript
-
スタイルガイドジェネレーターfractalでHandlebarsではなくNunjucksを使用する方法
目次 はじめにFractalとはnunjucksとは前提条件プロジェクトの構築パッケージを追加する(@frctl/nunjucks)fractal.config…
-
inputに入力された全角数字を半角数字にリアルタイム変換するjavascriptとその仕組み(jQuery不使用)
目次 はじめに コードのサンプル コードの詳細と注意点 対象イベントは”input”。”keyup”はダメ 変換…
-
ReactをCDNで利用した場合のuseState、useEffectの書き方
目次 はじめに useState、useEffectとは 必要な外部ファイルをCDNから呼び出す 処理を記入する 結果 はじめに ReactをCDNから利用する…
-
これなら簡単!cdnでreactとjsxを呼び出してサイトに組み込む方法
目次 はじめに CDNのURLをscriptタグで呼び出す ReactとReactDOMを呼び出す babelを呼び出す Reactを書き出す はじめに jav…
-
ブラウザバックをjavascriptで判定する方法とつかいどころ
目次 はじめに ブラウザバックを判定するコード なぜブラウザバックで表示がおかしくなるのか キャッシュを読み込んでいるがために表示がおかしい場合の修正法 はじめ…
-
tailwindcssの使い方をさくっと説明 – ざっくり入門したい人向け
tailwindcssはcssフレームワークです。他のCSSフレームワークとの違いはtailwindcssはユーティリティークラスの集まりだということです。CS…
-
新しいページトップボタンの処理の書き方。【CSS】scroll-behaviorと【JS】scrollIntoViewを使ったスムーズスクロール
WEBサイトの定番部品の「ページトップへ戻るボタン」。だいたいのWEBサイト、ランディングページ(LP)で必要なので使い回している人も少なくないはずです。jQu…
-
jQueryなしでも大丈夫!Ajax処理を生のjavascriptで行う方法
目次 Ajaxとは jQueryを使う書き方の記事が多いが実はもうjQueryを使用しなくても簡単にAjax処理が書ける (結論)XMLHttpRequestを…
-
Ajaxでjsonファイルを読み込んでhtmlを更新する簡単な方法(jQuery使用)
WEBサイトで部分的に更新できるようにしたい場合、そのためにWordPressやMovableTypeなどのCMSを用意するのは少し大がかりすぎるなと思うケース…
-
browserslistはpackage.jsonに書くか.browseslistrcに書くか
目次 browserslistとは何か browserslistは%(パーセンテージ)で設定できるがシェア率はどこでわかるの? browserslistとは何か…
-
jsonファイルを利用してデータとテンプレートを分ける – npm + nunjucks + stylus で静的サイト制作を効率的にする(6)
テンプレートエンジンnunjucksの利用環境構築を紹介してきましたがテンプレートエンジンの何が便利かというと次のようなことです。 ヘッダーやフッターなどのペー…
-
StylusでヘルパーCSSを作成する際に便利な関数、mixin(メディアクエリ編)
sassではよくメディアクエリを設定しやすくするためmixinを使用しますがstylusでも同様にメディアクエリ用のmixinを作成すると効率が各段によくなりま…