ちあぴのデブ活のーと♡ ～developer活動覚え書き～

HTMLタグのエスケープ

&などの特殊文字に置き換えることでエスケープする。
主な記号は以下の通り。

コメントアウト

一行コメントアウトはなし。 ブロックコメントは<!-- --!>で囲む。
コメント内は-の連続使用を避け、=などで代用する。

エラーチェック

https://validator.w3.org/nu/#textarea

脆弱性対策

aタグでtarget="_blank"するときにrel="noopener noreferrer"を付ける。

タグの使い分け

リファレンスはリンク先で確認できる。
https://developer.mozilla.org/ja/docs/Web/HTML/Element

flex チートシート

hoverで表示される補足説明

title属性を付与することで、hoverで表示される補足説明を実装できる。

          <pre title="example"> ここにhoverしてね </pre>
          

見ての通り非常に気づきにくいので、どこかに誘導が必要。CSSの::beforeでhoverしたくなる✏絵文字や画像を挿入するとか。

コメントアウト

一行コメントアウトはなし。 ブロックコメントは/* */で囲む。

改行

行末（中括弧の中）にセミコロンが必要

p{color:black;}

エラーチェック

https://validator.w3.org/nu/#textarea

可読性

可読性について言及したサイト https://japan-design.jp/design/0052/

width

width: auto
それ以外→width:100%
percentageは親要素に対する割合で指定
pxやemで指定するときはmin-width, max-widthを使う
画像サイズはmax100%がよい

文字コンテンツの幅は640pxくらいがおすすめ

16pxのとき約35文字表示される

font-size

標準は16px, 大き目なら18px

読む前提の文字は英小文字で12px, 日本語なら10pxが最小サイズ

そもそもChromeは基本10px未満にしても10pxで表示される。

文字の大きさの参考 https://blog.upshare.co.jp/2021/07/3730/

html{ font-size: 16px; }

textbox風

width: auto

marginとpadding

marginがborderの外側、paddingが内側

pre内で折り返す

          pre{white-space: pre-wrap;}
          

逆に、長くても折り返さず横スクロールバーのタイプにしたいときはpre{overflow: auto;}にする。

複数指定

複数の属性を",", " ", ""のいずれかで接続して指定できる。

            <p class="child2">outer parent</p>

            <div class="parent">

            <p class="child1">Hello </p>

            <p class="child1 child2">World!!</p>

            </div>

          

            .parent,.child2{ /*-- parent or child2 --*/

            background-color: lawngreen;

            padding:0.1em 2em;

            }

            .parent .child1{ /*-- child1 in parent --*/

            background-color: green;

            color: lavender;

            }

            .child1.child2::after{ /*-- child1 and child2 --*/

            content: "  <- after";

            }

          

変数

            /* 変数の宣言 */

            :root{--favorite-color: pink;}

            

            /* 変数の参照 */

            main{background-color: var(--favorite-color);}

          

正式にはカスタムプロパティ。

変数名はハイフン二つで始まる。慣例的に単語の区切りではスペースの代わりにハイフンを用いる。

上の例においてrootはただのスコープなので勿論htmlや特定のclass等でも構わない

color code usage

以下の表は（一部の色のみ）hoverで補足説明を表示できるので参照のこと。

参考サイト
https://www.colorsexplained.com/shades-of-pink-color-names/

classのサンプル

            class Person{

            constructor(firstName,lastName){

            this.firstName = firstName;

            this.lastName = lastName;

            this.title = "NEET"

            }

            get fullName(){return this.firstName+" "+this.lastName}

            }

            class Student extends Person{

            constructor(firstName,lastName,teacher){

            super(firstName,lastName);

            this.teacher = teacher || new Teacher("Jane", "Does",[]);

            this.title = "student"

            }

            }

          

console.logをもっと使いやすく

            function getJst(){

            const jst = new Date(Date.now() + ((new Date().getTimezoneOffset() + (9 * 60)) * 60 * 1000));

            return jst

            }

            

            function strJst(jst){

            return jst.getFullYear() + "/" + (jst.getMonth() + 1) + "/" + jst.getDate() + " " + jst.getHours() + ":" + ("0" + jst.getMinutes()).slice(-2) + ":" + ("0" + jst.getSeconds()).slice(-2) + ""

            }

            var black = '\u001b[30m';var red = '\u001b[31m';var green = '\u001b[32m';var yellow = '\u001b[33m';

            var blue = '\u001b[34m';var magenta = '\u001b[35m';var cyan = '\u001b[36m';var white = '\u001b[37m';

            var gray = '\u001b[90m';var reset = '\u001b[0m';

            const consolelog = console.log;console.log = (...a) => consolelog(strJst(getJst()), ...a);

            const consoleerror = console.error;console.error = (...a) => consoleerror(strJst(getJst()),"<CRP ERROR>\n", yellow, ...a, reset);

            console.errorln = (...a) => consoleerror(strJst(getJst()),"<CRP ERROR>", yellow, ...a, reset);

            console.gray = (...a) => consolelog(strJst(getJst()) + gray, ...a, reset);

          

