【Docker】WindowsでDocker環境を構築する

Windowsでwebアプリを開発する機会がありました。 普段はmacで開発しているので、ここ最近Windows用の開発環境は作る機会がありませんでした。 しかも、以前と構築方法が変わっているため、導入手順を見直す必要がありました。 さて、 今回はwindowsで開発環…

【PowerShell】テキストのコピー&ペーストをするには

小ネタです。 ターミナルで作業していると、コードをコピー&ペースト(以下、コピペ)する機会があります。 今回はPowerShellでのコピペについて記載します。 操作方法 コピー 範囲指定をして、右クリックする事でクリップボードにコピーを作成します。 ペ…

【Docker】応急処置。Docker Desktop 3.0.0でvolumeがマウントできない件の対処法。

2020/12/12 3.0.1がリリースされました。 volumeがマウントされていない件が対応されたようです。 Bug fixes and minor changes Fixed an issue that caused certain directories not to be mountable into containers. Fixes docker/for-mac#5115 docs.dock…

【Laravel-DomPDF】独自のheaderを追加する

小ネタです。 Laravel-DomPDFで、独自のheaderを追加したい場合の対処法です。 通常のダウンロード処理 公式ドキュメントは下記です。 github.com 従来の方法 例えば、ファイルをブラウザで表示せずダウンロードする場合、下記のheader を指定します。 Conte…

【SSH】SSH接続先の初期ディレクトリを変更する

ssh

小ネタです。 SSHでサーバに直接接続する際、接続するユーザーのルートディレクトリとは別のディレクトリを指定したい場合があります。 $ ssh user@example.com // SSH接続... // ドキュメントルートで作業したいので、毎回cdコマンドで移動。 example.com $…

【heteml】Composerを使えるようにする

hetemlのサーバーにアプリケーションを実装する機会がありました。 hetemlはssh接続も可能で、様々なミドルウェアを実行できます。 そのため、Composerのようなパッケージ管理システムを導入する事も可能です。 getcomposer.org さて、 今回はhetemlサーバー…

【正規表現】似たようなURLを判定するための正規表現

小ネタです。 URLで処理を分岐させる時に、似たようなURLを一緒に扱いたい場合があります。 例えば、次のような違いを同じドメインとして判定したい時です。 サブドメインの有無 httpsとhttpの混同 そんな時に使う正規表現について記載します。 URL正規表現…

【Dompdf】テキストに日本語を使用する

Webシステムで帳票を生成する機会というのはよくあります。 PDFを作成するライブラリは色々ありますが、手軽にHTMLライクで作れるライブラリとなるとDompdfがあります。 github.com しかし、デフォルトでは日本語に対応していません。 日本語を含むフォント…

【Laravel】リレーションされた要素数を取得する

プロジェクトが複雑になればなるほど、データベースを用いたやりとりの難易度も上がっていきます。 複数のテーブルをリレーションさせる事はよくあります。 Laravelではリレーション周りの関数も色々用意されており、複雑なリレーションにも柔軟に対応できま…

【Laravel-Admin】カスタムフィールドを作る

Laravel-Adminを使った管理画面を運用しているのですが、用意されている既存フィールドでは要件に合わない時があります。 laravel-admin.org 例えば、年月日の月を管理したい場合です。 もちろん、月を管理するためのフィールドは初めから用意されています。…

【PHP】継承元の静的変数(static)を、継承先の変数で上書きする

php

Laravelで開発をしていると、静的変数でクラスのパラメータを設定する場面がよくあります。 継承元に共通関数をまとめられるので、ソースの見通しがよくなります。 今回は、静的変数を継承先から取得する方法について記載します。 継承元の変数を上書きする…

【TypeScript】都道府県一覧の配列データ

日本向のサービスを作る時、都道府県一覧の配列を作って処理の中に組み込む事が多いと思います。 TypeScript用に簡単な一覧データを作りましたのでご共有します。 案件に合わせて変えてもらって構いません。 github.com 目次 目次 使用例 使用例 Reactで都道…

【TypeScript】連想配列の型指定

Javascriptは配列のように扱える型が複数あります。 ドキュメントでも基本的な型は説明されています。 www.typescriptlang.org しかし、連想配列については型としては説明されていません。 今回は連想配列を扱う方法について記述します。 目次 目次 連想配列…

【Laravel】ロケーション周りの初期設定

Laravelをインストールして最初に実行する作業の一つに、アプリケーションのロケーション設定があります。 この作業をしないと、アプリケーションで扱う時間が日本時間と異なったり、バリデーションのメッセージが日本語にできなかったりします。 今回は、La…

【Mac】コピー&ペースト事にコピー元のスタイル(装飾)を引き継がずにペーストする

mac

今回は小ネタです。 コピー&ペースト(以下、コピペ)をする時、コピー元のフォントサイズや色、背景色まで引き継いでしまう場合があります。 Macでは、文字の装飾の事をスタイルと言います。 エディタであれば文字に装飾をつけられないので影響は受けませ…

【Visual Studio Code】【Mac】json形式の生データを整形して確認する方法

