vw, vh, vmin, vmax、これらは何か？ これらの、全てについている v は、 viewport の v です。 なので、表示しているデバイスの画面の大きさを基準にして、要素の width や height を指定するのに使うことができます。 vw：viewport width ビューポートの幅…

ブロック要素で縦横比（アスペクト比）を固定したいと思いました。 結論としては、 padding-top を使うとうまくいきました。 【CSS（stylus）】 .box width 100% height auto padding-top 65% アスペクト比固定イメージ 備忘まで。

ブロックの四隅にだけ枠（border）をつけたいと思いました。 イメージは以下のような感じ。 「四隅に枠」のイメージ 最初は、途中でborderの色を変えればいいのかな？ と思いました。 でも、四隅に小さい四角を用意して、 position: absolute で配置すればい…

やりたいこと span とか div とか増やさずに、１つの要素をあるところで二色に塗り分けたい、ということがありました。 調べてみたら background: linear-gradient という指定の仕方があるという。 やり方も簡単そうなので、こちらで実装することに。 とりあ…

v-bindの書き方について混乱していた点 v-bindの基本的な書き方は、 v-bind:<子側のプロパティ>="<親側で渡したいパラメータ>" だと思う。 混乱したのは以下の２点だと思う。 v-bind や :（コロン） がない時があるが、その違いは？ <親側で渡したいパラメー…

やりたいこと 部品を呼び出す時に、カードなどの汎用性の高いものについては、最小公倍数的に要素を全て含めて部品を作っておいて、呼び出すパターンごとに、どの部品を表示するかを指定したい。 コンポーネントを作って呼び出す時に中の部品ごとの表示を指…

垂直方向に真ん中にテキストを配置したい場合は良くある 結構あるんですよね。 ある範囲で、垂直方向真ん中にテキストを配置したいっていうこと。 垂直方向真ん中にテキストを配置したい その度に、 vertical-align が思い浮かぶんですが、毎回結局これを使…

storageのSystemが占める容量が半端ない そもそも開発をしているのに、macbook airのディスク容量120GBを買ったのは本当に間違いだった。 これを買った2016年当初は、「作りたいものを作れるエンジニアになるぞ！」と決めたはいいものの、全くもって無知で、…

いきなり知らない相手から変な画像やメッセージが来た！ 知らない相手から、いきなり変な画像や意味不明なメッセージが来た！ いきなりだとびっくりします。 先ずは慌てないで落ち着きましょう。 それで携帯が乗っ取られて、今後使えなくなったりする可能性…

韓国のお年寄りは､地下鉄で宅配をしている | 韓国･北朝鮮 | 東洋経済オンライン | 経済ニュースの新基準 韓国で無料パスを持つ高齢者が配達をするサービス 概要としては、タイトルのままだが、高齢者になると地下鉄の無料パスがもらえるそうだ。 それを持つ…

Google Search Consoleの確認 Google Analyticsに加えて、キーワード等の検索が見られるらしいと聞いて、導入しようとしたところ、分析したいサイトの方にも、Google Search Consoleで発行したコードやファイルをアップロードする必要があるということがわか…

画像の大きさによらず枠いっぱい表示したい 画像の大きさが違ったり、縦長だったり、横長だったりする場合がありますよね。 そういう時に、兎にも角にも枠いっぱいに画像を表示してほしい、ということはよくあります。 画像の表示の仕方としては、 imgタグ …

