10bace LOG

ターニングポイントさん!?

10bace LOG

カテゴリー: 技術 Page 1 of 5

Vue.jsでimgの:srcにaxiosのresponse.dataをbindしてerrorをcatchした時は違う画像みせたかった人の逸話

※mountedで直にAPI呼んじまってるから、ちょっと綺麗に書き直してるなう。
※あと、ロードが間に合ってないときにスピナー出すとかした。今度追記する。

◆したいこと

  • APIで画像を表示する。
  • APIで画像が取得できなかった時は、指定の画像を表示する。
  • DataURIの形にしてリクエスト回数を減らす。

◆おことわり

以下の成分を含みます。

これから説明するんだけど、どっから説明したもんかわからんから適当に説明する。「わかんね」って人はコメントしてくれ。

続きを読む

DataURIでSVG定義してCSSの変数で使いまわす

Webフロントエンドの記事ばっかでごめん。でも伝えたいこの思いアナタに。

◆結論

URL-encoder for SVGで変換した結果のReady for CSS欄のアレをいい感じに変数にぶち込んで使えばよろしい。

url-loaderとかの話が分かる人は、変数にurlを格納して使えばよろしい。

◆発端

  • ul要素配下のli要素について、リストマーカーにカスタムアイコンを使いたい。
  • ul要素のlist-style-imageプロパティに画像を設定してあげればいいらしい。
  • でも、ちんまいアイコンのためにリクエスト回数増やしたくないよね。
  • じゃあ、DataURIつかってSVGを定義してCSSで参照すればいいじゃない。
  • え?どこに定義すんの?死ぬの?

続きを読む

IE11でGridのAutoprefixerが効かないとか要素が全部重なるとか

ア!壊れたァ!(レイアウト)

IE死ね

◆結論

autoprefixer:options

◆登場人物

  • IE11
    そびえ立つクソブラウザ。人間の屑。稀代のゴミ。人類の敵。
  • grid
    CSSのプロパティ。便利。便利というか、正しい。
  • autoprefixer
    CSSの実装がブラウザごとに違うから、そのへんの違いをバベる。
  • a
    アンカー要素。そして、どインラ(イ)ン要素

続きを読む

【CSS】button押したときに限りfocusしつつoutline出さない

やーホント詰まった。「なんでできねぇんだよ」が久々に来たね。

英語圏兄貴の検索に引っかかることを願って、英単語まじえて説明していく。

◆したいこと

  1. htmlでbutton要素をclickする。
  2. focusは当てたい。けど見せたくない。つまるところ、outlineをhiddenしたい。outlineをinvisibleしたい。outline: none;したい。
  3. しかしながらtabで移動してきたときはfocusを当てたい。

◆前提知識:CSSの疑似クラス

条件によりCSSをあてたい時に使用。

MDN:疑似クラス

続きを読む

Vue CLIのserveをVS CodeからChromeでF5デバッグ

聖夜なので記事を捧げます。この狂った世界(Webフロントエンド)へ。
この記事がいつか、世界の片隅に打ち捨てられた震えるチワワフロントエンドエンジニアチワワを救うと信じています。

◆結論

続きを読む

VS Codeで拡張機能をGit管理するんだよ

おうあくしろよ

◆結論

ここみろ

Visual Studio Code : Extension Marketplace #Workspace recommended extensions

◆経緯

Vueでアレするにあたり、Visual Studioで開発をしようとした。そして単一ファイルコンポーネントSCSSを使おうとした。だけどうまいこと認識してくれない。Preview版もダメ。死ねビルゲイツ。

だからもうVisual Studio Codeで開発します。
VS Codeは拡張機能を入れると気持ちがいいんだけど、必要な拡張機能をREADMEとかプロジェクトWikiとかに書いて「ダウンロードして💖」っていうのは結構ファックされちゃうんで、Gitに含めて管理できねぇかと思った。

できた。

続きを読む

【ゴミ記事】Webのバカヤロウ

Webのバカヤロウ!

続きを読む

【C#】LINQの使い方のはなし

オラァ!(挨拶)

世間にある「LINQ入門」が解り辛くて仕方がない。アホどもが。
クソを読まされる初心者の気持ちにもなってみろゴミクズ。

この記事はニュービー、中級者、あるいはカンチガイ上級者を対象としている。

そして、この記事はあきれて物も言えなくなるほど長い。分けてもいいんだけど、なんとなくストーリー性があるから切らないで一本糞垂れ流す。どこまで読んだか分からなくなったら最初っから読み直せ。

※玄人へのおことわり※
いろいろ端折ってるんだからオメーこまけぇ話しにいちいち突っ込むんじゃねぇよ暇人が。シバきまわすぞ。

じゃあ行くぜ

続きを読む

C#を試したいってはなし

◆結論

この記事見ろ

C# および Visual Studio Code の使用を開始する

と言いつつ、微妙に解り辛いから端的に手順を示す。

続きを読む

WordPressのDBをClearDBからAzureのMySQL In Appに移動した

過去の俺にしか需要のない話だと思うが、する。

以下に紹介するやり方は結構に強引であるゆえ、アクセス数がでかいブログではもっと丁寧にやるべきだろう。

◆発端

このブログはWordPressで書いていて、そのWordPressはAzureApp Service上に載っている。
WordPressを動かすためにはデータベースが必要で、俺はClearDBというサイトから課金制のMySQLサーバーを借りていた。
で、調べ物をしていた時に「App Serviceのリソース上でMySQLインスタンスを実行できる」という情報を得た。「MySQL In App」というらしい。App Serviceの上で動いているんだから、つまり無料でデータベースを使用することができる。やったぜ。

ちなみに今はAppServiceのWordPressテンプレートで始めっからMySQL In Appを選択することが可能だ。

続きを読む

Page 1 of 5

Powered by WordPress & Theme by Anders Norén