package.json

npm initで作れる。node index.jsで実行。

wait 関数

            const wait = async (ms) => new Promise(resolve => setTimeout(resolve, ms));

            async function main(){

            console.log("before 2000 ms");

            await wait(2000);

            console.log("after 2000 ms");

            }

            

            main();

          

            const {sleep, msleep} = require(sleep);

            

            console.log("Hello, World!!");

            msleep(500);

            console.log("after 0.5 second");

            sleep(3);

            console.log("after another 3 seconds");

          

for statement

            for (let i = 0; i < array.length; i++){

            console.log(` array[${i}]: ${array[i]}` );

            }

          

            for (cmd of commands) {

            execute(cmd);

            }

          

バッククォート` ` と$()

どちらも同じように使われる。括弧内がコマンドの実行結果で置換される。バッククォートでネストする場合、エスケープが必要になる。

            echo "Now is $(date "+%Y/%m/%d %H:%M:%S")"

            echo "Now is ` date "+%Y/%m/%d %H:%M:%S"` "

            someCommand ` echo "Now is \` date "+%Y/%m/%d %H:%M:%S"\` "` 

          

エスケープ

&, <, >, |, \は^でエスケープする。

^自身は^^のようにエスケープする。

enableDelayedExpansion（後述）設定時は!も^^!のように^2個でエスケープする。

例外的に%は%%のようにエスケープする。

正規表現を用いて検索ができるstrfind関数内では、\, [, ], ", ., *, ?が\によりエスケープされる。

プログラムの成否による分岐

1. ||, &&を用いる方法
2. ErrorLevelによる分岐

            @echo off

            

            :setName

            set /p name="What's your name?" || set name=Anonymous

            echo %name% | find /i "cheerppy" && echo Hello World! || echo Hi, %name%

            

            :choice

            choice /c ync /m "Are you sure to exit?" 

            if errorlevel == 1 exit

            if errorlevel == 2 goto setName

            if errorlevel == 3 goto choice

          

If ErrorLevel <int> (...)構文

ErrorLevelが引数以上の時(...)を実行する

            @echo off

            

            cd > nul

            echo +++ Error hasn't occurred. +++

            echo %%errorlevel%% = %errorlevel%

            if errorlevel 0 echo invoked always

            if errorlevel 1 echo invoked only when Error occurred

            

            
                rem コマンド cd に成功

                rem 期待される出力結果: 

                rem > %errorlevel% = 0

                rem > invoked always

            
            

            type

            

            echo +++ Error has occurred. +++

            echo %%errorlevel%% = %errorlevel%

            if errorlevel 0 echo invoked always

            if errorlevel 1 echo invoked only when Error occurred

            pause>nul

            

            
                rem typeは引数不足なのでエラーを返す

                rem 期待される出力結果: 

                rem > %errorlevel% = 1

                rem > invoked always

                rem > invoked only when Error occurred

            
          

%ErrorLevel%を直接setしてはならない。そうしてしまうと、動的な定義を無効化して上書きしてしまい、期待される挙動を得られなくなってしまう。
もし誤ってsetしてしまった場合は、set ErrorLevel=（右辺は何も書かない）とすることで、上書きして作ってしまった環境変数を削除し、元の挙動が得られるようになる。

このような動的な環境変数には以下のようなものがある。

• %ErrorLevel%
• %cd%
• %Date%, %Time%
• %Random% - 0から32767(15bit)の間でランダムな10進数に展開する。

遅延環境変数!hoge!

環境変数は変数が呼び出されるその行へたどり着いたときに展開（＝読み込み）される。
また、( )で括られた部分は一行とみなされる。
すなわち、( )内での変数の変化には対応できない。

遅延環境変数を用いると、その変数が呼び出されるコマンドにたどり着いたときに展開される。

使用するときはsetlocal enableDelayedExpansionを宣言し、変数を!で囲む。

            @echo off

            setlocal enableDelayedExpansion

            

            set age=20

            

            if %age% == 20 (

            set /a age=%age%+1

            echo %%age%%=%age% in the bracket

            echo ^^!age^^!=!age! in the bracket

            )

            echo %%age%%=%age% outside the bracket

            

            
                rem 期待される出力結果: 

                rem > %age%=20 in the bracket

                rem > !age!=21 in the bracket

                rem > %age%=21 outside the bracket

            
          

右クリの送るメニューに表示

