2022-03-26

CSSのベンダープレフィックス

概要

日記です。内容としてはCSSの与太ごとになります。記事があったよ！の備忘録です。

ベンダープレフィックス

大昔のバイトでCSSのことを触りだけ学んだ。その際「ブラウザごとにオレオレ実装があるし、ようわからんから付けといたほうがいいもの」としてベンダープレフィックスなるものを学ばされた。ベンダープレフィックスとは具体的には"-webkit-"などが頭についた後にmarginやtextやらのいつも通りの実装の一部がくっついたものである。完成するときに一回全部CSSを調べるサイトや拡張にぶち込んで、これあるぞ！って示されたらコピペしろということしか私の頭にはなかった。思い出したので久しぶりに調べたらベンダープレフィックスの一部はもう不必要というのを各所で見つけた。しかしながらデザインの細かい所をやり始めると指定しなければいけないのが多いのは変わらないらしい。

【CSS】そのベンダープレフィックス、もう要らない！ベンダープレフィックスが今後不要なものを羅列する2019 ｜ LUCKLOG

ベンダープレフィックス－CSSの基本

WebKit の CSS 拡張 - CSS: カスケーディングスタイルシート | MDN

感想

参考ドキュメントが古い場合があるし、都度やっていかなきゃねぇ。便利になるばかりで嬉しい。カスタマイズ性が上がるのは同時に大変なことでもあるけれども。

2020-10-10

日記 - try hack me "Learn Linux"を添えて

概要

日記です。ためになることはほんの少しです。

trend micro ctfで0点を取った僕です。

trend micro ctf にでた

正直何もできなかった。「base64だー復号しろー」とまでやって「なんだこの文字列は」と9時間うずくまってしまった。

もうちょっとどころじゃないけど、powerを付けていきたいね

try hack meのやつ

try hack meをやり始めた。何となく基礎からやりたかったのでぼちぼち亀の歩みで進めている。

Learn Linuxを終わらせたところまできた。(ズルして解答見たけど)

最後の問題が自分の中で腑に落ちていなかったのでその理由を添える。

Learnlinux bonus challenge

目標が/root/root.txt。これはroot権限がないと閲覧できない。

順当にいけばshiba4が現在のユーザーになっている。

まずはroot権限が欲しいといったところから"root権限をもつユーザーに切り替える"ことを目標にする。

ユーザー一覧はtask39から/etc/passwdを使用して末尾を見ると nootnoot, shiba1, shiba2, shiba3, shiba4, nootの6つが確認できる。

ここで、"使用できるユーザー"からしかアクションを起こせないので、"ユーザーが使用できる実行ファイル"を探す

find / -user <username> type f

shiba1~4で順次実行するとshiba2だけ他と異なるものが見つかる。/var/log/test1234

実行できるshiba2に切り替えてこれを閲覧すると、nootnootのpasswordっぽいものが見つかる。

nootnootはroot権限があるので、フラグが閲覧できる。

といったところまで。可能なことは何か？というところでfindコマンドを用いて実行可能ファイルを探す発想が必要だった。

2020-09-05

Build web application with Golangの備忘録

概要

Goはどのようにしてweb作業を行うか · Build web application with Golang

astaxieさんのgitbookでわからなかったところをメモする

3章を見ていきます

理解が甘いところがあるので、間違ってたら突っ込んでください。

3.2章簡単なwebサーバー

main関数内からです。

そもそものhttprequestの実装、http.HandleFunc()、http.ListenAndServe()メソッドをそれぞれ解説します。

httprequest

golang.org

コメントアウトを消したものを以下に引用します。

type Request struct {
    Method string
    URL *url.URL
    Proto      string // "HTTP/1.0"
    ProtoMajor int    // 1
    ProtoMinor int    // 0
    Header Header
    Body io.ReadCloser
    GetBody func() (io.ReadCloser, error) // Go 1.8
    ContentLength int64
    TransferEncoding []string
    Close bool
    Host string
    Form url.Values
    PostForm url.Values // Go 1.1
    MultipartForm *multipart.Form
    Trailer Header
    RemoteAddr string
    RequestURI string
    TLS *tls.ConnectionState
    Cancel <-chan struct{} // Go 1.5
    Response *Response // Go 1.7
}

