カテゴリー
開発関連

タブ退避2021/05/27

再起動する前に退避。Google Search Consoleからリダイレクトエラーのメールが来ていたのでNetlify対応のプラグイン入れようとしたら、今年はじめにGatsbyv2→v3になっていてプラグイン使えなかったのの対応まわりと、とnode 14〜への更新まわりでエラー出て調べたこと(主にES6のお作法まわりに沿うように変更入れた)をバラバラと。
カテゴリー
git

gitで存在しないブランチにプッシュし続けて差分が消えちゃったとき

初心者がよくやる間違いらしいよ

どないしてなったのか忘れたけど、過去の状態を確認するためにheadを数個戻した。それを忘れてずっとコミットし続けて(存在しないブランチの発生)いざmasterに最新が入っているよ、と言おうとしたら、あれ、俺のコミットたちツリーに表示されてねぇ・・・ってなった。oh///

ありがたき有識者の投稿

git でコミットが消えた場合に簡単に復帰する方法 – Qiita

https://qiita.com/Ratty27/items/7ebfe9a4933eba7630dc

初心者から一歩抜け出すためのGitの業 〜 git reflog – Qiita

https://qiita.com/tbaba/items/af563deac65d1b12de49

後コレも。
VSCodeでgitのconflictを解消させる話 – Qiita

https://qiita.com/penpenta/items/08b59f4b788ca2ae1c07

ありがとう有識者・・・
カテゴリー
wp 開発関連

WP管理画面カスタム

これはやっといてね、が案件チームによって違う

今回やったやつを羅列
カテゴリー
wp

Contact Form 7カスタム関連

久しぶりにやったら

やることいろいろあったのでメッも

条件分岐でフォームパーツ出し分け

カテゴリー
開発関連

ちょっぱや公開後にLighthouseのスコアの相談されてやったこと

最初はちょっぱやでってオーダーだったけど

ガリガリつくってなんとか期日までに公開・・・と最終クライアント様にサイト見せたら目の付け所がシャープでしょ、って単純に成果物評価のプライオリティが想定と全然違っていたので、作った後からいろいろ軽量化を試みる流れとなった。最近はreactとかばっかいじってたから己でそこをチューニングすることなかったし、ヒェってなったので、そんなDaysのメモ。

Gzip

サイト置くのが一般のレンサバじゃなかったので、対応可否が不明でやってなかった。やった。そもそもそのあたりの情報も検証もなかったのでサーバを調べるところから・・・。心配だったけど、構築途中でNginxからApacheに仕様変わったのもあり調べた情報ですんなり行けた。よかった・・・。NginxよりApacheのほうが文献多い&先方エンジニアさん再起動とかで動かないで良いので速度だけでNginxで!って言うとweb本業じゃないエンジニアさんは多分対応大変だよ!(こっちも一緒にやってて申し訳ない感じで辛いよ!)
カテゴリー
開発関連

css clip-pathとなかよし

楽しいよね

ってことで最近よくご一緒するcss clip-path

つい頼っちゃう。

CSSのclip-pathプロパティでいろいろ簡単に実装できる、便利な使い方と実装のポイント | コリス

https://coliss.com/articles/build-websites/operation/css/how-to-use-css-clip-path.html
CSS clip-path の使い方 / Web Design Leaves

https://www.webdesignleaves.com/pr/css/css_clip_path.html
個人的にはcircleが便利

SCSSサンプルコード

@mixin cliping {
    overflow: hidden;
    &:before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: #fff;
        opacity: 0.15;
        clip-path: circle(0 at center);
    }
    &:hover:before {
        clip-path: circle(200px at center);
        transition: 0.8s $easeOutCubic;
    }
}```
ってな感じ。コレは固定値だけど変数にすればもっと汎用性出る(興味あればコリスさんに書いてあるよ)ちょう便利。
カテゴリー
開発関連

Cookieとsessionとローカルストレージと部屋とワイシャツと私

二回目の訪問時は表示させないでってアレ。

久々に入れたので、メッも。最近はよーろっぱの法律(GDPR?)でCookie入ってたらその旨ページにアクセスしてきたユーザーに知らせなきゃ、とか、いろいろめんどくさそうなので、実装に可能ならcookieを使わないほうがいいのかしら、と、localstrage使うかぁ〜と思いつつなんとなく全体的におさらいしてみた。
ちなみに今回はブラウザ閉じてアクセスのたびに復活してほしいとのことだったので最終的にはsessionStrageをつかった。
カテゴリー
開発関連

VSCodeでウェルカム表示が出なくなってこまった

多分なんかショートカットまちがえていじった。復活してよかった。 【VSCode】VisualStudioCode起動時のようこそ画面を非表示にする – C-MOON  
https://thenewsinpu.hatenablog.jp/entry/2018/04/18/235330
カテゴリー
開発関連

svgによるclippathについて

紹介サイトに載っているパスを自作のd=””にかえると動かないよってとき

1px*1pxの世界でつくりなおしてねって

html – How to use SVG clipPathUnits=”objectBoundingBox” – Stack Overflow  
https://stackoverflow.com/questions/44090167/how-to-use-svg-clippathunits-objectboundingbox/53448033   CSSのclip-pathプロパティでいろいろ簡単に実装できる、便利な使い方と実装のポイント | コリス  
https://coliss.com/articles/build-websites/operation/css/how-to-use-css-clip-path.html  

いやぁ、べんりすわぁ〜〜

(2ヶ月前に実装で使ったばかりなのにすっかり忘れていたこのプロパティ。画像だけじゃなくdivもクリップできるよ。忘却は敵!)  
カテゴリー
開発関連

Local by FlywheelからLocalへ。使い方だいぶ変わってた

Local って名前がでっかいワード過ぎてうまくひっかからないけど

v3→v5になってる
新しいversionではvirtualBox使わなくなってる
今までのverから現行verへは自動移行はしないので自分でDL
たまーに使うときの更新でいらいらしなくてよいらしい  
wp themeのpathを別のところから読み込むアドオンはもう使えなくなっているらしい  
 
というわけでメッも。 
 
 [WordPress] ”Local by Flywheel”でシンボリックリンクを作成する方法
https://b.0218.jp/20170111005914.html
 
Local | How to use volumes with Local
https://localwp.com/help-docs/advanced/how-to-use-volumes-with-local/
 
シンボリックリンクひさびさ作ったけどこんなかんたんだったんやな〜
 
 

移植後、最初エラーばっかでどうしよ、と思ったけど

何回か再起動したらLocal側でもFIXするようのボタン出してくれたりしたので治りました。

asset類やらもgitの中身見に行くようにしたから逆に利便性上がったかも。

ありがとうLocal