今回は小ネタです。 jsonファイルではなく、json形式の生データをとりあえず見やすくしたい時があります。 整形してくれるwebサービスもありますが、機密情報だと警戒してしまいます。 今回は、VisualStudioCode(以降、VSCode)を使用した、json形式の整形方…

【javascript】関数で可変長引数を扱う

処理の中で関数の引数の総数が定まらない場合があります。 これを可変長引数と言います。 ja.wikipedia.org 可変長引数を扱いたい場合は、追加したい要素を配列にしてしまう方法もあります。 // 指定された数字の合計値を返す function sum(args) { return a…

【javascript】動的なパラメータを含むURLを生成する

外部データをやり取りする際、データの取得はGETメソッドで行う場面が多いと思います。 GETメソッドの場合、特定の文字や情報を検索したり、データ形式を指定したりするためにパラメータを用いる事があります。 パラメータが少なければ、一つ一つ結合しても…

【React】【Karma + Jasmin】React v16でコンポーネントの単体テストが実行できない時に試す事

Reactでコンポーネントの単体テストを試してみようと思いました。 それぞれコアとなるモジュールをインストールしただけでは動きませんでした。 調べてみると、コアのインストール以外にも他のモジュールを入れたり、設定を変えたりする必要がありました。 …

【Salesforce API】2020年7月頃からSalesforceのAPIが使えない時に確認する事

最近、Salesforceと連携していたWebサービスでAPIに連携できない問題が発生しました。 Salesforceを管理されている方からは「設定の変更をされていない」との事だったので、色々状況を調べることになりました。 解決策が見つかったので共有します。 もしかし…

【Vue Router】ルートのプロパティの型を変換して取得する

プレーンなVueのプロジェクトでルーティングを行いたい場合、Vue Routerモジュールを使用します。 router.vuejs.org このモジュールでは、静的なURLはもちろん、動的なURLを扱う事ができます。 動的なURLというのは、例えば次のような使い方です。 ユーザー…

【Vue CLI】初期設定のエントリーポイントを変える

Vue CLIで作成したプロジェクトでは、初期設定のエントリーポイントは隠蔽されています。 今回は、初期設定されているエントリーポイントを変える方法について記載します。 環境 モジュール名 バージョン @vue/cli 4.4.6 【Tips】 Vue CLI 4系を使う場合の注…

【Vue】エラー解決備忘録:TypeError: loaderContext.emitError is not a function

webpackで環境を作っている時に発生したエラーについて解決策を記録しておきます。 現象 Vueの設定をしてビルドした所、下記のエラーが発生しました。 ビルド自体は正常に完了しました。 TypeError: loaderContext.emitError is not a function ソース ハブ…

【Vue】エラー解決備忘録:You are using the runtime-only build of Vue where the template compiler is not available...

webpackで環境を作っている時に発生したエラーについて解決策を記録しておきます。 現象 Vueの設定をしてビルドした所、下記のエラーが発生しました。 ビルド自体は正常に完了しました。 [Vue warn]: You are using the runtime-only build of Vue where the…

【webpack】ビルドするとimport宣言したcssファイルが0.jsになってしまう件の解決

webpackの構成を作成していた時の備忘録です。 今回は、stylusからcssにコンパイルする過程で発生する現象ですが、cssでもsass(scss)でも発生しうる事象です。 また、mini-css-extract-pluginでcssファイルを外部出力する場合でも同じ現象が起こります。 web…

【webpack 4】コード圧縮処理の設定方法

webpackの利点として、コンパイルしたスクリプトの容量を抑えてくれる機能が用意されています。 とはいえ、単純にwebpackを使うだけであれば触れる機会は少ない機能だと思います。 今回は、コードの圧縮方法について触れたいと思います。 webpackのライブラ…

【javascript】aタグの無効化

フロントエンドで遷移するイベントを実装する時があります。 最近では、イベントを発火させるボタン要素をdivタグで用意するドキュメントを見ます。 もちろん、全てdivでも何ら問題はありません。 しかし、何かしら遷移が発生する場合は、(好みの問題ではあ…

【webpack】【Pug】webpackのpugテンプレートコンパイル設定

静的ページで構成されるページであっても、なるべくならテンプレートエンジンを使用して作りたいものです。 今回は、Pugテンプレートについて取り上げます。 pugjs.org Pugについては別の機会にするとして、webpackでコンパイルするための設定について記載し…

【Laravel Mix】複数のスタイルやスクリプトのコンパイル処理を改善する

LaravelはフロントエンドコンパイルをするためのツールとしてLaravel Mixが導入されています。 laravel.com 初期状態でも十分使いやすいのですが、機能が多いプロジェクトの場合ではそのままでは使いづらいところがあります。 例えばページ毎に別のスタイル…

【Visual Studio Code (VSCode)】ウィンドウの表記を日本語にする

無償IDEで且つ軽いと言われているVisual Studio Code(VSCode) を触る機会がありました。 (※諸説あります。) 初期状態では英語ですので、日本語にする方法について記載します 環境 Macで使う想定ですが、Windowsでも手順は同じようです。 OS バージョン mac 1…

©︎2017-2018 WebSandBag