みの雑多ブログ

勉強したことをアウトプットしたり、しなかったり

MySQLでデータベースを作成して、指定ユーザーに権限を付与

( ..)φメモメモ

mysql -u root -p
Enter password:
Welcome to the MySQL monitor.  Commands end with ; or \g.
Your MySQL connection id is 9
Server version: 8.0.25 MySQL Community Server - GPL

Copyright (c) 2000, 2021, Oracle and/or its affiliates.

Oracle is a registered trademark of Oracle Corporation and/or its
affiliates. Other names may be trademarks of their respective
owners.

Type 'help;' or '\h' for help. Type '\c' to clear the current input statement.

mysql> CREATE DATABASE [DB名];
Query OK, 1 row affected (0.01 sec)

mysql> GRANT ALL ON [DB名].* TO [権限付与したいユーザー名];
Query OK, 0 rows affected (0.01 sec)

Laravelでapiを作るには

環境

PHP 8.0.6 (cli)
Laravel Installer 4.2.5

手順

php artisan make:controller [コントローラー名]

できたファイル(コメントなど省略)

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class [コントローラー名] extends Controller
{
    public function index()
    {
    }

    public function store(Request $request)
    {
    }

    public function show($id)
    {
    }

    public function update(Request $request, $id)
    {
    }

    public function destroy($id)
    {
    }
}

全件取得、登録、id指定取得、更新、はかい~!のメソッドが自動で記載される

api.phpに追記

Route::apiResource('/hogehoge', '[コントローラー名]');

ルーティングされているものを見てみる

php artisan route:list
+--------+-----------+------------------------+------------------+-------------------------------------------------+------------+
| Domain | Method    | URI                    | Name             | Action                                          | Middleware |
+--------+-----------+------------------------+------------------+-------------------------------------------------+------------+
|        | GET|HEAD  | api/hoge               | hoge.index       | App\Http\Controllers\HogeController@index       | api        |
|        | POST      | api/hoge               | hoge.store       | App\Http\Controllers\HogeController@store       | api        |
|        | GET|HEAD  | api/hoge/{hoge}        | hoge.show        | App\Http\Controllers\HogeController@show        | api        |
|        | PUT|PATCH | api/hoge/{hoge}        | hoge.update      | App\Http\Controllers\HogeController@update      | api        |
|        | DELETE    | api/hoge/{hoge}        | hoge.destroy     | App\Http\Controllers\HogeController@destroy     | api        |

わお!全部盛りが秒で作れるやん。
Laravel界では当たり前かもしれないけど、感動した。

typescriptでエラーが発生すると、エラー行がずれてどこが悪いのかわからない件

最近、学ぶことが多いのに全然残せてない。
TypeScriptなるもの使っていて、エラー行がずれていたのでその時のことを( ..)φメモメモ

環境

$ node -v
v16.3.0
$ npm -v
7.15.1

現象

npx経由でts-nodeコマンドを実行
エラーをわざと発生させていた時に、なぜかコメントが悪いような表示になった
vscodeopen file editor選んでみてみても、そこには全然関係なさそうな実装が・・・
「んーずれてますね」ということで直していく

$ npx ts-node .\src\index.ts

D:\work\xxx\src\index.ts:33
        // hogehoge
                      ^
Error: status:400(Bad Request) url:/xxx
    at D:\work\xxx\src\index.ts:50:19
    at step (D:\work\xxx\src\index.ts:33:23)
    at Object.throw (D:\work\xxx\src\index.ts:14:53)     
    at rejected (D:\work\xxx\src\index.ts:6:65)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

まず、いただきます

$ npm i --save-dev @types/source-map-support

tsconfig.jsonに追記