CSSのdisplay:flexの基本 flex使い方 親divに、 display: flex をつける。 その直下の子1（左）に flex-basis: 30% 、 子2（右）に flex-basis: 70% をつけると、うまいことフレックスで動いてくれる。 card /* 親 */ display flex width 100% body /* 子2 *…

単一データを渡して画像を表示する ポイント 親側で、dataに画像URLを含むデータを定義しておく 子側で、受け取ったUrlを入れ込んで、 styleObject を作り、 style 属性を v-bind で紐づけることで、背景画像として表示させる ポイント整理図 ソース（親側） <template lang="pug"></template>…

単一データを渡して表示 ポイント 親側で、dataに渡したい要素を定義しておく 子側では、 {{ }} で囲ってシンプルに表示できる ソース（親側） <template lang="pug"> ProductCard(v-bind:productName="productName") <template> <script> export default { name: 'ProductIndex', components: { Pro</script></template></template>…

結論：この本全体が、小川哲さんを持ち上げ、「ゲームの王国」へ人を流し込む口として作られたように感じた。 そして本の趣旨であるし当然ではあるが、比較しつつ思い出すことで伊藤計劃さんのすごさが再認識された。 小川哲「ゲームの王国」が面白いらしい…

概要 「認知バイアス」という人間の脳のクセをクイズ80ケースに渡り、クイズ形式で説明する。 読者は、クイズを解くか、心理テストをするような気分で、読み進めることができる。 クイズについて自分の考えを持ち、答えを読むと、自分の脳がクセのせいで真実…

確認方法 show variables like 'chara%'; これで、今現在の文字コードがどうなっているか確認できる。 文字コードは、サーバー、データベース、カラムといったそれぞれの単位で設定できる。 デフォルトの文字コードを変える場合、 /etc/my.cnf に設定を書き…

Collationとは一体なんぞや まずはそこからですよね〜。日本語訳を調べてみると、「照合順序」。 なんじゃそら。 命名規則 文字コード_言語名_比較法 なんだとか。 文字コード 自ずと知れた、 utf8 とか utf8mb4 とかそういうやつ。 言語名 japanese とか un…

起きたこと 1度目、ひどい文字化けが起きて、原因を解明するのにかなりの長い時を要しました。 2度目、PHP Laravelのマイグレーションを実行した時に、 default character set utf8mb4 collate 'utf8mb4_general_ci' という記述がエラー文面の最後に含まれて…

MySQLの設定 Name：なんでも良い MySQL Host：EC2内に設置したMySQLの場合は、127.0.0.1（自身）。RDSを立てた場合は、その固有のIPアドレス。 Username：MySQLのユーザー名 Password：MySQLのパスワード Database：空欄で可（接続するデータベースを限定し…

エラーの原因 これは、権限がないよ！ というエラーでした。 "user"というユーザーに、扱うデータベースに関する権限を与えてやれば、解決しました。 権限を与える方法 GRANTS ALL ON <データベース名>.* TO user@'localhost' identified by 'password'; FLU…

エラー[PDOException]: Could not Find Driver 表題のエラーが出てしまいました。 config/database.php の default は、ちゃんと mysql になっている。 .env には、データベースの接続情報を記載している。なんで〜・・・ php-mysql などの、データベースとP…

composer updateや、composer require <パッケージ名> したら、エラーが出た メモリが足りません、というエラーぽい。 proc_open(): fork failed - Cannot allocate memory さて、調べてみると、phpがそもそも使えるメモリを増やす、という方法もあったが、…

設定情報を確認するためのphpinfo 例えばデータベースとPHPのつなぎを設定している際などに、設定を変更し、変更が正しく反映されているかどうかを確認するために重要なのが phpinfo です。 PHP使ったことがある人は、一度は必ず見たことがある画面だと思い…

最初に 環境構築中に少し間、期間が空いてしまったため、Mysqlをインストールしたかどうかを忘れてしまいました。 バージョンを見てみると、 MariaDB のバージョンが出てきたので、インストールした模様、と思ってしまいました。 が、よく見るとバージョンも…

yumはCentOSやFedora向けのパッケージ管理のコマンドです。 正式名称は、Yellowdog Updater Modifiedらしい。 Yellow Dog Linuxが出して居るディストリビューションです。 更新 yum update yumでインストールされたパッケージを一気に最新版に更新します。 …

ApacheでLaravelを動かすため、本番環境をAWSで用意しています。 Apacheをインストールして、起動します。 Apache 起動 systemctl status httpd で今起動して居るかどうかを確認し、起動していない場合は、 sudo systemctl start httpd で起動させます。 Apa…

AWS メリット 初心者が初めて見る場合、無料期間があるので、何と言ってもこれがいい 少しから始める場合に有利 デメリット UIがわかりにくい AWSだけに通じる新しい用語が多すぎて、ピンとこない（EBS？、ボリューム？など） Azure メリット UIがわかりやす…

AWSでssh接続が急にできなくなった！ さっきまでできていたのに、sshができなくなってしまった！ ということは、結構良くあるようです。 その際に、確認するべきポイントをあげておきます。 先ずはポカミスで、ユーザー名やIPアドレスが間違っていないか確認…