blog - [taoka toshiaki]

⏩️ディズニープラスで将軍を見ています．2話まで見てやっと．

2024-09-25 06:00:00

おはようございます．秋ぽっい連休最終日に記事を書いています．この頃、将軍をウォーキング中に見るようになったんだけど、5日前に足を痛めて少しウォーキングを中断していました．

やっと二話目を見終わりなんか面白い作品かもと思いが芽生えてきました．たぶん、将軍面白い作品かもなので全話見たら感想を改めて記載します．

将軍は友との飲みの席で話題に上がったので見てみようと思ったわけで最初は将軍のドラマすら知らなかった．因みに今月の28日までにディズニープラスを一年契約すると、一年間は5千円弱で見えるので結構お得です．

自分が一番見ているサブスクはネトフリで次にディズニープラスになりそうな予感．アマプラはあまり見ない感じです、何故かといえばアマプラで見れるものはネトフリで大体見れるようになっているから見なくなりました．

因みに動画という分類で言えばYOUTUBEを一番見ている気がします．

明日へ続く．

⏩️生成AI、正直、絵に関しては見分けがつかないレベルまで来ているパッと見分からないけど．

2024-09-24 06:00:00

おはようございます．生成AI、正直、絵に関しては見分けがつかないレベルまで来ているパッと見分からないけどよく見ると線が不自然な書き方があったり、微妙に歪みが絵にあるだけどそんなの多分、絵師さんしか分からない．

最近、自分の職業があと数十年で仕事を失うだろうという記事を読んで有り得るかもしれない？、でも実際そうならない気もする．理由は殆どの生成AIは有料じゃないと精度が良くないから、そして無料化して人々がコードを出力しだしても結局それを理解して使える人はあんまりいない．

コードを生成したりアプリを生成したりすることは出来るようになってきているけど、それは一から作られたアプリやホームページなど．そこからオリジナリティを出すためや自社製品としてカスタマイズするにはプログラマーが必要になる．これから一から製品を作ることが少なくなりAIが作ったものを手直しする事が増えそうな気がしてならない（当分はなさそうだけども）．

あのノーコードアプリが登場したときも、これでプログラマーの職が消えると騒いでいたのに結局のところ、あまり変化がなかった．それに今の現状は酷似している😆．

因みにGさんが生成AIを浸透させるために無料化に舵を切ったけど使いこなせる人の割合は変わらないよね．たぶん．

明日へ続く．

⏩️データベースサーバをアップグレードしました．MYSQL8系

2024-09-23 06:00:00

おはようございます．本日、レンタルサーバーのデータベースサーバをアップグレードしました．MYSQL8系に．．．．少々恐いが出来ていると思います．

連休最終日に夜な夜な起きてアップグレードを行ったわけだけど、データベースの以降や何やらは苦手ですねー．シームレスに移行できればよいのだが、何処かで大なり小なりトラブルが起きるわけでそれを迅速に対応できるかが焦点になると思います．

何故、サーバー以降が深夜帯が多いかと言えば深夜はやっぱ皆さんお休みされていて、閲覧者さんが日中よりも比較的に少ない場合が多いので大体、深夜帯にサーバー以降が多い．

それは昔も今もあんまり変わってなくて金融系は今でも深夜帯にサーバーメンテナンスを行っている．何かトラブルがあっても翌朝までに対応できればセーフというわけです．何か有れば最悪だけども大体、トラブルがあった場合は昨日まで動いていた状態で運用することが多い．要するにアップデートを取りやめたりアップグレードを取りやめたりする．

はぁーこわやこわや．

明日へ続く．

⏩️自サイトのバニラJS（javascript）をvue.jsへ書き換えた話．

2024-09-22 06:00:00

おはようございます．先日、友が東京から帰ってきてたみたいでお見上げを貰いました．いつも頂いているばかりでお返ししないといけないなって思うのですが、いつ帰って来るのかがさっぱり分からないのでお返しできないでいる．

さて、今日は自サイトのバニラJS（javascript）をvue.jsへ書き換えた話を書きます．少し前からバニラJSからvue.jsへ変更しようと思っていたのだけど、変更する意味が見いだせずにいた.

