【HTML】Formバリデーションのサンプル

はじめに

フォームのバリデーションについて毎回同じことを調べている気がするのでここにメモしていきます
随時追加します

0以上の整数値のみ(0,1,2,3,…)

html

1
<input type="number" id="hoge">

JavaScript

1
2
3
4
document.getElementById('hoge').addEventListener('blur', function() {
if (!this.value || this.value < 0) this.value = 0;
else this.value = Number(this.value)
}, false)

blur
→フォーカスを外れた時に実行されます。inputでも可能なのですが0を消せなくて使いにくかったのでblurにしました

Number(this.value)
→先頭の0を除外するためです

エラー「Installation failed, reverting ./composer.json to its original content.」の解決策

Laravelの環境構築で以下のエラーでハマったので解決策をメモしておきます

実行コマンド

composer global require "laravel/installer"

エラー文言

Installation failed, reverting ./composer.json to its original content.

解決策

composer global update

終わりに

いつも思うけど環境構築がプログラミングで一番難しいんだよなあ、、、

参考

Installation failed, reverting ./composer.json to its original content.
macOSに Laravel 5.6 をインストールする手順をまとめてみる

Skypeの通話開始のショートカットを無効化した話

はじめに

Web開発をしているとよくCommand+Rでブラウザの画面更新を行うと思います。
ただ、これSkypeだと通話のショートカットなんですよね、、

間違ってSkypeを開いているときに実行しちゃうと通話をかけてしまうという、、

なのでショートカットを無効にする方法を探してみました

解決先を探す

最初に出てきたのはこの記事で
Skypeで通話開始のショートカットを無効化する

お、これで解決やんけ〜とか思ったけど、うまくいかず、、

>変更可能な「ミュートにする」ショートカットに Ctrl + Rを割り当て

って書いてあるけどどれだけ探しても変更するところがないっていう、、

多分OSかバージョンの問題かな、、

ちなMacです

で、同じ悩みを持つ人が公式に問い合わせしてるページを見つけたのですが!

https://answers.microsoft.com/en-us/skype/forum/all/how-do-i-remove-keyboard-shortcuts-on-skype-for/fd55a0ba-3991-4ab6-a00b-2725af3539a1

これも結局解決には至っておらず、、

どうやら無効化する方法はないっぽいです

マジか?
マジなのか?

最終的に

で、最終的に、そういえばBetterTouchToolでアプリごとにショートカットキー変えれるやんけ!ってことに気付いて、SkypeにのCommand+Rを無効にして解決しました

なんでSkypeの設定でできないのか不思議すぎる、、

【Git】Pullの時に不要なマージコミットをしない方法

Pullした時に

Merge branch 'dev' of github.com:hoge/piyo into dev

みたいな不要なマージコミットができることがありますよね

これ、特に困ってはなかったので放置してたのですが、せっかくなので調べてみると簡単に取り除ける方法が分かりました

pullするときにgit pull --rebaseという風にrebaseオプションをつけると良いらしいです

rebaseに関する詳細はこちらが分かりやすかったです。
git pull と git pull –rebase の違いって?図を交えて説明します!

VSCodeだといつもクリックしているプルの表示のしたにプル(リベース)というものがありますね!
全然気づかなかった!w

この機会に他のgitコマンドについても勉強しなおそうかな〜

以上です

【Hexo】画像を使い回す方法

はじめに

Hexoで画像を表示する方法を検索するとよく出てくるのが
_config.ymlpost_asset_folder: trueとすることで、_posts配下に記事名と同じ名前のフォルダを作成して、その中に画像を入れて、
記事中では

1
{% asset_img hoge.jpeg %}

のように使う方法ですよね

しかし!

これだと同じ画像を使い回しできなくて不便ですよね、、

なんと調べてみると画像を使い回せる方法を見つけたのでメモしておきます

手順

まず、sourceフォルダの直下にimagesフォルダを作成します
で、その中に画像を入れます

記事中では![](/images/hoge.jpeg)ってやるだけです

簡単すぎワロタ

参考

https://hexo.io/docs/asset-folders.html

【読書メモ】リファクタリング(第2版): 既存のコードを安全に改善する

はじめに

リファクタリング(第2版): 既存のコードを安全に改善する
という書籍を読み始めました

せっかくなので要点をメモしておきます

【Git】忘れやすいgitコマンドまとめ

はじめに

個人的に忘れやすい git コマンドをメモしておきます

【随時更新】個人的にJavaScriptでよく使う記法まとめ

個人的にJavaScriptでよく使う記法をまとめました

【Vue.js】要素の枠線をマウスで掴んでサイズ変更する

はじめに

要素の枠線をマウスで掴んでサイズ変更するやり方をメモします

JavaScript でクラスを追加・削除する方法

JavaScript でクラスを追加・削除する方法です

1
2
3
const item = document.querySelector('.hoge')
item.classList.remove('hoge')
item.classList.add('fuga')

以上です

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×