Cか何かを触っていた時にhttpリクエストは構造体だ、という言葉をどこかで聞いた覚えがありますが、goのhttpリクエストは構造体みたいですね。

最近学んだことですが、そもhttpリクエストとはクライアント-サーバ間のやりとりのメッセージの一つです。リクエストとレスポンスがありますが、要り様なのはリクエストなので割愛します。深くはsocket通信など調べてみると具体的な形が分かると思います。

簡単な例としてchromeでctrl+shift+iなどでデベロッパーツール、Networkタブに切り替えて(読み込みのためreloadして)Nameから適当なファイルをクリックしたHeadersを見て、こんな感じかーとだけ思っておけば大丈夫です。status codeとか、そういうのが書いてあると思います。

httpリクエストは大まかに3つに分けられ、それぞれリクエストライン、ヘッダー、メッセージボディと呼びます。上からこの順番で並んでいます。

リクエストラインが構造体のMethod+Url+Protoで成り立ちます。(Protoはプロトタイプではなくて、プロトコルの"プロト"ですね。きっと)

GET (任意のURL) HTTP/1.1 がよくある例です

順当に見ればヘッダーなのですが一度割愛して、メッセージボディが"送りたい情報本体"になります。よくあるhtmlを送るならおそらくから始まるタグから中の文書全体までがメッセージボディです。細かく追記すると、分けて送るので、メッセージボディ一つに文書全体が入っているとは限りません。

最後にヘッダーが残り全てです。情報が様々入ってます。

http.HandleFunc

qiita.com

m0t0k1ch1st0ry.com

本題に移ります。main文の一行目http.HandleFuncでは与えられたハンドラをパターンに登録するらしいです。

https://github.com/golang/go/blob/7662e6588c9433f1219e0a0c46bc563ba3f93f98/src/net/http/server.go#L2369

ここから先はServeMuxを読まなきゃならないみたいなので撤退。とりあえず、自分で定義したハンドラはこの関数を通過させることによって安全に利用できるのかな(？)

第二引数のハンドラから次に、sayhelloNameに移ります。

sayhelloName

この関数ではハンドラーとして、返したい(表示したい)具体的な処理と内容を記述します。メッセージボディに投げるものをここでやっておくイメージですね。(ハンドラーっていう語は範囲が広くて難しい)

この関数でrequestにhttpリクエストが入っているはずです。ResponseWriterはtimeoutWriterで定義されており、エラーで使うので今は気にしないでおきましょう。

ParseFormではフォーム情報が取得されます。山ほどあるヘッダー情報の中から、フォームだけを取り出します。/?以降に入力した配列の形で一行目に表示されるものです。

developer.mozilla.org

urlの最後の/に続き?から配列名=値の組を&で繋いでURLに入力するとこの形式でフォームを送ったことになるみたいですね。

余談ですがおそらく、URL.Schemeはnet/urlの構造体変数でparseする関数を変えれば動くと思います。

後はfor-rangeでkey-value形式で表示をしているだけです。

試しに、例のurlの後に&okasi=tabetaiと入力するとkey:okasiにvalue:tabetaiが追加されると思います。

http.ListenAndServe

main文二行目のものですね。err変数に代入しているみたいですが、その名の通りlistenをよろしく処理してくれるみたいですね。コメントを読んでみると、srv.AddrにTCPのネットワークアドレスが入っているのでそれを利用するらしい。Serve関数まで読んで断念した。全体を読まないとだめね。

やっていること自体は、よしなにサーバを待ち状態に設定するというところで。

qiita.com

とても参考になった記事だった。

まとめ

bind、listen、accept、sendがListenAndServeに集約されている。

ルーティング設定とハンドラーの設定ををHandleFuncで行っている。

ハンドラーは実処理部(?)。やりたいことを記述する。

感想

曖昧なので完全理解したい。

2020-07-13

goの標準入力のメモ

概要

goをやり始めの人が標準入力で変数を取るのに効率的と考えられる方法をまとめた。

