2021年6月18日

【typescript】vue-property-decorator(vue-class-component)で$refsを扱う

今回はvue.js（Nuxt.js）でtypescriptを利用している際の`$refs`の扱い方です。

記載するコードはbootstrap-vueのカルーセルを制御する際に必要だった`$refs`の扱い方サンプルです。
カルーセルのスライドを前後させるUIを、デフォルトのUIではなく独自で作ったので`$refs`を利用してイベント発火させています。

カテゴリー 開発
2021年5月29日

javascriptで要素の一番下までスクロールされたことを検知するスニペット

今回はhtmlの要素が全部閲覧されたか？つまり一番下までスクロールされたかを判定するjavascriptのスニペットです。
素のjavascript版とvue.js版での実装をサンプルコード付きでご紹介します。
利用規約やプライバシーポリシーなど、最後まで読んでもらったことを確認してから同意したい場合などに使えると思います。

カテゴリー 開発
2021年5月15日

Nuxtでaxiosを使ってCORSエラーを出さずに無料で郵便番号検索をする

今回は郵便番号を入れたら住所を自動入力する機能についてです。
フロントエンドからxhrでリクエストしたら多くのサイトでCORSのエラーで引っかかってしまったのでその対応方法です。
サンプルの内容を利用していただければ、郵便番号検索機能作成が1,2時間で終わるかと思うので参考になれば幸いです。

カテゴリー 開発
2021年3月2日

Deviseでresource毎にログイン後のリダイレクト先を変えたい場合の自分なりの対応

皆さんdevise使っていますか？
Railsの認証にはdeviseがデファクトスタンダードになっていますよね。
今回は、deviseの認証で「user」と「admin」などのように違うresourceでログインしたあとのリダイレクト先の設定方法について自分なりの考えを記載しようと思います。

カテゴリー 開発
2021年2月7日

pumaがdaemonとして動かせなくなったので、systemdで動かすときのpuma.serviceの書き方

今回はdaemonizeオプションが削除されたpumaをタスクマネージャーであるsystemdで動かすためのtipsです。
Railsを6.1に上げたらpumaのバージョンも当然上がっていて、bash上でpumaを直接バックグランド実行できなくなっており、様々なdocumentを読んでたどり着いたのが今回の設定です。

カテゴリー 開発
2020年12月22日

もうrbenvはいらない！dockerだけでRails開発をする方法（alpine）

以前Dockerfileの効率的な書き方を記事にしましたが、今回はそれを使ってRailsプロジェクトを立ち上げる手順の記事です。
今回はDockerfileとともにdocker-composeも利用します

タイトルの通り、もうrbenvのようなローカル環境を汚しがちなツールは不要になります。
ぜひdockerマスターになってローカルを汚さない開発を目指してください！

カテゴリー 開発
2020年12月22日

効率的なDockerfileの作成手順

Railsの依存関係が変わったりRails自体のバージョンが変わったりして、都度Dockerfileの中身が変わってしまうので、実際のRUNコマンドや書き方というよりも、どうやったら効率よく最低限なdockerfileを作成できるか？を説明しています

WEB上を見ると他の方も似たような手順でやっていますが、主にRailsの場合で記述しているのでご容赦ください

カテゴリー 開発