Photo by meo on Pexels.com

二度目の挑戦🔥。英字配列キーボードに置き換え。

2023.07.21

Logging

おはようございます、先日、英字配列キーボードに置き換えました、これは二度目の挑戦になります。まえ挑戦を行ったときは数週間で元のキーボードに戻りましたけど今回は頑張ってなれるまで使用してみようと思っています。英字配列のキーボードで何が一番困るのかといえば日本語と英字の切り替えだと思います。この英字と日本語を切り替えるために日本語キーボードには切り替え専用のキーが存在するのだけど、英字配列の場合は`とALTを同時に押して切り替えるようになります。

他に簡単に切り替えることが出来る方法があれば、記事の下にあるご意見等からご連絡頂ければ凄く助かります。さて、なぜ英字配列のキーボードを購入したのかといえば仕事でコードを書くときやはり英字配列の方が効率的が良いです。特に『[ ] ; : ‘ ” 』など打ちやすい場所に配置されていることにあります。そのキー配置を覚えれば効率よくコードを書くことが出来るはずです👨。

close up photo of gaming keyboard
Photo by John Petalcurin on Pexels.com

因みにまだ英字配列に慣れていません、特に日本語と英字の切り替えでミスタッチを繰り返してしまいます。慣れるまでかなり時間がかかりそうな気がしますが、何とか元を取りたいな💰。

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

タグ

ALT, Photo by John Petalcurin on Pexels.com, かなり時間, キー, キーボード, キー配置, コード, ご意見, まえ挑戦, ミスタッチ, 仕事, , 場所, 専用, 挑戦, 日本語, 日本語キーボード, 英字, 英字配列, 英字配列キーボード,

ページ無限スクロールの作り方 #インフィニティ#InfinityPageScroll #JavaScript

2022.09.22

Logging

おはようございます、台風14号が過ぎ去ってからいきなり秋模様ですね🫠。

さて、先日ツイートしたページ無限ループが出来るJavaScriptコードを書きました。これを作ろうと思ったキッカケは、自分が運営しているWordPressサイトに巷のページ無限スクロールプラグインが尽く(ことごとく)使用出来なかったので自分で自作した訳です。因みにページ無限スクロールプラグインとはページを送りをしなくてもページの最下までスクロールすると次頁を読み込んでくれるプラグインの事を指します。

下記のコードは自サイト専用なのでそのまま使用することは出来ませんが、重要な部分だけ抜き取って再利用すれば、独自のページ無限ループに対応することは可能かと思います。

コードを読んで頂ければ分かることですが、重要なポイントはページを読み込む方法とそれをDomに変換する方法だと思います。まず、ページを読み込む方法は下記のファンクションで可能です。

fetch(next_url).then(
                response => response.text()
            ).then(data => {

そしてDomに置き換えている所はこの部分になります。これら2つの箇所が重要になります。

                const parser = new DOMParser();
                const doc = parser.parseFromString(data, 'text/html');

これらの事に注意して独自コードを書いてみてください。最後に全コードを記載しときます。


let cnt = 2;
let blk = 0;
async function nextpage() {
    if (cnt !== blk) {
        blk = cnt;
        await (async () => {
            let next_url = "https://fox-black.com/blog/page/" + cnt;
            return await fetch(next_url).then(
                response => response.text()
            ).then(data => {
                const parser = new DOMParser();
                const doc = parser.parseFromString(data, 'text/html');
                let blogs = doc.querySelectorAll('.blogpage');
                cnt++;
                if (blogs[0].innerHTML !== undefined) {
                    document.querySelector(".foxpage").insertAdjacentHTML("beforeend", (function (elm) {
                        let str = "";
                        for (const key in elm) {
                            const element = elm[key];
                            if (element.innerHTML !== undefined) {
                                str += "<div class=\"blogpage\">" + element.innerHTML + "</div>";
                            }
                        }
                        return str;
                    })(blogs));
                } else {
                    if (document.querySelector("#fin") === null) {
                        document.querySelector(".foxpage").insertAdjacentHTML("beforeend", "<div id=\"fin\"></div>");
                    }
                }
            }).catch(error => {
                if (document.querySelector("#fin") === null) {
                    document.querySelector(".foxpage").insertAdjacentHTML("beforeend", "<div id=\"fin\"></div>");
                }
            });
        })();
    }
}

if (navigator.userAgent.match(/iPhone|Android.+Mobile/)) {
    window.addEventListener("scroll", async function () {
        let s = (() => {
            let tgt;
            if ('scrollingElement' in document) {
                tgt = document.scrollingElement;
            } else if (this.browser.isWebKit) {
                tgt = document.body;
            } else {
                tgt = document.documentElement;
            }
            return tgt;
        })();
        if (document.querySelector("#fin") === null && s.scrollTop >= (s.clientHeight - 650)) {
            await nextpage();
        }
    });
} else {
    document.querySelector(".foxpage").addEventListener("scroll", async function () {
        if (document.querySelector("#fin") === null && document.querySelector(".foxpage").scrollTop >= (document.querySelector(".foxpage").scrollHeight - 300)) {
            await nextpage();
        }
    });
}


著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

タグ

14, dom, InfinityPageScroll, javascript, WordPress, インフィニティ, キッカケ, コード, こと, これ, サイト, スクロール, それ, ツイート, プラグイン, ページ, ポイント, ループ, 下記, , 作り方, 使用, 先日, 利用, 可能, 台風, 変換, 対応, 専用, , 方法, 最下, 模様, 次頁, 無限, , , 自作, 自分, , 運営, 部分, 重要,

sonyのwh-1000xm4の使用感、むふむふ、ふむふむ!これは!!

2022.03.27

Logging

先週の土曜日にsonyのwh-1000xm4を購入しました、その使用感を一週間ほど経過したので書いていきます。まず、音ですよね😌。今まで安いヘッドホンばかり使用していたので全然違います。重低音感が半端ないです。ヘッドホンからの音漏れもなくとても良い感じですね。因みに自分はiPhoneに専用のアプリをインストールして使用しています、またiPhoneの音制御を外して聞いています。

次にフィット感と本体の質感はどうなのかなって言えば、こちらも良い感じです。長時間、ヘッドホンしていても耳が痛くならないです。ずっと着けていても大丈夫ですが難聴になるかもしれないと思い、数時間に一回は装着を外しています。それぐらい大丈夫です。質感はスルっとしていてしっとり感があります。夏に長時間使用していると汗をかきそうかなと思う所があります。

総合的に言えば高い買い物でしたが買ってよかったです。ただ今年の後半にはwh-1000xm5が発売されそうな気がします。今まで二年スパンで新しい機種が登場しているので・・・それを考慮して検討してみてはと思っております。

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

タグ

, 1000, 4, iPhone, SONY, wh-, xM, アプリ, インストール, こちら, これ, する, それ, , フィット, ヘッドホン, , 今年, 使用, 使用感, 先週, 制御, 半端, 土曜日, , 専用, 後半, , 感じ, , , 本体, , , 経過, , 自分, 装着, 買い物, 質感, 購入, 重低音, 長時間, 難聴, ,

セレクトメニューの都道府県は毎回、作るよりストックしておくべし。

2021.12.13

Logging

駆け出しフロントエンドエンジニアさんや駆け出しコーダーさんの中にはお問い合わせなどで、都道府県を毎回、書いている人はいると思いますが、大体、同じことを何回もするのは無駄です。なので、自分専用の雛形を作っておくといいですよ。そうする事によって作業は結構、短縮されたりします。今回は自分がよく使う、セレクトメニューの都道府県をJSで都道府県リストを生成するように作りました。

都道府県生成

繰り返しになりますが、こんな感じに自分が使用するデータや独自の関数はストックしておくと作業効率は上がります、毎回調べてプログラミングやコードを書くのは仕事上では手間になるので辞めた方が良いです。

最後にJSコードとGitHubのリンクを貼っときますので、ご自由使用くださいませ。

https://github.com/zip358/select_jp_ken

let useKendata = [
    {'no':'01','name':'北海道'},
    {'no':'02','name':'青森県'},
    {'no':'03','name':'岩手県'},
    {'no':'04','name':'宮城県'},
    {'no':'05','name':'秋田県'},
    {'no':'06','name':'山形県'},
    {'no':'07','name':'福島県'},
    {'no':'08','name':'茨城県'},
    {'no':'09','name':'栃木県'},
    {'no':'10','name':'群馬県'},
    {'no':'11','name':'埼玉県'},
    {'no':'12','name':'千葉県'},
    {'no':'13','name':'東京都'},
    {'no':'14','name':'神奈川県'},
    {'no':'15','name':'新潟県'},
    {'no':'16','name':'富山県'},
    {'no':'17','name':'石川県'},
    {'no':'18','name':'福井県'},
    {'no':'19','name':'山梨県'},
    {'no':'20','name':'長野県'},
    {'no':'21','name':'岐阜県'},
    {'no':'22','name':'静岡県'},
    {'no':'23','name':'愛知県'},
    {'no':'24','name':'三重県'},
    {'no':'25','name':'滋賀県'},
    {'no':'26','name':'京都府'},
    {'no':'27','name':'大阪府'},
    {'no':'28','name':'兵庫県'},
    {'no':'29','name':'奈良県'},
    {'no':'30','name':'和歌山県'},
    {'no':'31','name':'鳥取県'},
    {'no':'32','name':'島根県'},
    {'no':'33','name':'岡山県'},
    {'no':'34','name':'広島県'},
    {'no':'35','name':'山口県'},
    {'no':'36','name':'徳島県'},
    {'no':'37','name':'香川県'},
    {'no':'38','name':'愛媛県'},
    {'no':'39','name':'高知県'},
    {'no':'40','name':'福岡県'},
    {'no':'41','name':'佐賀県'},
    {'no':'42','name':'長崎県'},
    {'no':'43','name':'熊本県'},
    {'no':'44','name':'大分県'},
    {'no':'45','name':'宮崎県'},
    {'no':'46','name':'鹿児島県'},
    {'no':'47','name':'沖縄県'},
];
document.getElementById("ken").insertAdjacentHTML('afterbegin',(function(ken){
    let str = '';
    for (const key in ken) {
        str+= '<option value=' + ken[key].no + '>' + ken[key].name +'</option>';
    }
    return str;
}(useKendata)));

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

タグ

01, 39, github, JS, let, name, no, useKendata, エンジニア, エンド, お問い合わせ, コーダー, コード, こと, ご自由, ストック, セレクト, データ, プログラミング, フロント, メニュー, リスト, リンク, , , , 今回, 仕事, 何回, 作業, 使用, 効率, 北海, 大体, 専用, 感じ, 手間, , 最後, 毎回, 無駄, 生成, 短縮, 自分, 都道府県, 関数, 雛形, 駆け出し,

AWAY(アウェイ)、動物視点のゲーム。一見は百聞にしかず!!

2021.09.25

Logging

朝は本当に涼しくなってきましたね、何年ぶりだろうか、高知県で秋らしい秋になるのは毎年、秋っていう感覚がなくいきなり冬が来たって感覚がここ数年続いていたように思えます。そして去年よりも今年の冬は寒そうな予感さえします。

さて、AWAY(アウェイ)という変わったゲームを紹介します。このゲーム、動物を操作してそれぞれの視点を体感できるゲームになっています。今までも動物視点のゲームはあったんだけど、2022年に配信される AWAY(アウェイ) が一番リアルかなと思っています。値段も安くてダウンロード専用の通常版だと2,178円と格安です。

『AWAY』発売告知トレーラー

唯、こういうゲームはとても素晴らしいだけど、一般的にヒットするかと言えばそうではなく理科好きな少年少女たちにしか受け入れないのかもなと思ってしまいます・・・・。

尚、PS4、PS5に対応していますので、こういうジャンルが好きな方は是非遊んでみてください?。

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

タグ

178, 2, 2022, 4, 5, AWAY, PS, アウェイ, ゲーム, ここ, ジャンル, それぞれ, ダウンロード, ヒット, リアル, 一見, 予感, 今年, 体感, 何年, 値段, , 動物, 去年, , 対応, 専用, 少女, 少年, 感覚, 操作, , , , 本当, 格安, 毎年, 理科, 百聞, , 紹介, 視点, 通常, 配信, 高知県,

レンタルサーバーの帯域幅を増やしたい

2019.12.26

Logging

浜辺美波VS池田エライザの妖艶対決? 「賭ケグルイ」OP映像特別編第1弾が公開

レンタルサーバーの帯域幅を増やしたい、そうする事によって表示速度はかなり変わる、特にモバイルファーストにはかなり良いと思うのだ。

レタリング処理能力が上がるのと帯域幅を増やすことによってモバイルファーストの評価は上がるだけど
共有のレンタルサーバーは帯域幅を上げることはすら出来ない仕様になっているところが多い。

WordPressを高速に動かすクサナギとかいうやつが良いのだが・・・。
それでもそんなに評価が上がるわけでもない。

WordPress専用サーバなどを試したことがないので試してみたいのだが、自分が思うにはあまりレタリング処理は
変わらないのではないかと思っている。

悩ましい、収入が安定すれば良いサーバに変えてみようとか密かに思っています。

やはりモバイルファーストってかなり影響するよね。
追記2021:因みにカゴヤ・ジャパンのレンタルサーバーだと帯域幅を増やせますよ。

Japanese Webmaster Office Hours(ウェブマスター オフィスアワー 2016 年 12 月 7 日)

著者名  @taoka_toshiaki

※この記事は著者が30代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

タグ

2021, https, WordPress, www, You, かごや, かなり, クサナギ, こと, サーバ, サーバー, ジャパン, ところ, ファースト, モバイル, やつ, レタリング, レンタル, わけ, , 仕様, 共有, 処理, 収入, 安定, 専用, 帯域, , 影響, 能力, 自分, 表示, 評価, 追記, 速度, 高速,

内容まで¥r¥nで書かれたCSVコードを整形する簡単な方法。

2019.10.19

Logging

内容まで¥r¥nで書かれたCSVコードを整形する簡単な方法。
CSVの内容まで¥r¥nで書かれているとプログラム(PHP)で読み込みが
とても面倒くさいなので、自分は手っ取り早い方法で整形を行いました。
まずCSV編集専用のソフトか何かでファイルを開いてください。
おそらく正しく読み込まれると思います。次に
列の最後に新たに列を追加しCSVで使用されていないユニークな文字を
記入して行端まで値を入れて再度保存してください。
次にエディターでCSVを開き、全ての¥r¥nを¥nに置き換えます。
次に列の最後につけた、ユニークな文字を¥r¥nに置き換えます。
こうすることにより列の終端を探すなどのコード書かなくても
explodeなどで取り出すことが可能です。
但し容量が多いG(ギガ)単位のCSVファイルには通用しません。
その場合、CSVファイルを分離するか、
プログラムで何とかするかになります。

以上、小技テクニックでした。
 

著者名  @taoka_toshiaki

※この記事は著者が30代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

タグ

CSV, explode, php, エディター, ギガ, コード, こと, ソフト, ファイル, プログラム, ユニーク, 但し, 何か, 使用, 保存, , 全て, 内容, 再度, 分離, , 単位, 可能, 場合, 容量, 専用, 整形, 文字, 方法, 最後, 簡単, 終端, 編集, 自分, 行端, 記入, 追加, 通用,

ANA積立で決済する方法とiPhoneでウォレット追加する方法。

2019.04.09

Logging


ANA積立航空券で決済する方法ですが、
まずWEBで予約まで行います、次に下記のサイトに
書かれているANA旅行積立プラン専用デスクに電話します。
その後、WEBへログインし支払い期限が延長されている
事を確認します。
サイトにANA航空券(旅行券)を送る住所が記載されているので
封筒にそれらを明記しANA旅行積立プラン専用デスク 行と記入した
うえで、郵便局で簡易書留+追跡サービスで送りましょう。
※送付するときは必ず送付書を入れて送りましょう。
尚、往復の場合、余白に搭乗日時などを明記し上記の内容に
合算することを明記しましょう。
http://www.anas.co.jp/tsumitate/anaticket/use_ticket/dom_desk/index.html
iPhoneでウォレット追加する方法
下記のサイトから手順通り行うとうまく行くはずなのですが、
純正ブラウザ以外の場合、インストールできない場合があります。
なので必ずSafariを使用してウォレット追加しましょう。
https://www.ana.co.jp/ja/jp/serviceinfo/share/passbook/

著者名  @taoka_toshiaki

※この記事は著者が30代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

タグ

ANA, anas, anaticket, co, desk, dom, htmliPhone, http, index, iPhone, jp, Safa, ticket, tsumitate, use, web, www, インストール, うえ, ウォレット, こと, サービス, サイト, それら, デスク, とき, パス, ブラウザ, プラン, ログイン, 上記, 下記, 予約, , 住所, 余白, 内容, 合算, 場合, 封筒, 専用, 延長, 往復, , 手順, 搭乗, 方法, 旅行, 旅行券, 日時, 明記, 期限, 決済, 確認, 積立, 簡易書留, 純正, 航空券, , 記入, 記載, 追加, 追跡, 送付, 郵便局, 電話,

さくらレンタルサーバーとXサーバーのMYSQLの規定

2018.11.13

Logging

さくらレンタルサーバーとXサーバーのMYSQLの規定は下記になります。
個人で使用する場合、1G、多くて3Gもあればそんなに困らないとは思いますが、企業や仕事で商品データなどをMYSQLサーバーに保存しようとすると足りない。さくらレンタルサーバーは9Gまで保証してくれるが、それでも足りないっていう企業の方も多くいると思います。そんな場合はさくらレンタルサーバーだと共有サーバーを諦めてワンランクアップしたマネージドサーバ(IP専用)を考えてみると良いかもしれないです。
ちなみにXサーバーはビジネスタイプでも同じ規定です。

https://www.xserver.ne.jp/manual/man_db_spec.php

https://help.sakura.ad.jp/hc/ja/articles/206053142#db

著者名  @taoka_toshiaki

※この記事は著者が30代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

タグ

, 206053142, , , ad, articles, db, hc, help, https, IP, ja, jp, MYSQL, sakura, アップ, サーバ, サーバー, さくら, それ, タイプ, データ, ビジネス, マネージド, ランク, レンタル, ワン, 下記, 仕事, 企業, 使用, 保存, 保証, 個人, 共有, 商品, 場合, 専用, , 規定,