先日からReactを仕事で触りだしてなるほど、ちょっと便利かもって思い出したので勉強がてらに自サイトをvue.jsに編集しました．

自サイトの全部を置き換えていないけれど、置き換えたほうが良さげな部分は置き換えた形になります．尚、vue.jsをモジュール呼び出しで使用したい場合は呼び出す参照ファイルに下記のタグを追加すると呼び出せます．またモジュールファイルのインポートの書き方も記載しときます．参考にしてみてください．

<script src="./js/example.js" type="module"></script>

import { ref, createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js';

明日へ続く．

⏩️vue3.jsでWordPressを無限スクロールするコードを書いた話．

2024-09-21 06:00:00

おはようございます．長いので説明は省きますが、これは生成AIと自分との合作みたいなコードです．一度目の指示では上手くコードを生成してくれなかったので何度か壁打ちみたいなことをしました．尚、WordPressと言ってもREST APIとかいうのを使用した奴です．WordPress側でREST APIを有効にしないと上手く機能しませんのであしからず🙇．

そして、このコードはスマホとPCではスクロール位置が違うようになっているサイト用の専用コードです．なので、普通のレスポンシブ対応サイトだったら判断部分を削除してbody対応のコードだけで無限スクロールが可能になります．

因みにこんな事をしなくてもv3-infinite-loadingのライブラリが合ったりします．それを使用するともっと効率的なコードが書けるみたいだけども、自分はvue初心者さんなのでこんな感じになってます．

          <div id='app' class="page">
            <?php if (have_posts()):?>
                <div v-for="post in posts" :key="post.id" class="blogpage">
                  <h3>{{ post.title.rendered }}</h3>
                  <p> {{ formattedDate(post.date) }}</p>
                  <p v-html="post.content.rendered"></p>
                </div>
            <?php endif; ?>                
          </div>    
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="https://unpkg.com/moment@2.30.1/min/moment.min.js"></script>
<script src="<?= get_template_directory_uri() ?>/asset/Infinity.js?<?=time()?>" type="module" ></script>

import { ref, onMounted, onUnmounted, createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js';

createApp({
    setup() {

        const posts = ref([]);
        const page = ref(1);
        const loading = ref(false);
        const hasMore = ref(true);

        onMounted(async () => {
            await fetchPosts();

            if (window.innerWidth < 600) {
                window.addEventListener('scroll', handleScroll);
            } else {
                document.querySelector('#app').addEventListener('scroll', handleScroll);
            }

        });

        onUnmounted(() => {
            if (window.innerWidth < 600) {
                document.documentElement.removeEventListener('scroll', handleScroll);
            } else {
                document.querySelector('#app').removeEventListener('scroll', handleScroll);
            }
        });
        const formattedDate = (dateString) => {
            return moment(dateString).format('YYYY年MM月DD日');
        };

        const fetchPosts = async () => {
            if (loading.value || !hasMore.value) return;

            loading.value = true;
            try {
                const response = await axios.get(`/wp-json/wp/v2/posts?page=${page.value}`);
                if (response?.data?.length) {
                    posts.value = [...posts.value, ...response.data];
                    page.value++;
                    hasMore.value = true;
                }else{
                    hasMore.value = false;
                }

            } catch (error) {
                //console.error(error);
            } finally {
                loading.value = false;
            }
        };

        const handleScroll = async () => {
            let scrollHeight = null;
            let clientHeight = null;
            let scrollTop = null;

            if (window.innerWidth < 600) {
                scrollHeight = document.documentElement.scrollHeight;
                clientHeight = document.documentElement.clientHeight;
                scrollTop = document.documentElement.scrollTop;

            } else {
                scrollHeight = document.querySelector('#app').scrollHeight;
                clientHeight = document.querySelector('#app').clientHeight;
                scrollTop = document.querySelector('#app').scrollTop;
            }

            if (scrollTop + clientHeight >= scrollHeight - 100 && hasMore.value) {
                await fetchPosts();
            }
        };
        return { posts, page, loading, hasMore, fetchPosts, handleScroll, formattedDate };
    }

}).mount('#app')

明日へ続く．

⏩️Githubアクションでレンタルサーバーにデプロイさせる話．

2024-09-20 06:00:00

おはようございます．将軍が米エミー賞を受賞しましたね、これを機会に自分はディズニープラスを契約してウォーキングのときに将軍をみています、これは田舎だから出来る特権かと思います💁．

さてGithubアクションでレンタルサーバーにデプロイ（アップロード）させる方法を書いていきます．まず前提条件としてIDとPASSでの認証ではなくて鍵での方法です．事前に公開鍵をレンタルサーバーに登録しとく必要があります．

では最初に対象となるリポジトリのセッティングから下記の順にクリックしてください．

次、アクションシークレットに必要な値を登録します（SSH_PRIVATE_KEYやSERVER_USERNAMEなどです）

最後にアクションの設定（yml）を行えば完了です．完了ですがレンタルサーバーによっては海外IPアドレスをブロックするように設定しているレンタルサーバーがあります．なので、海外IPを解除する必要があります．GithubのIPアドレスはこちらを参照して設定ください．
https://api.github.com/meta

※ルート直下をデプロイ対象すると.gitもアップロードされ大変危険ですので対策を取るか、直下をアップロードしないようにするか等が必要なります．

name: sakura

on:
  push:
    branches: [ "main" ]

jobs:
  deploy:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout Repository
        uses: actions/checkout@v4

      - name: Set up SSH key
        run: |
          mkdir -p ~/.ssh
          echo "${{ secrets.SSH_PRIVATE_KEY }}" > ~/.ssh/id_rsa_sakura
          chmod 600 ~/.ssh/id_rsa_sakura

      - name: Deploy Files via rsync
        run: |
          rsync -avz -e "ssh -i ~/.ssh/id_rsa_sakura -o StrictHostKeyChecking=no" ./path ${{ secrets.SERVER_USERNAME }}@${{ secrets.SERVER_HOST }}:${{ secrets.SERVER_DEPLOY_DIR }}

これでメインにプシュしたものはレンタルサーバーにアップロード（Deploy）されるようになります．

簡略化した説明なので分からない方もいると思います．そんな方は生成AIやググると何とかなるかと思いますので諦めずにトライしてみてください．

明日へ続く．

⏩️武蔵美電音研が良いって話でこの音源すべて欲しい、誰か知ってませんか？

2024-09-19 06:00:00

おはようございます．武蔵美電音研が良いって話でこの音源すべて欲しい、誰か知ってませんか？今日は情報提供ではなくてブログを見ているユーザーさんの中で知っている方へお問い合わせ．

このYOUTUBEの音源を知っている方は一言メッセージをください🙇．

この曲には恐らく続きがあると思うのですが、shazam使っても見つからないですよね．因みにshazamってのは音楽の音から音源を検索してくれるツールです．Chromeの拡張でもありますがshazamってアプリが存在していてiPhoneでもAndroid端末でもインストールしていれば、この曲いいと思った時にアプリ起動させると瞬時に音源を検索してくれるので便利です．

最後にShazam（シャザム）のアプリリンクを貼っときます．

ios端末（iPhone 、ipad）
https://apps.apple.com/us/app/shazam-find-music-concerts/id284993459

Android端末
https://play.google.com/store/apps/details?id=com.shazam.android&hl=ja

明日へ続く．

⏩️この投稿は1年以上前に公開されました。という文言を表示するようにコードを生成した話．

2024-09-18 06:00:00

おはようございます．この投稿は1年以上前に公開されました。という文言を記事の上部に表示するようコードを生成した話．これぐらいのコードなら手を動かして書くより生成AIに指示したほうが楽ですねー🎈．

function display_old_post_warning() {
    // 現在の日付
    $current_date = new DateTime();
    // 記事の公開日
    $post_date = new DateTime(get_the_date('Y-m-d'));
    // 日付の差
    $interval = $current_date->diff($post_date);

    // 記事が1年以上前に公開された場合
    if ($interval->y >= 1) {
        $warning_message = '<div class="alert alert-danger shadow-lg" role="alert" style=\'background-color: #ff5162!important;\'>';
        $warning_message .= '<strong>この投稿は1年以上前に公開されました。</strong> 現在の情報とは異なる可能性がありますので、ご了承ください。';
        $warning_message .= '</div>';
    }
    return $warning_message;
}

楽にコードが生成出来るけど、ソースコードを生成してもソースコードを読む力がないと何処にコードを当てはめたら良いのか分からないし、またコードがバグだった時の対応ができないので結局のところプログラマーは永遠に必用な職業かもしれない．

先日も書いたけど、これから義務教育でアルゴリズムの勉強をした子供たちが大人になっていく中でプログラマーの存在は変わってくるとは思っている．

優秀なプログラマーしかプログラマーと呼ばれないかもなってーーてへ😆．

明日へ続く．

⏩️室内から外へ出た際に目が痛くなる、または光に対して敏感になる傾向は、発達障害に関連するのか？

2024-09-17 06:00:00

おはようございます．室内から外へ出た際に目が痛くなる、または光に対して敏感になる傾向は、発達障害に関連するのか？と調べてみた結果．やっぱ関連するみたいです．

前々から室内から外へ出た時に太陽の光で目が痛くてなれるまで少し時間がかかるのです．特に真夏の太陽は痛い．いちばん、恐いのはトンネルから出たときにもそんな感じなのでこの頃はサングラスを付けています．

フォトフォビアかもしれないですけど、自分でも少し自閉スペクトラム症の傾向はあるなって思っている．俗に言うグレーゾーンにいるんじゃないかなって思っている．

因みに自分は勉強をあまりしないでも出来た方なのかも知れないけれども、コミュニケーション能力は劣っていた感じになり社会適合から言えばマイナスな人かなって思っている．

明日へ続く．

⏩️エネルギーを得るためには力を使わないといけない．それが戦争の根源．

2024-09-16 06:00:00

おはようございます．この世から戦争がなくなれば良いのにって思うだけども進化の過程で必用だった、動物を狩って食するという行為、この行為が遺伝的に刻まれているホモサピエンス最大のバグ．今となっては人類最大のバグなのかも．

エネルギーを得るためには食するという行為が必用だけども．これもいずれ遺伝子改造で消えていくのだろうなって思っている．光を浴びるだけでエネルギーに変換する人類2.0が誕生するかもしれない、誕生するまえに争いというバグで人類が滅亡する可能性もある．

馬鹿なことを書いてみたけど、実際に人類が人類2.0に進化する場合、エネルギーをどう摂取するかは大事な課題かと思います．また、巷ではAIブームだけど、これからの子供たちは遺伝子研究の分野に進むことが良いんじゃないかな．プログラミングを勉強している人たちが大人になる頃には、自然言語処理でコードを生成してくれる事が普通になり、最終的にはプログラミング言語は機械語しか残らないと思っているので、今からプログラミングを勉強している人達は無駄にはならないけれど、20年後に職業として存在しているかは疑問ですね．

プログラミングは誰もが知っているレベルになるから、これからは遺伝子分野に焦点を当てた方が良いと思っている派です．

たまにはお花畑的な記事もよいですねえw．

明日へ続く．

🏠️Top Page

⏩️ディズニープラスで将軍を見ています．2話まで見てやっと．

⏩️生成AI、正直、絵に関しては見分けがつかないレベルまで来ているパッと見分からないけど．

⏩️データベースサーバをアップグレードしました．MYSQL8系

⏩️自サイトのバニラJS（javascript）をvue.jsへ書き換えた話．

⏩️vue3.jsでWordPressを無限スクロールするコードを書いた話．

⏩️Githubアクションでレンタルサーバーにデプロイさせる話．

⏩️武蔵美電音研が良いって話でこの音源すべて欲しい、誰か知ってませんか？

⏩️この投稿は1年以上前に公開されました。という文言を表示するようにコードを生成した話．

⏩️室内から外へ出た際に目が痛くなる、または光に対して敏感になる傾向は、発達障害に関連するのか？

⏩️エネルギーを得るためには力を使わないといけない．それが戦争の根源．