標準入力の受け取り

時短で書けるようにシンプルさを主軸において記す。
したがって、自分で実装する量を極力少なくする方向で努力する。

一単語～受け取り

import "fmt"
func main(){
    var i int
    var c byte
    var s string
    fmt.Scan(&i)
    fmt.Scanf("%c %s", &c,  &s)
    fmt.Printf("%d %c %s", i,c,s)
}

想定

1 h stringissogood

速度的に微妙という記事も見かけたが簡単なのでfmt.Scan(addr)で一単語取ってしまおう。
5個くらいの書くのが億劫でない数に収まれば、scanfですべて取ってしまうのも手。

空白区切りの単語

フォーマット指定と変数を10個もだらだら書くわけにはいかないので、bufioを使いsplitで分割してから逐次scanで読み込む。

import (
    "fmt"
    "os"
    "bufio"
    "strconv" //intへのキャスト、Atoi関数用
)

func main(){
    sc := bufio.NewScanner(os.Stdin)
    sc.Split(bufio.ScanWords) //ここでsplitして各要素を空白区切りで認識可能にする

    for ;sc.Scan();{ // sc.Scanの戻り値はboolでforの条件に入れることによって終端時に抜けるようにする。
        // sc.Scan時にセットされたテキストをsc.Textで得る。sc.Textをキャストし、vに代入。
        v,_ := strconv.Atoi(sc.Text())
        fmt.Println(v)
    }
}

想定

1 65 234 666

おそらく、手入力すると無限ループが発生するが$ go run main.go < textのようにあらかじめ記述しておいたファイルをリダイレクトすると処理は通常終了する。

感想

改めて見ると簡単だが、未だにAPIのリファレンスを見るのに時間がかかる。
慣れていきたい。

2020-07-07

桁数えで文字列の長さを取る僕を含めた全人類へ。

概略

日記です。

近況報告がしたいのと簡単な桁の問題を解いたので書いておきます。
なんてことはない馬鹿どものための対数の計算です。
(桁/D/Pとかそんな高度なことは書いてません)
半分は「文字列の長さを取って桁数えとする」という暴挙をやめるための回り道です。

Goを始めた

インターン初給料祝いに、自分にオライリーのgoインタプリタの本を買いました。買ったはいいもののGoなんて書いたことないのでまずTour of goをやってます。

今は就職につながるようなインターンを探しているのですが、何もしない・できないで有名な僕なのでなかなか応募できるところがありませんね。何か成果物の一つでもあればいいのですが。

かっこいいサムネでV/O/Y/A/G/E Groupのインターンを見つけたけど、もう申し込み期限過ぎてたしね。もっと早く動けばよかったね。
...メ/ル/カ/リインターン受かるといいなぁ。

単純な桁数え

goの練習としてpaizaをやっていたらぶち当たったので、それについて書く。
断りがない限りpythonのコードです。

「任意の数字nが与えられます。このnについて桁を出力してください」というような問題。

入力:

出力:

5桁なので5です。(当たり前)
これを脳死で解くと、

n = input()
print(len(n))

になりますね。文字数数えりゃ桁になるやんけ！という暴力の世界。

ただ、僕の気持ち的に何となく算数っぽく書きたいのですね。そんな時に常用対数がぱっと思いつかなかった2年間です。

常用対数？

おじさんは高校数学ができないので、仲間のために書きます。今回の^(ハット)はべき乗の意味で使います。

常用対数とは、

「10³ = 1000です。だから1000は10³です。」

の後半部分の導出のために使います。なんかい10でわれるかな^^の気持ちです。

これを式に起こすとlog10(1000)です。(markdownで底を小さくできなかった)
答えはlog10(1000)=3です。
つまり何が言いたいのかというと、常用対数で桁が求まりますね。高校時代なんかの計算問題やった覚えがあるけど完全に忘却の彼方。

コードに起こす

工夫として、10のべき乗じゃないと端数が出るので丸めるのと、「1000のなかには10が3こあります」と一桁足りないので単純に一足す操作だけ忘れないようにしましょうね。