作ったbatスクリプトを%AppData%\Microsoft\Windows\SendToに入れておくと、ファイル右クリックの送るメニューからファイルを引数%1に取ってスクリプトを実行できる。

このディレクトリはshell:sendtoからも開ける。

C-Lang

              #include <stdio.h>

              #include <stdbool.h>

              

              int main(void) {

              // ここにコードを記述

              return 0;

              }

            

printf("hello world!\n");

              int age;

              printf("how old are you?\n\t> ");

              scanf("%d", &age);

              printf("you are %d years old!\n", age);

            

              int age;

              double height = 163.1;

              char sex = 'F';

              

              // 文字列はcharの配列で表現し、最後にnull文字('\0'あるいは0)で終わる。

              char text1 [4] = {'F', 'o', 'o', '\0'};

              char text2 [4]; text2[0] = 'B'; text2[1] = 'a'; text2[2] = 'r'; text2[3] = 0;

              char text3 [4] = "Baz";

              printf("%s%s%s", text1, text2, text3); // => FooBarBaz

            

              // if 文の例

              int judgeAdult(int i) {

              int adultAge = 18;

              

              if (i < 0) {

              return 1; // 異常終了

              }

              else if (i >= adultAge) {

              printf("you are adult!\n");

              return 0; // 正常終了

              }

              else {

              printf("you are too young!\n");

              return 0;

              }

              }

            

                
                    // switch 文の例

                    // switch文はフォールスルーできる

                    // C言語の歴史的にはイベントハンドラでよく使われる

                
              switch (country) {

              case Country.Japan:

              lang = Lang.Japanese; break;

              

              case Country.China:

              lang = Lang.Chinese; break;

              

              case Country.Brazil:

              case Country.Portugal:

              lang = Lang.Portuguese; break;

              

              default:

              lang = Lang.English;

              }

            

              // for 文の例

              for (int i = 0; i < 3; i++) {

              printf("i = %d, ", i);

              }

              // 繰返し変数iはブロック外から参照できてしまう

              printf("result: %d", i); // => 0, 1, 2, result: 3

              

            

              // while 文の例

              int i = 0;

              while (i < 3) {

              i++;

              printf("i = %d, ", i);

              }

              printf("result: %d", i); // => 1, 2, 3, result: 3

            

              typedef struct {

              int age;

              double height;

              char sex; // M or F

              } Person;

              

              Person john = {22, 173.2, 'M'};

              Person jane;

              jane.age = 20;

              jane.height = 158.1;

              jane.sex = 'F';

              

            

              int num; int* pnum;

              

              num = 100;

              printf("num = %d\n", num); // => 100

              

              printf("\n// pnumはポインタ変数\n");

              pnum = #

              printf("pnum = %p\n", pnum); // => 0x7fff12

              printf("&num = %p\n", &num); // => 0x7fff12

              

              printf("\n// ポインタから参照先の値を取得することもできる\n");

              printf("num = %d\n", num); // => 100

              printf("*pnum = %d\n", *pnum); // => 100

              printf("*(&num) = %d\n", *(&num)); // => 100

              

              printf("\n// pnumのアドレスも参照できる。intは4byteなので, &pnumは&num+4の値を取る\n");

              printf("&num = %p\n", &num); // => 0x7fff12

              printf("&pnum = %p\n", &pnum); // => 0x7fff16

              

              printf("\n// pnumの操作がnumに影響を与える\n");

              *pnum = 200;

              printf("pnum = %p\n", pnum); // => 0x7fff12

              printf("*pnum = %d\n", *pnum); // => 100

              printf("num = %d\n", num); // => 100

              

              printf("\n// 逆もまたしかり\n");

              num = 300;

              printf("pnum = %p\n", pnum); // => 0x7fff12

              printf("*pnum = %d\n", *pnum); // => 100

              printf("num = %d\n", num); // => 100

              

            

Java

ソフトウェアライセンスおすすめ

MIT

ライセンス汚染

GNU GPL

Win10 shortcut.lnk

Ctrl+ドラッグ＆ドロップでファイルのコピーを、Alt+ドラッグ＆ドロップでファイルのショートカットを作成できる。

右クリドラッグ＆ドロップでも似たようなことが可能（選択できる）。

以下のテキストを「項目の場所」として記述することができる。

• batファイル

  cmd /c "hogehoge.bat"

• online ExcelファイルをDesktopアプリで開く

  ms-excel:https://cheerppy.xyz/fugafuga.xls

• Desktopを表示

  explorer shell:::{3080F90D-D7AD-11D9-BD98-0000947B0257}

Run...

一覧以外でもPathさえ通っていれば何でも開く。（規定では拡張子.lnkは省略できないが%PathExt%を編集すると省略可能になる。）

Ctrl+Shift+Enterで管理者として実行する。

以下自分用カスタムコマンド