2 | zip358.com

2,3日、休止します．

2024.05.27

不幸があった為、2,3日、休止します．

著者名 @taoka_toshiaki

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

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

OFUSEで応援を送る

投稿日時 2024年05月27 06:54日

タグ

2, 3日,

ドメインの奪還しました。汚れたドメインを

2023.11.10

Logging

おはようございます、ドメインの奪還しました。汚れたドメインをただいま洗浄中っていうと失礼に当たりますが、zip358.netを一年ぐらいまえに手放したのですが、そのドメインがリダイレクトとドメインとして使用されていて、なんだか…悲しい(´Д⊂ｸﾞｽﾝ。ドメインが単なるリダイレクトとして使用される…もっと良い活用をして欲しいな。

どうしようと思っていたら、先日、そのドメインが所有者が手放していたので再度ドメインを購入しました。やっぱ責任をもって購入し続けるべきドメインだなって再度思った次第ですが。今年、手放したドメインは2,3個あります。購入した時は「さぁ頑張ってサービス作ろう」と意気込むのですが続かない。個人開発でごとごとと数ヶ月かけてリリースされる人は凄いと尊敬します。

今回、取り戻したドメインは何に使用するか考えて無くて今はこんな感じにしています。

明日へ続く。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2023年11月10 06:00日

タグ

2, 3個, zip358.net, ただいま洗浄中, ドメイン, リダイレクト, 一年, 人, 個人開発, 再度, 再度ドメイン, 失礼, 感じ, 所有者, 数ヶ月, 次第, 良い活用, 責任,

オクトパストラベラー壱と弐が良さげ #マルチプラットフォーム #RPG

2022.11.27

Logging

おはようございます、毎日５記事も記事を書いている人は強者だと思いますよ。例えばブロガーだったイケハヤさんとか、そうだったみたいです。自分も毎日記事を書くことは出来るけど、毎日記事を５記事は書いた事はありません。

さて、今日はPRGゲームの話です、ドット絵の進化系HD-2D（昔ながらのドット絵に３DCGの画面効果を加えた幻想的な世界）というシステムで作られた、オクトパストラベラーという作品（スマホ版：無料版）を少しだけプレイしてみたので感想を書いていきます。

『OCTOPATH TRAVELER(オクトパストラベラー)』紹介映像総集編

オクトパストラベラー紹介映像

紹介映像を見てもらったら分かるかと思いますが、昔のFFをプレイしているかのようでいるのだけど、映像は綺麗だし戦闘システムややりこみ要素が結構豊富で長くプレイできそうなそんな作りになっているRPGだと感じました。

このオクトパストラベラーは今年（2022年）の12月に続編、オクトパストラベラー２が発売される予定です。スクエアエニックスで続編が発売されるということは、それなりに人気があるRPGだったという事を意味していると思います。

収益化が右肩上がりになればオクトパストラベラー１と２を購入してプレイしたいなと考えています。今は少し難しいけれども、面白そうな作品だなって…〆😆。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年11月27 06:00日

タグ

12, 2, 2022, ３, 5, DCG, FF, HD, PRG, RPG, イケハヤ, オクトパス, ゲーム, こと, システム, スマホ, ドット, トラベラー, プラットフォーム, プレイ, ブロガー, マルチ, 世界, 予, 事, 人, 今年, 今日, 作品, 効果, 壱, 少し, 弐, 強者, 感想, 戦闘, 昔, 映像, 毎日, 無料, 画面, 発売, 紹介, 絵, 続編, 綺麗, 自分, 要素, 記事, 話, 豊富, 進化,

Photo by Pixabay on Pexels.com

ドラえもんは日本のディズニーかもなって。 #ネトフリ #STANDBYME2

2022.11.26

Logging

おはようございます、土曜日の朝、太陽に感謝！🙏

勤労感謝の日にこの記事は書いています、スタンド・バイ・ミードラえもん２を観ました。前作を観たのでその勢いで観ました。何かディズニー映画を観ているようなそんな感覚ですね。のび太を見ていると何だか頑張ろうってなりますし、そして何だか温かな気持ちになりますよね。

『STAND BY ME ドラえもん 2』スペシャルPV ～菅田将暉「虹」ver.～

STAND BY ME ドラえもん２予告

こういう作品を作っている人は心優しい人なんだろうなって思います。そして熱い情熱を持って作品を作っているのだろうなって見ていて感じました。藤子不二雄さんが描いていた未来とは違うところはいろいろとあるけれども、ロボットは登場しているし人工知能は着実に進化しています。

まとめ：未来は明るいと思って生きていけそうなそんな作品です、まさに日本のディズニーだと思いますし、夢がある作品だなって思います。子供に見せつつ大人が楽しんでいる作品なのかも。

昔懐かしいドラえもん是非、心温まる作品です。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年11月26 06:00日

タグ

2, BY, ME, STAND, STANDBYME, いろいろ, スタンド, ディズニー, ところ, ドラえもん, ネトフリ, のび太, はい, まとめ, ミー, ロボット, 予告, 人, 人工, 作品, 前作, 勢い, 勤労, 土曜日, 夢, 大人, 太陽, 子供, 心, 情熱, 感覚, 感謝, 日, 日本, 映画, 朝, 未来, 気持ち, 登場, 着実, 知能, 藤子不二雄, 記事, 進化,

Photo by Karol D on Pexels.com

映画、そして、バトンは渡されたを観ました。 #ネトフリ #映画 #Netflix

2022.11.23

Logging

おはようございます、水曜日の朝ですね、書いているのは月曜日の朝です。

今日は映画を一本観ましたのでその感想を書いていきます。本日、観た映画は「そして、バトンは渡された」です。劇場で観えなかったのでやっと観えたなって感じです、映画館に足を運ぼうと思っていたのだけども、ちょっと女性が多そうという理由で行かなかった映画ですが、この度、ネトフリで映画を観ました。

映画『そして、バトンは渡された』本予告 2021年10月29日（金）公開

そして、バトンは渡された予告

この映画は小説「そして、バトンは渡された」を映画化したものです、原作の小説は読まずに映画を観ました。原作読んでしまうと完璧なネタバレを見たあとの映画という事になるので、小説よりも映画が自分は好きなので、そういう順番になりがちです。

さて、ネタバレ無しで映画の感想を一言で表すと「感動」ですね😭。いや、ホントこれに尽きるかなって思います。観て良かった映画ですし、一度は観て欲しい映画なのかもなって思います。今、ネトフリで観れるようになっています。因みにNetflixはある期間が過ぎると見えなくなったりするので、お早めに観たいと思う方は観といた方が良いですよ😗。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年11月23 06:00日

タグ

2, 4, 95, com, fKypJ, https, Netflix, watch, www, youtube, あと, これ, すね, ネタ, ネトフリ, バトン, バレ, ホント, もの, 一, 一言, 予告, 事, 今日, 劇場, 原作, 女性, 完璧, 小説, 尽, 度, 感動, 感想, 映画, 映画館, 月曜日, 朝, 本日, 水曜日, 理由, 自分, 足, 順番,

chart.jsでデモを試してみました。📈 #javascriptcode

2022.11.18

Logging

おはようございます、朝が早いですねと言われますが、夜が早いだけです😅。

さて、今日はchart.jsのデモを試してみました。売上のグラフとかコレで作るのが一番じゃないかなと思うライブラリですね。動画で編集してみせたのは二箇所ですが、実際、業務で使用する場合は３箇所ほど変更して使用しないといけないのかなって。

chart.jsでデモを試してみました。📈

そういう訳で、こちらのブログにソース・コードを貼り付けておきます。

        const ctx = document.getElementById('myChart');
        let data = [12, 19, 3, 19, 2, 3];
        new Chart(ctx, {
            type: 'bar',
            data: {
                labels: ['demo1', 'demo2', 'demo3', 'demo4', 'demo5', 'demo6'],
                datasets: [{
                    label: '# of Votes',
                    data: data,
                    borderWidth: 1
                }]
            },
            options: {
                scales: {
                    x: {
                        beginAtZero: true
                    }
                }
            }
        });

業務で変更しないといけない最低限３箇所はこちらです～😆。

ラベル
データーセットの中のラベル
データーセットの中のデータ

上記の３箇所を売上のデータや何やらに使用することで活用できるかと思います。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年11月18 06:00日

タグ

12, 19, 2, ３, 39, bar, chart, const, ctx, data, document, getElementById, javascriptcode, JS, let, myChart, new, type, グラフ, コード, こちら, コレ, ソース, デモ, ブログ, ライブラリ, 一, 二, 今日, 使用, 動画, 場合, 変更, 夜, 実際, 朝, 業務, 編集, 訳,

POSTとGETの考え方について伝えている動画。 #以心伝心

2022.11.12

Logging

おはようございます、11月なのに寒くないって不思議です😗温暖化。

さて、POSTとGETの考え方について無音声（音楽あり）で伝えている動画です、以心伝心で意味が通じると良いですが、それではブログを書いている意味がないので要点だけ解説します。POSTとGETとは、インターネット上でデータの送信を行うのに使用します。POSTの利点はデータを隠して送れることと、比較的に重いデータも送れることにあります。ではGET送信の利点は、SEOに有利と言ったところでしょうか。

htmlとcssとphp-初学POSTとGETの考え方-No.2

今回、POST送信とGET送信を行い、PHPのプログラムでPOSTとGETを受信する方法を動画で伝えています。次回は非同期処理を使用して送受信を行う方法をプログラムで書いていきます。

HTMLとPHPプログラムは下記のソースを参照下さいませ🙇。

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>demo site</title>
    <style>
html {
    width: 100vw;
    height: 100vh;
}

body {
    background-color: rgb(0, 0, 0);
    color: aliceblue;
    background-image: url(./assets/images/aig-mid22910-120-xl_TP_V.jpg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

div.box {
    border-color: aliceblue;
    border-style: inset;
    position: absolute;
    width: 300px;
    height: 450px;
    color: white;
    border-radius: 1em;
    padding: 1em;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    /* background-color: #ffffff80; */
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    overflow-wrap: break-word;
    text-align: center;
}

div>form>p {
    font-weight: bold;
    margin: 13px;
}

input {
    opacity: 0.5;
}

textarea {
    opacity: 0.5;
}

button {
    padding: 5px;
    border-radius: 1em;
    border-style: solid;
    border-color: aliceblue;
    background-color: aliceblue;
    color: rgb(0, 0, 0);
}
button:hover{
    border-color: rgb(255, 255, 255);
    border-style: inset;
    background-color: rgb(27, 76, 119);
    color: aliceblue;
}
.put:nth-child(2){
    overflow: auto;
    height: 120px;
}
    </style>
</head>
<body>
    <div class="box">
        <div id="box2">
            <form action="submit.php" method="post">
                <p>名前:<input type="text" name="name"></p>
                <p><textarea name="text" id="" cols="30" rows="10"></textarea></p>
                <p><button class="btn" type="submit">確認</button></p>
            </form>
        </div>
        <div id="data">
            <p class="put"></p>
            <p class="put"></p>
        </div>
    </div>
    <script src="./assets/js/main.js"></script>
</body>

</html>

<?php
var_dump(xss_d($_POST));
print(xss_d($_POST["name"])."<br>");
print(xss_d($_POST["text"])."<br>");

function xss_d(mixed $val){
    if(!isset($val))return false;

    if(is_array($val)){
        foreach ($val as $key => $value) {
            $val[$key] = strip_tags($value);
            $val[$key] = htmlspecialchars($val[$key],ENT_QUOTES);
        }
    }else{
        $val = strip_tags($val);
        $val = htmlspecialchars($val,ENT_QUOTES);
    }

    return $val;

}

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年11月12 06:00日

タグ

11, 2, css, DOCTYPE, GET, html, lt, no, php, POST, SEO, インターネット, こと, ソース, データ, ところ, ブログ, プログラム, 下記, 不思議, 今回, 以心伝心, 使用, 処理, 初学, 利点, 動画, 参照, 受信, 同期, 意味, 方法, 有利, 次回, 温暖化, 考え方, 要点, 解説, 送信, 送受信, 音声, 音楽,

cssとjsを動的に読み込むソースコード２。#jscode

2022.11.11

Logging

おはようございます、すずめの戸締まりを本日、観に行きますという事で本日はお休み。感想は帰ったら別途書きます。

以前、ファイルを動的に再読み込みする方法という記事を書きまして、この記事がまぁまぁプレビュー数を取ってくれているので、ソースコードを書き直しました。以前と違うのは正規表現を見てくれればわかるかと思いますが、パラメータを初期からもっているJSファイルやCSSファイルは対象外にしている所です。

JS（javaScript）ファイルを動的に再読み込みする方法。

メンターがいない中、コードを見直したりするのはやっぱ時間がかかるものですね。いつも自分に必要なのはメンターだと思ったりしますが、なんだかそういう人が見当たらないですよね。やはり東京や大阪にいかないと見つけられないのかな？、今ではSNSがあるから見つけやすくなっているものの、自分よりも５０％ぐらい技術力がある人がいないですよね。凄い技術力が上の人は知っているのだけども、そういう人の話を聞いてもさっぱりなので・・・。

近くにいないものなのかな、よく灯台下暗しという言葉もあるからいそうな気がするですけどね🫠。

ソースコードはこちらです。

"use strict";
document.querySelector("button").addEventListener("click",jsandcssreload);
function jsandcssreload(){
    let d = (new Date()).getTime();
    [...document.querySelectorAll("link")].forEach((elm)=>{
        elm.href = elm.href.replace(/(\.css)\??[0-9]{0,}$/,".css?" + d);
    });
    [...document.querySelectorAll("script")].forEach((elm)=>{
        elm.src = elm.src.replace(/(\.js)\??[0-9]{0,}$/,".js?" + d);
    });    
}

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年11月11 06:00日

タグ

2, 50, css, JS, jscode, SNS, お休み, コード, すすめ, ソース, パラメータ, ファイル, プレビュー, メンター, もの, 上, 中, 事, 人, 今, 以前, 初期, 別途, 大阪, 対象, 必要, 感想, 戸締まり, 所, 技術力, 方法, 時間, 本日, 東京, 正規, 自分, 表現, 観, 記事, 話,

Photo by Quang Nguyen Vinh on Pexels.com

データからページネーションが出来る。 #jscode

2022.11.10

Logging

おはようございます、昨日は朝が寒く昼間は暑い日でしたね😗。

さて、データからページネーションが出来るライブラリがある事を知りましたのでそちらの紹介と使い方です。今回、使用したのはPagination.jsというライブラリです。使い方は簡単、下記のようなデータがあった場合、このようなソースコードを書いて使用します😮。

[
  {
    "id": 1,
    "name": "白川 正人",
    "hiragana": "しらかわ まさと",
    "age": "45",
    "bday": "1977年04月10日"
  },
  {
    "id": 2,
    "name": "大村 麻衣子",
    "hiragana": "おおむら まいこ",
    "age": "42",
    "bday": "1979年12月11日"
  },
  {
    "id": 3,
    "name": "大原 静香",
    "hiragana": "おおはら しずか",
    "age": "53",
    "bday": "1969年06月20日"
  },
  {
    "id": 4,
    "name": "吉田 佐代子",
    "hiragana": "よしだ さよこ",
    "age": "40",
    "bday": "1982年05月24日"
  },
  {
    "id": 5,
    "name": "宮原 和弘",
    "hiragana": "みやはら かずひろ",
    "age": "22",
    "bday": "2000年04月29日"
  },
  {
    "id": 6,
    "name": "伊藤 二郎",
    "hiragana": "いとう じろう",
    "age": "27",
    "bday": "1995年02月18日"
  },
  {
    "id": 7,
    "name": "井上 明子",
    "hiragana": "いのうえ あきこ",
    "age": "55",
    "bday": "1967年06月26日"
  },
  {
    "id": 8,
    "name": "恩田 雄",
    "hiragana": "おんだ ゆう",
    "age": "37",
    "bday": "1985年09月25日"
  },
  {
    "id": 9,
    "name": "山崎 幸志",
    "hiragana": "やまざき こうじ",
    "age": "29",
    "bday": "1993年03月24日"
  }
]

        $.extend($.fn.pagination.defaults, {
            className: 'paginationjs-theme-blue',
            pageSize: 3
        });
        let url = "json data のurl";
        (async () => {
            await fetch(url).then((result) => result.json()).then(
                (data) => {
                    data.reverse();
                    $('#demo').pagination({
                        dataSource: data,
                        callback: function (data, pagination) {
                            var html = table_make(data);
                            document.querySelector("#tbl").innerHTML = html;
                        }
                    })
                }
            )
        })();

        function table_make(data) {
            return (data.map((element) => {
                let str = "";
                str += "<tr>";
                str += ((Object.keys(element).map(el => "<td>" + element[el] + "</td>")).join(""));
                str += "</tr>";
                return str;
            })).join("\n");
        }

            <div class="col-12" id="demo">
                <table class="table table-dark" id="tbl"></table>
            </div>

コードを抜粋して書きましたが、このコードを書く事とjsのライブラリとcssファイルもダウンロードするようにして下さいね🫠。

因みに自分はこのライブラリを初めて使用しましたが、結構使いやすいですね。今まで開発ではLaravelなんかのページネーションを使用していた事はありますが、フロント側で出来る事を知り驚きを隠せませんというのは大袈裟ですけど使い道は有るなって思います。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年11月10 06:00日

タグ

04, １, 10, 1977, 2, 45, age, bday, hiragana, ID, JS, jscode, name, Pagination, qu, quot, コード, しらかわ, ソース, そちら, データ, ネーション, ページ, まさと, ライブラリ, 下記, 事, 今回, 使い方, 使用, 場合, 日, 昨日, 昼間, 朝, 正人, 白川, 簡単, 紹介,

htmlとcssとjavascript-初学フロント側-No.１#code

2022.11.07

Logging

おはようございます。今年もあと２ヶ月もないわけですよね早いものですね😮

htmlとcssとjavascript-初学フロント側-No.１という動画をYOUTUBEにUPしたのが昨日の９時のこと。これで理解出来るか、どうか分からない。解説もない教えもない、唯コードを書いているところを見せてるだけです。ソースコードは下記のサイトから参照できますが、次の動画作成のためにデザインや処理が変わっていたり、動作しなくなってたりするので注意が必要です。

https://358tool.com/sample-site/

自分はHtmlやcssはあまり覚えていないのですが、分かるのはそれなりに基本ベースがあるからだと思ってます。今からHtmlやcssを学ぶ人は全部を覚えようとはせずに、手を動かしてコードを書くことから始めて下さい。そのうち基本ベースは身につくことになると思います。

因みに自分が書いているclassの名前付けなどの書き方は駄目な書き方ですので、そういう所、お仕事として書く場合は会社によってキマりなんかが有りますので、そういう事まで知りたい人はこちらの動画を参照ください。

https://www.youtube.com/watch?v=pDhmhB1qI-0

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年11月07 06:00日

タグ

１, 2, 358, ９, cl, Code, com, css, html, https, javascript, no, sample-site, tool, UP, youtube, うち, コード, こと, これ, サイト, ソース, それなり, ため, デザイン, ところ, フロント, ベース, もの, 下記, 人, 今, 今年, 作成, 全部, 処理, 初学, 動作, 動画, 参照, 基本, 必要, 手, 昨日, 次, 注意, 理解, 自分, 解説, 身,

Qiitaのfeedを取得して表示するだけのコード非同期編？ #phpcode

2022.11.06

Logging

おはようございます。昨日の続きのお話ですコードは金曜日に書きました😗。

動画を見ていただければわかるかと思いますが即興で書いたコードです、最後の最後でエラーってる！？ところなんかも編集していない所が伝わってくるかと思います。ちなみに画質HDのフル画面で見ないとコードは見えないかなって思います。

任意のユーザーのQiita、feedを取得して表示するだけのコード😋非同期編？

音声も今後入れていくかもしれません。

任意のユーザーのQiita、feedを取得して表示するだけのコード😋非同期編？ https://t.co/69VMhbPyrr @YouTubeより
— 田岡寿章@taoka_toshiaki🦌 (@taoka_toshiaki) November 4, 2022

任意のユーザーのQiita、feedを取得して表示するだけのコード😋非同期編？

任意のユーザーを増やしたい場合はmain.jsの先頭行（２行目？）のqiitaIDに任意のIDを追加するだけで取得可能です。解説はなしですけど一応、何をやっているのかそれなりに、わかるように心がけたつもりです。あとは盗んで覚えてください😂。

ソースコードはこちらになります。

<?php
session_start();
$toke_byte = openssl_random_pseudo_bytes(16);
$csrf_token = bin2hex($toke_byte);
$_SESSION['csrf_token'] = $csrf_token;
?>
<!DOCTYPE html>
<html lang="ja">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
    <style>
        .qiita_feed-list>li {
            /* font-weight: bold; */
            color: aliceblue;
        }

        .qiita_feed-list>li>a {
            color: aliceblue;
        }

        body {
            background-color: #60b111;
        }

        .shadow-lg {
            box-shadow: 0 1rem 3rem rgba(255, 255, 255, .195) !important;
        }
    </style>
    <title>Qiita-feed</title>
    <?php
    require $_SERVER['DOCUMENT_ROOT'] . "/header_script.php";
    ?>
</head>

<body>
    <input type="hidden" id="csrf_token" value="<?= $csrf_token ?>">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <h1 class="text-light">Qiita-feed</h1>
            </div>
        </div>
    </div>
    <div class="container mt-2">
        <span id="view"></span>
        Copyright <?= date("Y") ?>  <a href="https://358tool.com">358tool.com</a>
    </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.1/umd/popper.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js"></script>
    <script src="./js/main.js?<?= time() ?>"></script>
</body>

</html>

//qiita feed
["taoka-toshiaki","mpyw","suin"].forEach(id=>{
    let data = {
        csrf_token:document.getElementById("csrf_token").value,
        feedid:[id]
    };
    let url = "./qiita-feed.php";
    qiita_feed(url,data);
});

async function qiita_feed(url, data) {
    const options = {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'Accept': 'application/json'
        },
        body: JSON.stringify(data)
    }
    await fetch(url, options).then(response =>
        response.json()
    ).then(resultdata => {
        document.getElementById("view").insertAdjacentHTML("beforeend",resultdata.reshtmlcode)
    }
    ).catch(error => {
        console.log(error);
    }
    );
}

<?php
session_start();
$obj = json_decode(strip_tags(@file_get_contents("php://input")));

if (isset($obj)) {

    if (isset($obj->csrf_token)  && $_SESSION["csrf_token"] === $obj->csrf_token) {
        $str ="";
        foreach ($obj->feedid as $key => $id) {
            $str.= '
        <div class="row shadow-lg p-3 mb-5 bg-body rounded">
            <div class="col-12">
            🌿<span class="text-light">://qiita.com/' . xss_d($id) . '/feed :[引用]</span>';
            $str .= get_Qiitafeed("https://qiita.com/" . xss_d($id) . "/feed");
            $str .= '
             </div>
        </div>      ';
        }
        $res["reshtmlcode"] = $str;
        print json_encode($res);
    }
}


function xss_d(mixed $val): mixed
{
    if (is_array($val)) {
        foreach ($val as $key => $value) {
            $val[$key] = htmlentities($value, ENT_QUOTES);
        }
    } else {
        $val = htmlentities($val, ENT_QUOTES);
    }
    return $val;
}

function get_Qiitafeed(string $feedUrl): string
{
    $xml = @simplexml_load_file($feedUrl);
    if (isset($xml->entry)) {
        $str = "<ul class='qiita_feed-list'>";
        foreach ($xml->entry as $key => $val) {
            $str .= "<li><a href='{$val->url}'>" . $val->title . "</a></li>";
        }
        $str .= "</ul>";
    }
    return $str;
}

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年11月06 06:00日

タグ

2, feed, HD, ID, JS, main, PHPCODE, qiita, qiitaID, あと, エラー, お話, コード, こちら, ソース, つもり, ところ, プル, ユーザー, 今後, 任意, 何, 先頭, 動画, 即興, 取得, 可能, 同期, 場合, 所, 昨日, 最後, 画質, 画面, 編集, 表示, 解説, 追加, 金曜日, 音声,

Qiitaのfeedを取得して表示するだけのコード。 #php

2022.11.05

Logging

おはようございます、土曜日の朝ですね😗。

今日は文化の日にQiitaにUPしたfeedを取得して表示するだけのコードを書きました。見た目はこんな感じでQiitaの雰囲気を取り入れたデザインにしています。デモ版として実際にサーバーで起動しているモノです、feedを取得しているユーザーは自分を入れて３人です。

表示する人数が多くなるとページを描画する時間が遅くなるので実質、１０人が限度かも知れないです。もし何人ものユーザーを取得したいと考えている方は表示部分と処理部分を別けて、尚且つ処理部分は非同期処理で変更することを推奨します。

尚、明日には２つに別けたプログラムコードを別記事として記載しますので、しばしお待ち下さいませ🙇。

今回のソースコードはこんな感じになってます。

<?php
    function get_Qiitafeed(string $feedUrl){
        $xml = @simplexml_load_file($feedUrl);
        if(isset($xml->entry)){
            print("<ul class='qiita_feed-list'>");
            foreach($xml->entry as $key=>$val){
                print("<li><a href='{$val->url}'>".$val->title."</a></li>");
            }
            print("</ul>");
        }
    }
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="Description" content="Enter your description here"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<style>
    .qiita_feed-list > li{
        /* font-weight: bold; */
        color:aliceblue;
    }
    .qiita_feed-list > li > a{
        color:aliceblue;
    }
    body{
        background-color:#60b111;
    }
    .shadow-lg {
        box-shadow: 0 1rem 3rem rgba(255,255,255,.195)!important;
    }    
</style>
<title>Qiita-feed</title>
<?php
    require $_SERVER['DOCUMENT_ROOT'] ."/header_script.php";
?>
</head>
<body>
    <div class="container">
        <div class="row">
            <div class="col-12">
                <h1 class="text-light">Qiita-feed</h1>
            </div>
        </div>
    </div>
    <div class="container mt-2">
        <?php
            $Id_List = ["taoka-toshiaki","mpyw","suin"];
            foreach ($Id_List as $key => $id) {
            ?>
        <div class="row shadow-lg p-3 mb-5 bg-body rounded">
            <div class="col-12">
                🌿<span class="text-light">://qiita.com/<?=$id?>/feed :[引用]</span>
                <?=get_Qiitafeed("https://qiita.com/".$id."/feed")?>
            </div>
        </div>            
            <?php
            }
        ?>
        Copyright <?=date("Y")?>  <a href="https://358tool.com">358tool.com</a>
    </div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.1/umd/popper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js"></script>
</body>
</html>

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年11月05 06:00日

タグ

10, 2, ３, feed, feedUrl, function, GET, lt, php, qiita, Qiitafeed, string, UP, お待ち, コード, こと, サーバー, ソース, デザイン, デモ版, プログラム, ページ, もの, ユーザー, 人数, 今回, 今日, 何人, 処理, 別記事, 取得, 同期, 土曜日, 変更, 実質, 実際, 感じ, 推奨, 描画, 文化の日, 方, 明日, 時間, 朝, 自分, 表示, 見た目, 記載, 起動, 部分, 限度, 雰囲気,

これ無料で見えるのか、これはニッチな戦略かな。 #的を得た #労働者2

2022.10.17

Logging

おはようございます、月曜日の朝は憂鬱だね🙄。

さて、深いビジネス話が聴きたいビジネスマンや意識高い系にフォーカスを置いてメディアサービスを提供しているPIVOTという配信サービスが伸びてきている気がしますので改めて紹介します。PIVOTはスマホアプリ片手で新鮮な情報、深い話が聞けるのはPIVOTだけだと思っています。今のところこういうサービスは他にないですね。

【超円安時代の資産の増やし方】4000億円ファンドマネジャーの思考法／労働者1.0と労働者2.0の違い／ジブンポートフォリオを創れ／トヨタでもテスラでもなくフェラーリを買う理由／投資家思考の３つの特徴

PIVOT

NewsPicks StudiosのCEOだった佐々木紀彦社長が立ち上げただけあってPIVOT（ピポッド）は質と方向性が今に合っているような気がします。そしてPIVOTはNewsPicksとは何だか敵対関係というよりは、相乗効果のある良きライバル的な立ち位置になりそうな気がします。NewsPicksとは少し色が違うのかなって見ていて思います、WEBでも公開しているNewsPicksとは違いモバイル端末で完結しているPIVOT。恐らくPIVOTはモバイル端末完結型でこれからも配信していくというのが自分の読みです。

【インフレ・不況時代の投資戦略】世界はすでに不況／日本はスタグフレーション／「株式の死」に備えよ／FRBが利上げする3つの理由／S＆P500も横ばう？／成長率と参入障壁／コストコの最強ビジネスモデル

これから、YOUTUBEチャンネルが何処まで伸びるかで今後が決まりそうです。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年10月17 06:00日

タグ

2, CEO, newspicks, PIVOT, Studios, web, アプリ, これ, サービス, スマホ, ところ, ニッチ, ビジネス, ビジネスマン, ピポッド, フォーカス, メディア, モバイル, ライバル, 今, 他, 位置, 佐々木, 公開, 労働者, 効果, 完結, 少し, 情報, 意識, 憂鬱, 戦略, 提供, 敵対, 新鮮, 方向性, 月曜日, 朝, 気, 無料, 片手, 的, 相乗, 社長, 端末, 系, 紀彦, 紹介, 色, 話, 質, 違い, 配信, 関係,

WP予約投稿ツイートプラグイン作り方。＃php言語 #code #v2

2022.10.11

Logging

おはようございます😤 お仕事に飢えてます…寒い季節ですね…。

さて、今日はWP予約投稿ツイートプラグイン作り方を記載していきます。ワードプレスでプラグインを作る場合はWordPressの下記の場所に任意のフォルダを作り、その中にディレクトリ名（任意名）と同じファイル名でphpファイルを作ります。※昔の名残なので今は命名が違っても動くかも知れませんが・・・。

cd /wp-content/plugins
mkdir mytweets
vi mytweets.php

そして、命名したファイル名を開き、ファイルの上部に下記のコメントを記載します。プラグイン名やプラグインの説明、プラグインバージョンをそれぞれ変更して頂き保存、その後サーバーサイドにアップロードします（フォルダごと）。

<?php
/*
Plugin Name: My tweets
Description: tweets
Version: 1.0
*/

これで何も動作しないプラグインが出来上がります。

後はコマンドラインからプラグインフォルダにcomposerをインストールしtwitteroauthのライブラリを入れます。

此処までが前手順です。此処までで挫折した人は結構いると思います🙄。

因みに此処までの事がすんなりと出来る人は、このブログの情報は必要ないものです。なのでココからはソースコードを記載します。WP予約投稿ツイートプラグインなんてオチャノコサイサイだと思います。

<?php
/*
Plugin Name: My tweets
Description: tweets
Version: 1.0
*/
if (!defined('ABSPATH')) exit;
require_once  "tw-v2-config.php";
require_once  "./vendor/autoload.php";

use Abraham\TwitterOAuth\TwitterOAuth;

function mytweets($new_status, $old_status, $post)
{
    
    if ($new_status == 'publish' && $old_status != 'publish') {
        try {
            $connection = new TwitterOAuth(APIKEY, APIKEYSECRET, ACCESSTOKEN, ACCESSTOKENSECRET);
            $connection->setApiVersion('2');
            $response = $connection->post('tweets', ['text' => get_the_title($post->ID) . "\n" . get_permalink($post->ID)], true);
        } catch (\Throwable $th) {
            //throw $th;
        }
    }
}
add_action('transition_post_status', 'mytweets', 10, 3);

上記のコードを記載した上で上書き保存＆アップロードします。その後ワードプレスの管理画面よりプラグインを有効にして出来上がり、今回はtwitteroauthのライブラリを使用しましたがcrulなどのを理解している人はライブラリは特に必要ないのかなとも思います。ライブラリを使用すればお手軽ですが、万が一何かあった時に困るのでライブラリを使用せずにコードを書くという方もいらっしゃると思います。

自分も極力、公式のライブラリしか使わないようにしています🙇。

トイウコデ、ワードプレスのプラグインの作り方でした。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年10月11 06:00日

タグ

2, cd, Code, description, lt, mkdir, My, mytweets, name, php, plugin, plugins, Tweets, Vers, vI, WordPress, wp, wp-content, アップロード, お仕事, コメント, サーバー, それぞれ, ツイート, ディレクトリ, バージョン, ファイル, フォルダ, プラグイン, プレス, ワード, 上部, 下記, 中, 予約, 今, 今日, 任意, 作り方, 保存, 名残, 命名, 場合, 場所, 変更, 季節, 後, 投稿, 昔, 言語, 記載, 説明,

数珠繋ぎのツイートシステムに予約機能を付けました😂 #php #code

2022.10.07

Logging

おはようございます、偏頭痛持ちは雨が降るが一番大変です☔。

先日、数珠繋ぎのツイートシステムを作ったのですが、そのシステムに予約機能を付けました。尚、TwitterAPIのバージョン２でスケジュールのパラメーターが今のところ無いですね。これから先、機能が付くかも知れないですが今のところ無いようです。因みにソースコードは近日中にQiitaとGithubにUPします。此処ではソースコードの一部を掲載します(※記事を更新しました下へスクロール🫠)。

Twitter API v2 ツイート数珠繋ぎ

尚、crontabでPHPファイルを叩くようにしています、あと注意事項ですが予約を一度した投稿については変更等は出来ません、編集機能等の機能追加の予定はないです。また、予約管理はsqlite3を使用して管理しています。

<?php
date_default_timezone_set('Asia/Tokyo');
ini_set("display_errors",0);
require_once "./data/tw-config-v2.php";
require_once "../vendor/autoload.php";

use Abraham\TwitterOAuth\TwitterOAuth;

class tw
{
    var $connection = null;
    var $pdo = null;
    function __construct()
    {
        $this->connection = new TwitterOAuth(APIKEY, APISECRET, ACCESSTOKEN, ACCESSTOKENSECRET);
        $this->connection->setApiVersion("2");
    }
    function db_connection()
    {
        try {
            //code...
            $res = $this->pdo = new PDO("sqlite:./data/tw-tweets-db.sqlite3");
        } catch (\Throwable $th) {
            //throw $th;
            //print $th->getMessage();
            $res = false;
        }
        return $res;
    }

    function timecheck($timeonoff, $times)
    {
        if (!$timeonoff) return true;
        $n = new DateTime();
        $t = new DateTime($times);
        return $t <= $n ? true : false;
    }

    function pickup_tweets(mixed $tw_text = null, int $timeonoff = 0, mixed $times = null, string $id = "")
    {
        if (!$times) return false;
        $obj = (object)[];
        $times = preg_replace("/\-/", "/", $times);
        $times = preg_replace("/T/", " ", $times);

        if ($this->timecheck($timeonoff, $times)) {
            if (isset($tw_text) && is_array($tw_text)) {
                foreach ($tw_text as $key => $value) {
                    if (preg_replace("/[ |　]/", "", $value)) {
                        $obj = !$key ? ($this->connection->post("tweets", ["text" => $value], true)
                        ) : ($this->connection->post("tweets", ["reply" => ["in_reply_to_tweet_id" => $obj->data->id], "text" => $value], true)
                        );
                    }
                }
                return true;
            }
        } else {
            return $timeonoff ? $this->save_sqlite($tw_text, $timeonoff, $times, $id): true;
        }
    }

    function save_sqlite($tw_text = null, int $timeonoff = 0, mixed $times = null, string $id = "")
    {
        if ($this->db_connection()) {
            try {
                //code...
                if (isset($tw_text) && is_array($tw_text)) {
                    foreach ($tw_text as $key => &$value) {
                        if (preg_replace("/[ |　]/", "", $value)) {
                            $stmt = $this->pdo->prepare("insert into tweets (tw_id,user,times,tw_text)values(:tw_id,:user,:times,:tw_text)");
                            $stmt->bindValue(":tw_id", $key, PDO::PARAM_INT);
                            $stmt->bindValue(":user", $id, PDO::PARAM_STR);
                            $stmt->bindValue(":times", $times, PDO::PARAM_STR);
                            $stmt->bindValue(":tw_text", $value, PDO::PARAM_STR);
                            $stmt->execute();
                        }
                    }
                }
                $this->pdo = null;
                return true;
            } catch (\Throwable $th) {
                //throw $th;
                return false;
            }
        }
    }
    function tweets_load(string $id = "")
    {
        if (!$id) return false;
        try {
            //code...
            $value = null;
            if ($this->db_connection()) {
                $stmt = $this->pdo->prepare("select * from tweets where user = :user order by times,tw_id asc;");
                $stmt->bindValue(":user", $id, PDO::PARAM_STR);
                $res = $stmt->execute();
                $value = $res ? $stmt->fetchAll() : false;
                $this->pdo = null;
            }
            return $value;            
        } catch (\Throwable $th) {
            //throw $th;
            return false;
        }
    }
    function tweets_update(int $key = 0, int $timeonoff = 0, mixed $times = null, string $id = "",mixed $tw_text="")
    {
        try {
            //code...
            if(!preg_replace("/[ |　]{0,}/","",$tw_text))return false;
            if ($this->db_connection()) {
                $stmt = $this->pdo->prepare("update tweets set tw_text = :tw_text where tw_id = :tw_id and user = :user and times = :times");
                $stmt->bindValue(":tw_id", $key, PDO::PARAM_INT);
                $stmt->bindValue(":user", $id, PDO::PARAM_STR);
                $stmt->bindValue(":times", $times, PDO::PARAM_STR);
                $stmt->bindValue(":tw_text", $tw_text, PDO::PARAM_STR);
                $stmt->execute();
                $this->pdo = null;
            }
        } catch (\Throwable $th) {
            //throw $th;
            return false;
        }
        return true;

    }

    function tweets_delete(int $key = 0, int $timeonoff = 0, mixed $times = null, string $id = "")
    {
        try {
            //code...
            if ($this->db_connection()) {
                $stmt = $this->pdo->prepare("delete from tweets where tw_id = :tw_id and user = :user and times = :times");
                $stmt->bindValue(":tw_id", $key, PDO::PARAM_INT);
                $stmt->bindValue(":user", $id, PDO::PARAM_STR);
                $stmt->bindValue(":times", $times, PDO::PARAM_STR);
                $stmt->execute();
                $this->pdo = null;
            }
        } catch (\Throwable $th) {
            //throw $th;
            return false;
        }
        return true;
    }

    function bat_tweets(mixed $value = null)
    {
        if (!$value) return false;
        $obj = (object)[];
        $t = "";
        foreach ($value as $key => $val) {
            if ($this->timecheck(1, $val["times"])) {
                $obj = ($val["times"]<>$t)? ($this->connection->post("tweets", ["text" => $val["tw_text"]], true)
                ) : ($this->connection->post("tweets", ["reply" => ["in_reply_to_tweet_id" => $obj->data->id], "text" => $val["tw_text"]], true)
                );
                $this->tweets_delete($val["tw_id"], 1, $val["times"], $val["user"]);
                $t = $val["times"];
            } else {
              //  var_dump($val);
              //  break;
            }
        }
    }
}

if ($argv[0]) {
    $tw = new tw();
    $value = $tw->tweets_load(xss_d($argv[1]));
    $tw->bat_tweets($value);
}
function xss_d($val = false)
{
    if (is_array($val)) {
        foreach ($val as $key => $value) {
            $val[$key]  = strip_tags($value);
            $val[$key]  = htmlspecialchars($val[$key]);
        }
    } else {
        $val  = strip_tags($val);
        $val  = htmlspecialchars($val);
    }
    return $val;
}

追記：予約編集機能なども付けました🙄。

GithubとQiitaのリンクはこちらです。
Github:https://github.com/taoka-toshiaki/tweets-system-box1
Qiita:https://qiita.com/taoka-toshiaki/items/5ef12b60b267742bf584

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年10月07 06:00日

タグ

2, ３, 39, Asia, Code, crontab, date, default, github, ini, lt, php, qiita, Se, set, Sqlite, timezone, Tokyo, TwitterAPI, UP, コード, これ, システム, スクロール, スケジュール, ソース, ツイート, ところ, バージョン, パラメーター, ファイル, 一部, 下, 予定, 予約, 事項, 今, 使用, 偏頭痛, 先, 先日, 変更等, 大変, 投稿, 掲載, 数珠繋ぎ, 更新, 機能, 機能等, 此処, 注意, 管理, 編集, 記事, 近日, 追加, 雨,

Photo by Pixabay on Pexels.com

Twitter-API-v2ツイート数珠繋ぎ #コード公開 #php

2022.10.04

Logging

おはようございます。土日祝も関係なくブログは毎日書いています🤮。

さて、今日はPHP言語でTwitterAPIバージョン2（v2）を使用してツイート数珠繋ぎをする方法を抜粋して記載していきます。こういうコードは今のところ出回っていないようです。少し調べれば公式サイトに記載しているのだけども・・・。まだ、日本語に対応した記事が少ないようです。v2でツイートする方法やリツイートする方法は何故かあるのだけどリプライ（Reply）[/statuses/update]する方法が記事としては記載していなかったので?記載します。

<?php
require_once "vendor/autoload.php";
use Abraham\TwitterOAuth\TwitterOAuth;

class tw{
    var $connection = null;
    function __construct()
    {
        $this->connection = new TwitterOAuth(APIKEY, APISECRET,ACCESSTOKEN, ACCESSTOKENSECRET);
        $this->connection->setApiVersion("2");
    }

    function pickup_tweets(mixed $tw_text=null){
         $obj = (object)[];
        if(isset($tw_text) && is_array($tw_text)){
            foreach ($tw_text as $key => $value) {
                if(preg_replace("/[ |　]/","",$value)){
                    $obj = !$key?(
                        $this->connection->post("tweets", ["text" =>$value], true)
                    ):
                    (
                        $this->connection->post("tweets", ["reply"=>["in_reply_to_tweet_id"=>$obj->data->id],"text"=> $value], true)
                    );
                }
            }
            return true;
        }
        return false;
    }
}

最初に結論とコードのアルゴリズムに付いて解説します。まず、tweetsのパラメーターでリプライ出来るように変更されています。v1.1とはそこが変わっているので同じ仕組みを検索しがちですがそれでは検索にヒットしないようです🤔。まずはエンドポイントの変更点の確認が必要みたい👏。

Twitter API endpoint map | Docs | Twitter Developer Platform https://t.co/avBGzPHTEt
— 田岡寿章@taoka_toshiaki🦌 (@taoka_toshiaki) September 30, 2022

エンドポイントのv1.1からv2への対応表

エンドポイントのv1.1からv2への対応表が公式から出ているので確認してみてください↑。

次にコードの解説ですがまずTwitterOAuthライブラリをインストールを行い、defineなどの設定なども考慮した上で実行してみてください（コードに追記記載が必要）。変数、$tw_textは配列です。また投稿する文字が入っていると考えてください。そしてこのコードを下記のような考え方で実行してみてください。

<?php
       require_once "tw-index.php";
       $tw_text[0] ="test1";
       $tw_text[1] ="test2";
       $tw = new tw();
       if($tw->pickup_tweets($tw_text)){
        $ret["msg"] = "ok";
       }else{
        $ret["msg"] = "NG";
       }
       var_dump($ret);

※前提条件としてtwitter社にAPIの申請を行って受理されている事。

Twitter API v2 ツイート数珠繋ぎ

これで思った通り実行出来たと思います。尚、自分のように管理画面などを作って数珠繋ぎの投稿するのも良いかも知れません🫠。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年10月04 06:00日

タグ

2, Abraham, autoload, class, connection, function, lt, null, once, php, quot, Reply, require, statuses, tw, Twitter-API-v, TwitterAPI, TwitterOAuth, UPDATE, use, var, vendor, コード, サイト, ツイート, ところ, バージョン, ブログ, リツイート, リプライ, 今, 今日, 使用, 公式, 公開, 土日, 対応, 少し, 抜粋, 数珠繋ぎ, 方法, 日本語, 毎日, 祝, 言語, 記事, 記載,

映画、百花を観てきましたので感想を残しときます。

2022.09.15

Logging

おはようございます。昨日は久しぶりに映画を観に行きました。来週も水曜日か火曜日に観に行くつもりです。

さて、百花を観てきましたので感想を残しときますね。この映画、感動というよりは切ない気持ちになったのと、認知症という症状を凄くリアルに描いていましたし、認知症を通して人を描いていたように感じます。人ってなんだろうね本当に…。

『百花』予告【2022年9月9日(金)公開決定】

まとめ。とにかく映画を観て切ない思いになりました、感動するというストーリーではないですが、心に残る映画であり、心に染みる映画になっていると思います。

尚、上映期間中、観えなくともこの映画は耐え得る作品ですので、是非観てみてくださいな😌。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年09月15 05:25日

タグ

2, 7, com, https, kacpw, RF-g, watch, www, youtube, ストーリー, つもり, まとめ, リアル, 上映, 久しぶり, 人, 作品, 心, 感動, 感想, 映画, 昨日, 期間, 本当, 来週, 気持ち, 水曜日, 火曜日, 症状, 百花, 認知,

submit(サブミット)：送信させない４つの方法です🙄。#javascript #サブミットキャンセル

2022.09.07

Logging

おはようございます、台風一過が去りましたね😌。

さて、今日はsubmit(サブミット)：送信させない４つの方法を記載します、方法は大きく分けて２つの方法があり、それを細分化して４つの方法になります。まず、一番目は“送信する際（form側）”にてキャンセルする方法です。この場合、addEventListener（アッドイベントリスナー）でキャンセル処理する場合とonsubmitを使用してキャンセルする方法があります。

サンプルコード例１と例３にあたるコードが上記のコードになります。

次に”ボタンをクリック”した際にサブミット（送信）処理をキャンセルする方法です、この方法でも送信を阻止する事ができます。

サンプルコード例２と例４にあたります、自分としてはフォームで処理した方が良いかなと思いますが、こちらでも送信をキャンセルする事ができます。

尚、ソースコードは下記になります。また、参考にしたサイトのリンクを貼っときます。MDNのリンクです。

    <form id="frm" method="post" action="./example/">
        <input type="hidden" name="example" value="data">
        <button type="submit" class="btn btn-primary">Submit1</button>
    </form>
    <form method="post" action="./example/">
        <input type="hidden" name="example" value="data">
        <button id="btn" type="submit" class="btn btn-primary">Submit2</button>
    </form>    
    <form method="post" action="./example/" onsubmit="return func1()" >
        <input type="hidden" name="example" value="data">
        <button type="submit" class="btn btn-primary">Submit3</button>
    </form>
    <form method="post" action="./example/"  >
        <input type="hidden" name="example" value="data">
        <button type="submit" class="btn btn-primary" onclick="return func2()" >Submit4</button>
    </form>

//例１
document.getElementById("frm").addEventListener("submit",function(event){
    event.preventDefault();
});
//例２
document.getElementById("btn").addEventListener("click",function(event){
    event.preventDefault();
    event.stopPropagation();//インターフェイスのメソッドで、キャプチャおよびバブリング段階において現在のイベントのさらなる伝播を阻止します。 
});
//例３
function func1(){
    return false;
}
//例４
function func2(){
    return false;
}

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年09月07 06:02日

タグ

１, 2, ３, 4, addEventListener, Form, javascript, onsubmit, submit, アッド, イベント, キャンセル, クリック, コード, こちら, サブミット, サンプル, それ, フォーム, ボタン, リスナー, 一, 上記, 事, 今日, 使用, 例, 側, 処理, 台風一過, 場合, 方, 方法, 次, 細分化, 自分, 記載, 送信, 阻止, 際,

Photo by Archie Binamira on Pexels.com

千里の道も一歩からとはよく言ったものですね。毎日の？🤔

2022.09.04

Logging

おはようございます、台風が過ぎ去ったらまた暑い日なるのかな？

今日は動画を２本ほど朝視聴したので、その事を踏まえながらブログを記載していこうと思います。記事を読む前に動画を視聴してください、視聴したことを前提に記事は書いています。最初に見たのはウィリアム・マクレイブンさんの動画です。人々が笑っている所に何か大事なことが隠れているような気がします。毎日続けるという事は中々、出来ることではなくて大体の人が辞めてしまいます。おそらく９割の人は辞めてしまうのです。

変化は自分から起こす || ウィリアム・マクレイブン

変化は自分から起こす・ウィリアム・マクレイブン

次に茂木健一郎さんの”ネットで目立っている人にあこがれるなよ！”を見ました。これを見て日の目を見ない人にも凄い人はいるという事はよくわかりますし、何も得ることが出来ないという事も最もだと感じました。

ネットで目立っている人にあこがれるなよ！

ネットで目立っている人にあこがれるなよ！・茂木健一郎

自分のやりたいことがあるのならば、千里の道も一歩からという気持ちで毎日、担々とこなすことが大事になると思います。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年09月04 05:27日

タグ

0, 2, ９, com, gMcaNQ, https, NEO, watch, www, youtube, ウィリアム, こと, これ, ネット, ブログ, ふん, マク, マクレイ, もの, レイブン, 一, 中々, 事, 人, 人々, 今日, 何, 前, 前提, 動画, 千里, 台風, 変化, 大事, 大体, 所, 日, 日の目, 最初, 朝, 毎日, 気, 自分, 茂木健一郎, 視聴, 記事, 記載, 道,

Picture-in-Pictureっていう拡張機能が良いです😍

2022.09.03

Logging

こんにちは、収益化が出来ても収入が少なかったらやっぱ悩ましいものですね。

今日はPicture-in-Pictureっていうグーグル公式が開発したChromeの拡張（Edgeでも似たような物があります）。ピクチャー・イン・ピクチャー（拡張）はYOUTUBEの他にネットフリックス、アマゾン・プライムなどもピクチャ・イン・ピクチャに対応していてとても良いです。

映画を観ながら、ネットサーフィンは勿論のこと、プログラムコード（他のアプリ起動）もながら書くことが出来てしまいます。YOUTUBEは右クリック＊２回でピクチャー・イン・ピクチャーになることは知っていましたが、この拡張を使用すると拡張のアイコン・ボタンを押すか、ALT+Pでその機能を使用することが出来ます。

Picture-in-Picture Extension (by Google)

今まで公式が出してきた拡張機能の中でダントツ良いですねぇ～。本当に快適です。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年09月03 01:41日

タグ

2, ALT, Chrome, com, edge, https, LxCw-vvmIiI, Picture-in-Picture, watch, www, youtube, アイコン, アプリ, アマゾン, いん, グーグル, クリック, コード, こと, サーフィン, ダント, ネット, ネットフリックス, ピクチャ, ピクチャー, プライム, プログラム, ボタン, もの, 中, 今日, 他, 使用, 公式, 収入, 収益, 右, 対応, 拡張, 映画, 機能, 物, 起動, 開発,

Photo by Valeria Boltneva on Pexels.com

三柱さんちゅ三柱という経営者がいて。それが印象に残っている😌。

2022.08.27

Logging

おはようございます、この頃、映画を見に行けていません😌。

最初のIT会社の社長さんが三柱に拘っていましたが、確かに三柱無いと大変かもしれないなと今でも自分も思っています。三柱とは何か？三つの収益を確保することが大事、Aジャンル、Bジャンル、Cジャンルの事業があれば一つの柱が崩れても、何とか２つのジャンル（事業）で支えることが出来るということです。

この柱が何本もある程、良いと思いますが、経営者ではないので実際どんな物かは分かりません。また、この柱のジャンル（事業）が似通っているより全然違うジャンルの方が強い柱になります。特に不況下でも強い柱があると良いと社長さんが話されていました。

田我流 – Idea (Music Video)

イディアという曲

ちょっと風変わりな社長さんでしたが、経営の事を貪欲に勉強されていた印象が残っています。

今、自分が色々なサイトを立ち上げようとしている中でやはり似通っているジャンルは避けようとしているのは、そういう話を聞いた事があるからです。

自分も最低でも３つの収益を確保出来るサイトを作りたいなと思っていて、１つは微々たるものですが収益が出てきました。あと２つを作ろうとしていて一つはアイディアが出来ていてあとはそれを具現化するだけで良い段階です。もう一つは着手している段階ですが認知して貰うためには競合が多いのでSNSや広告をうちだします、その費用は他のサービスから充てがうのでリリースは遅くなります。

３つ以外にもアイディアはいろいろとあるので同時並行で具現化していきます。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年08月27 09:00日

タグ

2, IT, イディア, こと, サイト, ジャンル, それ, ちゅ, 一つ, 三, 三つ, 三柱, 不況, 中, 事, 事業, 今, 会社, 何, 何本, 勉強, 印象, 収益, 大事, 大変, 実際, 方, 映画, 曲, 最初, 柱, 物, 確保, 社長, 程, 経営, 経営者, 自分, 色々, 貪欲, 頃, 風変わり,

Photo by David Bartus on Pexels.com

言い切ると良い。思いますは戦後の教育の証。

2022.08.13

Logging

おはようございます、今日も湿気多めの暑さになるのでしょうか、想像すると萎えます⤵。

さて、カリスマや指導者は思いますを使わない。そういう事は知っていたのだけど思いますという事を頻繁に使い出したのは戦後から、戦前は民主主義がそれほど色濃くなかったので、そういう言葉は使わなかった。戦後、戦争に負け民主主義の思想を植え付けられ、この日本は事なかれ主義へ進むにつれ、「思います」という言葉を使うようになった。

https://www.youtube.com/watch?v=hKD-n2bUiXQ

因みに言い切りは何故良いのか？、言い切るのは聞いている人、読んでいる人を洗脳出来る力を秘めている。特に境界線知能と言われている人には刺さる（洗脳出来る）ので、ファンやカリスマ性を持ちたいのならば「思います」という言葉を捨て言い切ることに注意がければもしかするとファンが増える事に繋がるかもですよ。

そう言えばYOUTUBERやブロガー、インフルエンサーにせよ。殆どの人は思いますを使っていないですよね。彼、彼女らは曖昧な表現をなくすことにより人を引き付けている。

トイウコトデ、いつも使っている曖昧な表現を捨て言い切り文章に変えてみました。
教育って凄いな・・・って実感しました。知らず知らずに自分も洗脳されているだなって。誰にも洗脳されていない人っていないとは思いますが、本当に自分の力で考えられている人って恐らくあまりにも少ないじゃないかなってね。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年08月13 08:10日

タグ

2, bUiXQ, com, hKD-n, https, watch, www, youtube, YOUTUBER, カリスマ, こと, ファン, ブロガー, 主義, 事, 事なかれ, 人, 今日, 力, 境界線, 多め, 思想, 想像, 戦争, 戦前, 戦後, 指導者, 教育, 日本, 民主主義, 注意, 洗脳, 湿気, 知能, 言葉, 証, 頻繁,

Photo by Francesco Ungaro on Pexels.com

Laravelで再構築した2bbs-video.comをヨロシク😌

2022.08.10

Logging

こんにちは、よさこいをしている踊り子さん達へ、熱中症にはお気をつけてくださいませ。

本日はあまり使用されていなかった、2bbs-video.comをLaravelで再構築したお話を記載します。2bbs-video.comはYOUTUBE動画を共有するのに特化したサイトになります。当然、YOUTUBEのアドレスのない投稿はできません。今のところ動画の投稿内容は管理人が独断と偏見で管理します、その為、投稿していた内容が削除されるという事もあります。

サイトをLaravelで再構築していて、ページネーションが半端ないぐらい楽に生成できたのは凄く便利だなって感じましたが、逆にベタで構築できる技術も必要じゃないかなって思います。

laravelのページネーション（ページ番号の割付け）が楽だ。楽過ぎる。良いのかコレで🙄、#フレームワーク #Laravel pic.twitter.com/qojE6vEVpZ
— 田岡寿章@taoka_toshiaki🦌 (@taoka_toshiaki) August 8, 2022

そしてLaravelにはパッケージが豊富にあるのだけど、正直な所、どれが良いパッケージ（有名所）なのか分からないので調べる必要があるなって感じました。それまでは自分で作るしか無いかもしれない、そういう所などの経験値を積まないとLaravelゴリゴリ使えますとは言えないなと。ただ、大体の勘所は掴めましたね。あとは習うより慣れろ感覚でいろいろと制作していきます😌。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年08月10 05:32日

タグ

2, bbs-video, com, Laravel, youtube, アドレス, お気, お話, キャッチャー, サイト, ところ, どれ, ネーション, パッケージ, ページ, ベタ, よさこい, 事, 今, 使用, 便利, 偏見, 共有, 内容, 削除, 動画, 半端, 必要, 所, 技術, 投稿, 有名, 本日, 構築, 正直, 為, 熱中症, 特化, 独断, 生成, 管理, 管理人, 記載, 調, 豊富, 踊り子, 逆,

自分用に短縮ＵＲＬを作りました。自分以外短縮URLは登録できません。

2022.07.29

Logging

こんばんは、サービスの収益化はなかなかうまく行かない。

さて、今日は数分で開発した自分用の短縮URLです。外出先やスマホで長々とURLを直打ちするのも面倒です、ググるのもめんどくさい。そういう時のためにこういう物を作ったわけです。

https://zip358.com/	http://t2t.jp/z
https://yahoo.co.jp	http://t2t.jp/y
https://google.co.jp	http://t2t.jp/g
https://www.youtube.com	http://t2t.jp/yt
https://www.amazon.co.jp/	http://t2t.jp/a
https://www.rakuten.co.jp/	http://t2t.jp/r
https://newspicks.com/	http://t2t.jp/n
https://www.tohotheater.jp/	http://t2t.jp/t

短縮URL対応表

考え方はこんな感じ短縮URLを叩く（入力すると）、ルート場所で処理を行います。そしてあらかじめ登録してあるURLをデータベースのテーブルから参照し、URLの対応表の中にあればダイレクト転送処理を行うという形です。尚、こういうサービスを行なっている。サイトは結構あります、一番老舗はbitly.comです。

因みに短縮URLを登録する画面もあるのですが、そちらのURLはシークレットです。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年07月29 12:02日

タグ

2, 358, ahttps, Amazon, co, com, comhttp, ghttps, Google, ht, http, https, jp, jphttp, newspicks, nhttps, rakuten, rhttps, tohotheater, url, www, Yahoo, yhttps, youtube, ythttps, zhttps, zip, サービス, スマホ, ため, わけ, 今日, 収益, 外出, 数分, 時, 物, 登録, 直打ち, 短縮, 自分, 開発, 面倒,

Chrome拡張の作り方という本は読む人を選ぶ本かも？

2022.07.27

Logging

おはようございます。今日は途轍（とてつ）もなく眠いですが、早朝ウォーキングしてきました😂。

さて、Chrome拡張の作り方という本のコードと解説をささっと流し読みしたので、感想を少しだけ書いていきます。まず、この本（電子書籍）はProが書いた本ではなく、書くことに関してはおそらく素人が書いた本だと思います（今では誰もが本を出版出来る時代ですから）。

ですが、ある一定の知識とプログラミング言語の知識がある人が読むと勘所を抑えていて良質な本だと思います、レビューではリンク先がないなどの意見もあるのですがそういうのは自分は気にしないし、Chrome拡張開発の勘所とManifest V3対応版にいち早く対応した本として良いなと感じました。

ググってもManifest V2対応のコードばかり出てくるので最新のManifest V3対応のサンプルコードが無いのでとても助かります。英語が分かる人ならChrome拡張開発の公式ドキュメントを読めば理解できると思うのですが、自分は英語が読めないに等しいのでとてもChrome拡張の作り方という本は役立ちました。

尚、自分が開発しているChrome拡張は来週にはリリース出来るかと思います、審査が通らなければ少し遅くなるかもですけどね。

著者名 @taoka_toshiaki

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

OFUSEで応援を送る

投稿日時 2022年07月27 06:29日

タグ

2, ３, Chrome, Manifest, Pro, ウォーキング, コード, こと, サンプル, とき, とてつ, プログラミング, リンク, レビュー, 一定, 人, 今, 今日, 作り方, 公式, 出版, 勘所, 対応, 少し, 意見, 感想, 拡張, 早朝, 時代, 書籍, 最新, 本, 気, 知識, 素人, 自分, 良質, 英語, 解説, 言語, 誰, 途轍, 開発, 電子,

@Blog{zip358.com}

日常日誌からプログラムやYOUTUBER紹介、旅日記まで日々更新中です。

2,3日、休止します．

ドメインの奪還しました。汚れたドメインを

オクトパストラベラー壱と弐が良さげ #マルチプラットフォーム #RPG

ドラえもんは日本のディズニーかもなって。 #ネトフリ #STANDBYME2

映画、そして、バトンは渡されたを観ました。 #ネトフリ #映画 #Netflix

chart.jsでデモを試してみました。📈 #javascriptcode

POSTとGETの考え方について伝えている動画。 #以心伝心

cssとjsを動的に読み込むソースコード２。#jscode

データからページネーションが出来る。 #jscode

htmlとcssとjavascript-初学フロント側-No.１#code

Qiitaのfeedを取得して表示するだけのコード非同期編？ #phpcode

Qiitaのfeedを取得して表示するだけのコード。 #php

これ無料で見えるのか、これはニッチな戦略かな。 #的を得た #労働者2

WP予約投稿ツイートプラグイン作り方。＃php言語 #code #v2

数珠繋ぎのツイートシステムに予約機能を付けました😂 #php #code

Twitter-API-v2ツイート数珠繋ぎ #コード公開 #php

映画、百花を観てきましたので感想を残しときます。

submit(サブミット)：送信させない４つの方法です🙄。#javascript #サブミットキャンセル

千里の道も一歩からとはよく言ったものですね。毎日の？🤔

Picture-in-Pictureっていう拡張機能が良いです😍

三柱さんちゅ三柱という経営者がいて。それが印象に残っている😌。

言い切ると良い。思いますは戦後の教育の証。

Laravelで再構築した2bbs-video.comをヨロシク😌

自分用に短縮ＵＲＬを作りました。自分以外短縮URLは登録できません。

Chrome拡張の作り方という本は読む人を選ぶ本かも？