概要 Next.jsで環境変数にアクセスする際にそれ自体に命名規則があるっぽいので、今回はその備忘録です。 クライアントサイドで利用したい場合の命名 NEXT_PUBLIC_ から始まる環境変数はクライアントサイドで利用することが出来ます。 例 NEXT_PUBLIC_FUGA_U…

概要 複数のメールテンプレート内で読み込まれる部分テンプレート(partial)の内部に、一部のテンプレートから呼ばれる時だけ locals: { requested_date: @requested_date } のように渡されるローカル変数を定義すると、別の箇所ではその値を渡さないで呼び出…

概要 こちらのツイートを見て参考になったので自分用にメモを残します📝 https://twitter.com/pulpxstyle/status/1400614083729051653 HTML <h2> <span>レスポンシブでも</span> <span>見出しの改行位置を</span> <span>調整して表示できます</span> </h2> h2 span { display: inline-block; }

概要 Google翻訳でファイルをアップロード出来るのでそれでOK👌 ちなみに翻訳結果はこんな感じになりました👀 普通に読むのに困らなそうですね。

概要 Nuxt.jsで新規作成したアプリ( nuxt@2.15.4 )で Composition API を利用しようとして、 nuxt.config.js に以下のようにプラグインとして追加したところ以下のエラーが... buildModules: [ '@nuxtjs/composition-api' ], ✖ Nuxt Fatal Error │ │ │ │ Err…

はじめに 何か作る時のマークアップで迷いがないように画面全体でローディング表示するときのサンプルを自分用にメモしておきます。 サンプルコード <template> <div class="fixed top-0 left-0 z-50 w-screen h-screen flex items-center justify-center" style="background: rgba(0, 0, 0, 0.3);"> <div class="bg-white border py-6 px-12 rounded-lg flex items-center flex-col"> </div></div></template>

前提 Nuxt.js / 2.15.2 TypeScript / 4.2.3 > npm list vue nuxt-sample-app@1.0.0 /Users/fuqda/nuxt-sample-app ├─┬ @nuxtjs/composition-api@0.22.3 │ ├─┬ @nuxt/vue-app@2.15.2 │ │ ├── vue@2.6.12 deduped │ │ └─┬ vuex@3.6.2 │ │ └── vue@2.6.12 dedup…

概要 塩漬けになっていた古いVue.jsのプロジェクトをいじろうと思い、ローカルにcloneした時のこと... あれ？ npm run start を打ってもターミナルが一向に反応しないぞ？... 他のプロジェクトで同じようにコマンドを打つとすぐローカルサーバーが立ち上がっ…

背景 Jestでテストコードを書いていた際にconsole.logで値をプリントデバッグしていたのですが、正直しんどい... 何か他にいい方法あるやろ！と思ってVue.jsのテストの洋書を読んでいたら、JestでChromeデバッガーを利用したデバッグの方法が書かれていたの…

概要 JSON Serverはバックエンドの処理をモックして、フロントエンド側の処理を優先して行う時に便利じゃん！という話。 github.com 出典 ※この記事は Full Stack open 2020 Part2-c Getting data from server を参考に書かれています 使い方 # とりあえず…