{
  "compilerOptions": {
    /* Visit https://aka.ms/tsconfig.json to read more about this file */

    /* Basic Options */
    "target": "es5",
    "module": "commonjs",                       
    "sourceMap": true,
// 以下、省略

コードに追記

import sourceMapSupport from 'source-map-support';
sourceMapSupport.install()

実行してみる

$ npx ts-node .\src\index.ts

D:\work\xxx\src\index.ts:33
        const items= res.data;
                      ^
Error: status:400(Bad Request) url:/xxx
    at D:\work\xxx\src\index.ts:52:19
    at step (D:\work\xxx\src\index.ts:33:23)
    at Object.throw (D:\work\xxx\src\index.ts:14:53)     
    at rejected (D:\work\xxx\src\index.ts:6:65)

問題なく表示されるように!ヤッタネ!!

さいごに

Java使っているときも、ちゃんと設定していないとデバッグしたときにずれていたなーと思い出した。

働きながら大学の単位を取得すること

社会人になってから高等学校の情報の教員免許を取得する道のり(出願編) - やまみの雑多ブログ
出願して入学してから、はや2か月が経ち、ようやく進捗があったので少し( ..)φメモメモ

情報の教員免許取得に向けて通信で勉強に励んでいる中、いろいろ思うところがあったので記載

単位を取るために実際にやること

大学によって違うと思うけど、通信教育の一例として・・・
私の場合は科目によって、以下のどちらかで単位が取得できる

①課題図書を読みリポートを書く⇒リポートが合格なら、試験を受ける
②オンライン講座を受講⇒実際の講義を受ける⇒試験を受ける

今回は①のリポートをようやく提出できたので、それについて主に書く

時間が足りぐるしい

入学する前から分かっていたことといえども、実体験として感じた

  • 8時起床
  • 9時から18時まで働く(遅いときは20時まで)
  • ご飯を食べる
  • 習慣の勉強をする
    • 2分間コーディング
    • 最近気になる技術本の読書
    • 勉強会の準備
  • リポート課題の図書を読む or リポートを書く

寝不足はよくないと思って、0時までには寝たいと思っているけどやりたいことが多すぎで寝る時間が遅くなる。
もとからロングスリーパーなので、4月・5月は自分に甘くなってリポート課題図書がなかなか読めずにいた。。

一日一ページでもよいので読む

リポート書くフェーズなら、とりあえず一行でも書くようにする!
4月・5月進捗がなくて、本気でやばいと思い始め、週末にガンガン行こうぜ方式を変えることにした。
問題としては①やろうとする気になかなかなれない②量が多くて憂鬱になっていることではないかと思い、タイトルの方法を実践することにした。
とりあえず、本を開くことをマストにして、一ページだけでも読むことにした。
※これは2分間コーディングで気づいたことでもある

いざ、読み始めたらそのまま集中して続くこともあるし、気分が乗らないときは諦めて「とりあえず一ページ読んだ」事実から精神的に健康でいられる
たった一ページじゃ、永遠に終わらないんじゃ・・・と思うけど一日一日の積み重ねによって負荷分散されて、一日の負荷が楽になる
特に週末は仕事もないし、勉強するぞぉってなるけど、最低5ページのアドバンテージがあるのとないのとでは全然違う
一日めちゃくちゃ頑張ることよりも、継続するが何よりも大事とここ3ヵ月で気づいて(やっと気づいたw)どうにかリポート課題を2つ提出するに至れた

実際にコード書くことが楽しいと気づいた

上にも書いた通り、最近2分間コーディングをするようになった(家族からは何故今!!と言われた)
2分間コーディングのすすめ、コードを書く習慣のハードルを下げる

今まで、時間がないを理由になかなかプライベートでコードを書いてなくてプライベートアカウントのGitHubは草生えてなかった
↑の方のブログを同僚に共有してもらって、時間という言い訳はやめてとりあえず始めた
本当に厳しいときは2分くらいで終わるけど、結構な頻度で2分以上はコード書いている
仕事では当たり前でも、プライベートでデータを永続化できた時はなんか興奮した

プライベートもエンジニアなんて、私には無縁だわと思っていたけど、やっぱり動くモノ作るのは楽しいと思えるのは一つの収穫と思う
かつ、2分間コーディングの後に、リポート課題の順に毎日スケジューリングしてて

リポート<<<<<<<<<<<<|||壁|コーディング

って感じで、やっぱりコーディング続けたい、こっちのが楽しい・・ってなってしまう笑
課題図書がネットワークだったり、コンピュータとか情報システムのこともあれば、ソーシャルメディアとかビジネスなこともあり、
大切な知識ではあるけど好みはあるし、かなり難解な主張を読まないといけないこともしんどいと思ってしまうことはある
そんなわけで、作るを仕事にできたのは幸せだなって実感できた

リポート書くは最高のアウトプット手段で深まりが過ぎる

よく技術本読んだら手を動かせよ、とか、本読んだらブログとかに書こう、とか、一般的に言われてるし、私もなんとなく実践していた
もちろん、しないより身についた実感はあるけど、世の中アウトプットしていない職種いっぱいあるのに、この職種大変だなマジで・・
と思っていた(つまりはアウトプットめんどくせぇなって思ってた)

リポート書いてみて、今までは知識が深まるアウトプットができていなかったんだって気づいた
リポート書いてると、あれ?これってなんだっけ、となって調べる⇒深まる⇒進む⇒また課題見つかる⇒・・・ってなる
(個人的にあまり課題にぶつかりすぎると永遠にブログに書き終わらないから、私はライトに書きたいと思っている)

ブログと違ってリポートは単位取るために本気だから、この繰り返しでより知識が深まった
深まると楽しくなる現象が起こって、今まで仕事で見えてなかった部分が見えてくる(私の場合はネットワークだった)
「あ、そうか!これってそういうことだったんだ」って気づき、「じゃあここはどうなってるんだろ・・あれ、ナニコレ」となり、
そこからまた調べたり、大パイセンと雑談中に「そういえば、こんなことがあって~」みたいな話ができるようになる(快く教えてくれる人が近くにいてヨカッタ)

知識がないと、わかっていないことがわからない。まさに無知の知。ってことを思い知ったリポートだった
冒頭の腐った考えから、こういう知識の取得って仕事楽しくするためのものだったんだな。って思っている
分からないことを永遠にそういうものだからで進めると、やっぱりつまらないし
一緒に働いている人と知識の共有やお話ができるのも、同じものを共有できる幸せというか(私だけかな)


単位とは関係のない話になったけど、結論しんどいけど楽しいよということで、引き続き免許取得に向けて頑張る

BacklogAPIの課題追加でUrlFetchApp.fetchして出会ったエラー集

developer.nulab.com

BacklogAPI便利ですよね。

APIを使う上で色々出くわしたエラーとそのときの対応策

①URL長すぎ

Exception: 上限を超えています: URLFetch URL の長さ

URLが2KB超えると、エラーになる。
テンプレの内容を課題の詳細に設定したりすると超えたりする。
URLが長い原因として、URLにパラメータ付与してGETリクエストにしていることがある。
GETリクエストではなく、POSTに切り替える。


②項目ないっすよ

muteHttpExceptions: trueにして、返ってきたレスポンス

400 "errors":[{"message":"Expect [項目名].","code":7,""}

必須項目がないですよと言われている。
確かに設定していない、という場合は、リクエストに[項目名]を追加する。
[項目名]リクエストに含んでるのになぁ、って時は、Content-Typeでしている形式とリクエストの形式が正しいかチェック(無駄にここで詰まってしまった)

"Content-Type" : "application/x-www-form-urlencoded"なのに、JSON形式で送ろうとしてしまってた。
developer.mozilla.org


③形式違うっすよ

400 "errors":[{"message":"error.invalid : [項目名]","code":7,"moreInfo":"[項目名] requires number. Raw input: [値].0"}

修正している間に出てきたエラーで、UrlFetchApp.fetchはなぜか整数じゃなくて小数点第一位付きに変換するみたい。というのが分かっただけの例
これ自体がエラーの課題ではなかったが、一応メモとして残す。

URL指定して画面キャプチャを一括で作成

developers.google.com

CLIで画面キャプチャとるんです

chromeのヘッドレススクリーンショット優秀すぎてびっくり
Firefoxもあるそう。。今回はchromeで。

Windowsコマンドプロンプトde実行

"C:\Program Files\Google\Chrome\Application\chrome.exe" --headless --disable-gpu --screenshot=[画像フォルダ/画像名].png --window-size=1280,1696 [画面キャプチャ撮りたいURL]


URLがあれば、全部すぐに撮れる。
Basic認証かかってるやつはhttps://[ユーザー名]:[パスワード]@www.xxx.com/hogehoge/で。

フルフルとれないところが課題。
ここからは結構大変だったので、やる気元気モリワキじゃない人は離脱で。

API使って画面キャプチャフルフルとる

Davidさんのブログを参考に、と書いてあるので試みる
→ 壁にぶつかる。node.jsワカラナイ
dschnurr.medium.com

とりあえず、node.jsをインストール(ダウンロード | Node.js)する
Node.js command prompt立ち上げる

次は必要なパッケージをインストールする
npm…node package manager
composerにお世話になってるので、それのnode版かぁ~という感じ。

npm init -y
npm install chrome-remote-interface --save
npm install chrome-launcher --save

ファイル実行する

node [ファイル名].js

わぁい、動いた。output.pngでキャプチャ撮れてる。Bufferが非推奨なのかな・・?
って、node.jsわからな過ぎてびっくりした。(javascript分かったら、わかるんじゃねという甘い考えだった)
ちょっと勉強して仕切りなおす。。

vscodeのpowershellにパスを通す

Docker Desktopから『Open in Visual Studio Code』選択するとdocker -vが使えるが、
そうでないとvscodepowershellにパスが通ってないことがあった。

システム環境変数にあるものとpowershellのパスは別物。

  • 確認コマンド
    (見やすく;区切りに)
$ENV:Path.Split(";")
  • 一時的な追加
    (通したいパスは複数可)
$ENV:Path=$ENV:Path+";[通したいパス]"
  • 永続的な追加
    (Machineでシステム環境)
[Environment]::SetEnvironmentVariable("Path", $ENV:Path + ";[通したいパス]", [EnvironmentVariableTarget]::Machine)