年収300万ないアラサープログラマーブログ

明るい未来は望めない底辺PGのブログ

【yubinbango.js】一つのフォームに複数の住所入力欄がある場合躓きやすいポイント

yubinbango.js とても便利ですよね。

github.com

複数住所の場合も対応していてとても便利なのですが、

住所一つのパターンから複数に拡張しようとするとよく躓きます。なのでそのメモを。

  • 一つの場合
<form action="hogehoge" method="POST" class="h-adr">
    <input type="hidden" class="p-country-name" value="Japan">
    <div>
        <label for="">住所</label><input type="text" class="p-postal-code">-<input type="text" class="p-postal-code">
    </div>
    <div>
        <label for="">県名</label>
        <input type="text" class="p-region">
    </div>
    <!-- 中略 -->
</form>
  • 複数の場合
<form action="hogehoge" method="POST" class="h-adr">
    <div class="h-adr">
        <input type="hidden" class="p-country-name" value="Japan">
        <div>
            <label for="">住所1</label><input type="text" class="p-postal-code">-<input type="text" class="p-postal-code">
        </div>
        <div>
            <label for="">県名1</label>
            <input type="text" class="p-region">
        </div>
        <!-- 中略 -->
    </div>
    <div class="h-adr">
        <input type="hidden" class="p-country-name" value="Japan">
        <div>
            <label for="">住所2</label><input type="text" class="p-postal-code">-<input type="text" class="p-postal-code">
        </div>
        <div>
            <label for="">県名2</label>
            <input type="text" class="p-region">
        </div>
        <!-- 中略 -->
    </div>
</form>

躓きやすいポイントは、

<input type="hidden" class="p-country-name" value="Japan">

これの位置です。当たり前なのですが、

<div class="h-adr">
<!-- 中略 -->
</div>

これの中ごとでないとダメなのですね。

以上。

【Laravel・Vue.js】php artisan serve --host 0.0.0.0と初期状態のnpm run hotが両立しない件

環境

  • Laravel 5.7

現象

iOSでの見え方を確認するため

php artisan serve --host 0.0.0.0

を実行。更新をすぐに確認したいので

npm run hot

を実行していた。(実際はyarnだった)

上記の状態でiOS(外部デバイス)からアクセスすると、

画面が真っ白

色々調査を続けているとhtml中に原因を発見

<script src="{{mix('js/app.js')}}">

これが、

<script src="//localhost:8080//js/app.js">

こう展開されているのである。これじゃ外部からは動かないはずだ。

mixの設定を変更してあげることでこの現象を回避できるらしい。わかり次第追記の予定。

妥協案

npm run watch

してからの手動ブラウザリロードで確認する。

解決

これでokです

const mix = require('laravel-mix');

mix.options({
    hmrOptions: {
        host: '[ホスト機のIPアドレス]',
        port: 8080
    }
})
mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css');

【Javascript】Bootstrap-datarangepickerを日本語化する

バージョンによってやり方がよく変わるので...

環境

  • Bootstrap-datapicker 3.0.3

コード

$('#hoge').daterangepicker({
    locale: {
        format: 'YYYY/MM/DD',
        yearSuffix: '年',
        showMonthAfterYear: true,
        monthNames: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
        daysOfWeek:['日', '月', '火', '水', '木', '金', '土'],
        minDate: new Date(),
        maxDate: '+0d',
        hideIfNoPrevNext: true,
        applyLabel:"適用",
        cancelLabel:"キャンセル"
    },
},function(s, e) {
});

【Slim3・mPDF】PDFを表示しようとしたら画面が大変なことになった件

現象

f:id:uma-no-kawa:20190115180254j:plain

大変なことになった

解法

<?php
//中略

$app->get('/pdf', function (Request $request, Response $response) {
    $mpdf = new Mpdf();
    $mpdf->WriteHTML("<h1>Hello World</h1>");
    $mpdf->Output();
    //↓これが重要
    return $response->withHeader('Content-Type', 'application/pdf');
});

【Unity】JSON must represent an object type. への対応

UnityのUnityEngine.JsonUtilityはJsonパースにおいて非常に有用ですが、少し癖が強い感があります。

よくありそうなケース

[
    {
        "id":1,
        "name":"山田"
    },
    {
        "id":2,
        "name":"田中"
    }
]

これがパースできないのです。

これをパースしようとすると、

JSON must represent an object type. 

と出てエラーとなります。

パースできるようにする場合には下記のように変更が必要です。

{
    "persons":[
        {
            "id":1,
            "name":"山田"
        },
        {
            "id":2,
            "name":"田中"
        }
    ]
}

パースするコードは例えばこんな感じ、

using System;
using UnityEngine;

public class MainClass {
    public void main ()
    {
        var jsonStr = "さっきのいい感じのJSON";
        var persons = JsonUtility.FromJson<Persons>(jsonStr);
    }
}

[Serializable]
public class Person{
    public int id;
    public string name;
}

[Serializable]
public class Persons{
    public Person[] persons;
}

2018年 買ってよかったもの・やってよかったこと

2019年になり1週間が経ちますが、

個人的に昨年 買って もしくは やってよかったことをまとめてみたいと思います。

買ってよかったもの

Nintendo Switch

これは(高かったけど)買ってよかったと思っております。ゲームライフが購入前後で大きく変わったように思います。

レビューも書きました。

【レビュー・ゲーム】Nintendo Switchを購入しました。 - 意識低い系プログラマーブログ

ゼルダの伝説 ブレスオブザワイルド

私のSwitchデビュー作品。

正直このゲームをやったことでSwitchのゲームのハードルがめちゃくちゃ上がってしまった。

最初に買ったのは失敗かもしれない。

レビュー書きたい。

やってよかったこと

メルカリ

メルカリ、はじめました。

聞くとやるとではやはり違いますね。色々刺激がありました。

やり終わったゲームが中古屋よりも高く買い取っていただける可能性がある点が非常にGood。

貧乏プログラマーには非常に助かりました。

ヤフオクも同時期に初めてみましたが、個人的には、とくにやってよかった感はありませんでした。年代や趣味嗜好の違いかと思います。

PayPay

やってよかったというよりは、やっててよかったといった感じでしょうか。

クレジットカードの決済上限などが設定されましたので、今後の対応店舗次第ではありますが、お得なキャンペーンが再度始まったりしない限りは特に利用しないかと思います。