import math # log10

n = int(input())
print(int(math.log10(n))+1)

一応go

package main

import (
    "fmt"
    "math"
)

func main(){
    var f float64
    fmt.Scanln(&f)
    fmt.Println(int(math.Log10(f))+1)
}

対数くらいはパッと思いつくくらいの教養を身に着けたいな。

2019-12-19

cgroupがどうした

概要

メモです。dockerでの読み込みでのミスです。

なにがどうしたか

rebootした際にエラーコードが吹きとんだので残っていません。

原因はsystemedのprosessの認証です

https://github.com/microsoft/vscode-docker/issues/1402

dockerを立ち上げる際にcgroupの権限がうまく行ってなく(?)

OCI create runtime failedでgo:346,go:297のエラーが起こりました。

僕の環境がFedora31なのでバッチリ当てはまりますね。

とりあえず、/etc/default/grubを編集、

GRUB_CMDLINE_LINUX:

に追加で

systemd.unified_cgroup_hierarchy=0

と書いてから

grub2-mkconfigコマンドを使用、再起動で設定が良くなるみたいですねー

2019-12-17

脳死でkillersheepをするために

概要

一番hotで一番dope、エキセントリックかつダイナミックなエディターvimの最新激アツゲーム「killersheep」をやるためのbuild及び設定

vanillaなvim8.2, 標準的なlinux環境を対象とします

killersheepの声って誰なんだろう…ブラムさんなのかな…

半ば自分用のメモです

コマンドは同時に動くことを想定して書いてないので、一個ずつ行ってください

先頭$はつけてないです…代わりに境目は空行をはさみました。

バニラvimのビルド

git, makeなど基本的なものは省略します

作業用ディレクトリ(一時的にあるだけであとで消すのでhomeでいいと思いますが)に移動してから...

git clone https://github.com/vim/vim.git

cd vim

git checkout v8.2.0

checkout時に指定するバージョンはv8.2.0xxxのうち好きなもので良いです…(多分後半の方が修正が入ってる？)

cd src

./configure --with-features=huge --enable-gui=gtk2 --enable-fail-if-missing

make

sudo make install

コケる場合はvim-jpを参照してください。makeの設定等、細かく載っています。

https://vim-jp.org/docs/build_linux.html

deinによるプラグイン導入

neovimでしかdeinは使えないと思ってた…便利…

元からdein使いの人は飛ばしていいです

curl https://raw.githubusercontent.com/Shougo/dein.vim/master/bin/installer.sh > installer.sh

sh ./installer.sh ~/.cache/dein

vimrcのない人はhome直下に隠しファイル.vimrcを追加し、deinを追加

存在する人はdeinを追加します

dein使いは飛ばす

GitHub - Shougo/dein.vim: Dark powered Vim/Neovim plugin manager

\2. Edit your .vimrc like this.の項を追記します

bashで以下のコマンドをコピペすればdeinの設定が追記されます

echo 'if &compatible
  set nocompatible
endif
" Add the dein installation directory into runtimepath
set runtimepath+=~/.cache/dein/repos/github.com/Shougo/dein.vim

if dein#load_state('~/.cache/dein')
  call dein#begin('~/.cache/dein')

  call dein#add('~/.cache/dein/repos/github.com/Shougo/dein.vim')
  call dein#add('Shougo/deoplete.nvim')
  if !has('nvim')
    call dein#add('roxma/nvim-yarp')
    call dein#add('roxma/vim-hug-neovim-rpc')
  endif

  call dein#end()
  call dein#save_state()
endif

filetype plugin indent on
syntax enable' >> .vimrc

killsheepを追加

コメントアウトされているAdd or remove your plugins here like this: に倣い、追加します

yy+pでコピーして書き換えましょう

call dein#add('vim/killersheep')

最後にエディターのvimを開き(notディレクトリー)、標準モードで

:call dein#install()

vimを開き直し

:KillKillKill

で可愛い羊さんの鳴き声とともに容赦ない弾幕の災禍が巻き起こるでしょう

感想

deinいいねになった。勝手に持ってきてくれるの便利すぎる

概要