プログラミングで作りたいもの
僕がプログラミングで作りたいものです。
これからはこれを作る為に学習を進めていこうと思います。
はてなかnoteでログや進捗などをアウトプットしていこうと思っています。
noteで書いた方がおこづかい稼げそうなのでHowToのまとまった内容はnoteにしようと思っています。
IFTTTで実装出来るならそれでも良いのですがいまいち使い方が解っていません。(あれIOT周りが多い気がする)
日常の作業の自動化
日常の面倒臭いことをなるべく自動化し定期的なコストを下げたいです。 ここで言うコストとは主に労力のコストです。 できれば金銭コストを上げない形で労力コストを下げたいです。
ボードゲーム会告知の自動化
自分が運営しているゲーム会の細々と押したことを自動化したいです。
会場の予約をしたらイベントページが自動生成されてカウントダウンツイートが全て予約されるぐらいの感じにしたいです。
カウントダウンツイートの自動化
現在（2020/02/25）はカウントダウンツイートの内容をGoogleスプレッドシートで作成し、コピーした内容をHootesuiteという予約投稿ができるTwitterクライアントにペーストし、ツイート日時を指定しています。
これも繰り返しなので自動化したいです。
GoogleスプレッドシートとGAS(GoogleAppScript)とTwitterAPIの知識と技術があれば実装出来るかもしれないと思っています。
特にTwitterAPI周りでうまくいかない事が多いのでAPI周りの問題を解決したいです。 良いサイトっぽい↓のを見つけたので参考にして手を進めてみます。
読んでみました。
こんぐらいは出来てた。
この後キーとかを入力してGASでツイートしようとするとOAuth認証エラーが出て先に進めなくなっているのでした。
もう一回やってみよう、、
TODO
TwitterAPIを使える様にする
ツイプラ作成の自動化
ツイプラというイベントサイトでイベントページを作っているのですが、会場や日にちなどの入力をミスする事があります。 繰り返し作業なので自動化したいです。
人的ミスも減らしたいです。
pythonでスクレイピングしたものをGoogleスプレッドシートに入力し、スプレッドシートで文章の作成、
取得した場所の文字列によって行き方の追加文章を変えるのはどうすれば良いのか、解りません。
ツイプラの新規作成や文章コピペ、フォーム入力はどういう技術があれば良いのか、解りません。
TODO
えどねっとのスクレイピング
取得したいもの予約した会場の 日付、時間、場所
ついぷら入力内容の自動化
タイトル入力の自動化
取得した 会場の 日付、時間、場所を入力
場所によって行き方の内容を変更する
フォーム入力の自動化
場所、開始時間、参加人数、タグ、Tweetしない設定
ミスが無いかチェックする機能
決定を押す機能
ツイプラのスクレイピング
TODO
ついぷらのURL、日付をイベント毎に取得
取得したURL、日付を指定のスプレッドシートに入力する
告知予定日時、内容作成の自動化
実装済み
TODO DANE
- スプレッドシートにURLと日付を入力する
- URLと日付が入力できる告知テンプレート文章を作る
- 入力した日付から引き算して告知したい日付を表示できるセルを作る
- DATA設定を○月△日(□)の様に変更する
- 告知文の指定箇所にURLと日付を代入する
料理の自動化
同じ料理作るの飽きたので、早く工業化MOD入れたいです。
ミルクココナッツチキンカレーの自動化
自作のインドカレーが美味しくてお店のカレーが食べられないレベルになったので、作成をなるべく自動化していつでも食べれるようにしたい。
労力を下げて大量に作り売れるようにしたい。
ハードの知識も必要になるかも。
プログラミング関係なさそうなので料理用にブログとかTwitterアカウント作って作ってそっちでやろうと思いました。
売る為に行動してみた
2020/03/03
保健所のWEBに都内の衛生方法や必要条件については書いてあるのですが難かったので電話しました。
自宅以外の調理場所が無いと販売が出来ないみたいです。
自宅で作って台車引いて近所の会社前とかに小ロットで売りに行こうかなーと思ってたんですが、自宅で作るのが駄目みたいなので断念。
販売用のキャンピングカーか調理場が必要なそうな、ハードル高いなー
固定費用と初期費用は安ければ安いほど良いという思考なのでつらみであった。
免許も持っていないのでどこかの調理場を借りるとか１日店長みたいな事をやるのが良さそうです。
一日店長で調理場も借りるのが現実的なので探してみっかな。
必要な機能
玉ねぎのみじん切り（なるべく水っぽくならないように）
なるべく大きさを揃えた形で繊維に沿って玉ねぎのみじん切りをする
こういうところで発注したり、みじん切りにされた業務用の中国産玉ねぎを使う方が安そう。
トマトの乱切り
生姜の皮を切りとる
ニンニクの皮をむく
ニンニクの芯をむく
むきニンニク買えば良い説もあります。
ただ、あれ芯が取られてないんですよね。
ゲーム会のやりたいゲームリストの自動化
やりたいゲームリスト機能
ユーザーログイン機能
やりたいゲームを入力出来る
やりたいゲームのタイトル、人数、時間、一言を入力出来る。
やりたいゲームで書かれたゲームへ参加予約する機能
ゲームが立ったらプレイヤーが開始ボタンを押す
開始ボタンを押されたタスクは実行中の色に表示が変わる。
ゲームが終わったら完了ボタンを押す。
完了ボタンを押されたタスクは完了の色に表示が変わる
log機能
立ったゲームをやったゲームリストのシートに移動する
いつ立ったか 思考時間 勝者 感想 等が入力出来る
現実のゲーム化がしたい
日常生活のあらゆる事の数値化したい
ステータスオープンしたい
タイピングのゲーム化を進める
寿司打、MyTypingのツイートを自動取得して自分の成長をグラフ化したいです。
pythonのスクレイピング技術があれば入力部分は作れそうです。
- 指定したユーザーが指定したタグをつぶやいたら情報を取ってくる
- タイプ数、ミスタイプ数、タイピング速度、日時を取得。
- Googleスプレッドシートに入力
- グラフ化（スプレッドシート機能で可能）
- 出来れば日毎に蝋燭足チャート表示したいです。
共有TODOリスト
目的
再現性のあるタスクを共有し、目標達成、スキル獲得の再現性を高める
タスクのゲーム化
デイリークエストやウィーククエスト、ログインボーナス等の機能を付けたい
Googleタスクで出来る説が出てきたのでGoogleタスクを使ってみます。
実装したい事
TODOリストを作れる
TODOリストを共有出来る
TODOリストをgit的に改良が出来る
達成はユーザー毎に個別で行う
達成した事に応じて親タスクの達成率が変化する
達成タスクの難易度に応じて経験値ポイントが貯まる
RTAが出来る
それぞれのタスク達成にかかった時間を表示できる
同じタスクを達成するのにかかった時間を比較できる(自分&&他者)
ゲーム
Unix Quest
uinix のコマンドや仕様が解らないと先に進めない謎解きゲームを作りたい。
動機は楽しそうだから。
コマンドラインとshellを駆使してlinuxを体験しよう。
内容
- unix、linuxの歴史を追体験するストーリー。
- linuxディストリビューションについて。
- コマンドラインで操作する
- コマンドラインでLinuxの色々なフォルダを探検する
- shellを作る
- shellを使って問題を解決する
- 自分のPCかレンタルサーバーに同じ環境を作る
- キーとなるshellを作り何かの暗号通信でゲームサーバーに通信を送る
- 正解していたら全クリ
全クリすると得られるもの
フィヨルドブートキャンプ学習記事まとめ
このまとめについて
現在フィヨルドブートキャンプ でRuby on Railsを学んでいます。
フィヨルドブートキャンプ ではブログやツイッターでのアウトプットが推奨されていまして、僕はブログでのアウトプットを頻繁にしています。
そんな訳で書いていたブログ記事がそこそこ増えてきたので解りやすいように整理してみました。
僕の学習が進んだらどんどん記事が増えていく予定です。
読んでやってみて解り辛い所やハマっている所があったら気軽にご連絡下さい。
フィヨルド生以外で解らないって人はとりあえずフィヨルドブートキャンプに入れば良いかも（宣伝）
フィヨルド生以外でもコメントもらえれば全レスしますよ。
ブログ
CSS
tarminal
Homebrew
vim
Linuxのdevian
- FreeあんこLinuxディストリビューション - あそぶ技術
- さくらVPSがUSキーボード使いのvimmerを殺しにかかってくる件について
- APTについてのまとめ
- APTでインストール出来ない。だったらアップデートだ！
- sudoをインストールしvisudoで使えるようにする
- さくらVPSにdebian9をインストールする
- さくらVPSでDebianを入れると文字化けする問題を解決する
SSH
debibanRTA
ただ、これだけやっても身に付く物が少なそうなのでdebianとSSHの記事を終わらせてからやる事をお勧めします。
postgreSQL
HTTP
Nginx
sshとsshdの違いとは何か
そのDなんのD？気になるD
sshの設定をするときにsshd.configの設定を変更するんですがsshdって何だろう？と思ったので調べてみました。
何だろうこのDは
もしやDの血族？
DはDaemonのD
ssh(クライアント) : 他のサーバにsshで接続する設定 sshd(デーモン) : 他のサーバからsshで接続されるときの設定
sshdは他のサーバのsshクライアントから実行されたコマンドを実行する。 そのため、sshd の動作していないマシンには、ssh クライアントでログインできない。
ssh絶対受け取るマンだコレ
の事みたいですね。
デーモンって悪魔ですよね？
悪魔ってどう言う事？
神か悪魔か
典型的なデーモンは名前の最後尾に "d" が付く
daemon（守護神）とはギリシャ神話に登場し、神々が煩わされたくないと考えた雑事を処理した存在である。同様にコンピュータのデーモンもユーザーが煩わされたくないタスクをバックグラウンドで実行する
多くの人々が "daemon" という語と "demon" という語を同等視しており、UNIXと冥界の間にある種の悪魔的関係があるように感じている。これは言語道断な誤りである。"daemon" は実際には "demon" のより古い形であり、daemon自体には善または悪への特定の偏向の意味はなく、むしろ個人の性格や個性を説明付ける役割を担っていた。古代ギリシアにおける「個人的daemon」の概念は現代の守護天使に近く、eudaemonia は親切な精霊によって助けられたり保護されたりしている状態を意味する。
へー、なるほど守護神とか守護天使の事なのね。
玄関先にいて守ってくれる番犬とかシーサーみたいな存在なのかな。
別のページにはこんな記述も
デーモン (daemon)とは｜「分かりそう」で「分からない」でも「分かった」気になれるIT用語辞典
デーモン (daemon)とは メモリ上で「さぁ、いつでもかかってこい」と待機している常駐プログラムのUNIX系OSにおける呼び名 です。
常駐プログラムは「いつでもお仕事できるようにスタンバってたり、（人の見えないところで）常にお仕事をしているプログラム」です。 休みなんてありゃしない、常に戦闘態勢を維持することが求められているプログラムです。 メモリ上でお仕事が来るのをぼーっと待っていて、お仕事が来るとささっと実行し、終わるとまた待機状態に戻ります。
デーモンはOSに登録され、コンピュータやOSの起動(ブート)時に一緒に起動され、実行状態となる。強制終了など特殊な場合を除いて基本的に利用者が直に操作することはない。HTTP通信を処理する「httpd」のように、デーモンの実体となる実行可能ファイルの名称には末尾に「d」を付ける習慣がある(必ずしも従う必要はないため例外も多い)。ちなみに、Windowsではほぼ同様のプログラムを「サービス」という。
なーんだ、悪魔じゃないんのかー
常駐プログラムとかめっちゃ便利なありがたい存在じゃないですかー
と思ってたんですがこうも書いてあります。
フェルナンド・J・コルバトによれば、MITのProject MACで働いていた1963年、彼のチームがデーモン (daemon) という用語を初めて使ったという。分子をより分けてくれるという物理学や熱力学の空想上の存在であるマクスウェルの悪魔 (Maxwell's demon) が発想の元となっている
やっぱ悪魔じゃねーか！！
何が守護天使だよ、180度違うよ！
マクスウェルの悪魔って何奴だよー！
マクスウェルのデーモン
[マクスウェルの悪魔とは (マクスウェルノアクマとは) [単語記事] - ニコニコ大百科] (http://dic.nicovideo.jp/a/%E3%83%9E%E3%82%AF%E3%82%B9%E3%82%A6%E3%82%A7%E3%83%AB%E3%81%AE%E6%82%AA%E9%AD%94)
空気の分子の速さを見分けて窓を開け閉めできるちっちゃい人（コイツこそが「マクスウェルの悪魔」である！）
マクスウェルさんが妄想の中で生み出した早い分子と遅い分子を二つの部屋に分けられる存在、こいつがマクスウェルの悪魔のようですね。
うーん、別に悪いことしてないし悪魔なのこれ？
頼んだことをずっとやってくれる便利な存在っぽいのでやっぱ守護者っぽいです。
なんだよー
でも、常駐プログラムも悪い使い方をすればスパイウェアとかになるし悪魔って言われても判らなくもないかな？
daemonのイラスト
linux daemonで画像検索するとこんな画像が出てきます。
悪魔っぽい
でも、西洋建築に良くあるガードイルも見た目は悪魔っぽいけど魔除けに用いられているので、僕はそんなイメージで脳内補完しました。
手に持つトライデントはプロセスのフォーキングを象徴している。 だそうです。（解ってない）
このwikiの外部リンクにいっぱいデーモン君のイラストがあります。
グッズ化もされているようですよ。
まとめ
以上です。
SSH公開鍵が送れない
公開鍵が送れない！
SSHでのログインが急に出来なくなったのでdebianを再インストールし再びSSHの設定をしています。
そして、sshの公開鍵を送るところが上手く出来ずハマりました。
つらみ
これはその時のログです。
最後に成功例も載ってます。
4回の失敗例
本当はもっと失敗しています。
イェー
失敗例 1
入力コマンド
ssh-copy-id -i ~/.ssh/client_rsa.pub
全文
hiyotatu8MBP:.ssh hiyoshitatsuya$ ssh-copy-id -i ~/.ssh/client_rsa.pub /usr/local/bin/ssh-copy-id: INFO: Source of key(s) to be installed: "/Users/hiyoshitatsuya/.ssh/id_rsa.pub" /usr/local/bin/ssh-copy-id: INFO: attempting to log in with the new key(s), to filter out any that are already installed /usr/local/bin/ssh-copy-id: ERROR: ssh: Could not resolve hostname /users/hiyoshitatsuya/.ssh/client_rsa.pub: nodename nor servname provided, or not known
原因
- スペルミス 転送するキーは
client_rsa.pubではなくid_rsa.pubなのでシンプルに間違ってる。 - 接続先サーバーのアドレスと公開鍵を送るユーザーの指定が無い
- そりゃ送れんわ
失敗例 2
入力コマンド
ssh-copy-id -i~/.ssh/id_rsa.pub
hiyotatu8MBP:.ssh hiyoshitatsuya$ ssh-copy-id -i~/.ssh/id_rsa.pub /usr/local/bin/ssh-copy-id: ERROR: failed to open ID file '~/.ssh/id_rsa.pub': No such file or directory
原因
id_rsa.pubにはなっているので鍵のスペルは合っている-iはItentitiyFileの事らしい、良く解らないがsshの転送コマンドに良く書かれている-iの後に半角スペースが無い- 接続先サーバーのアドレスと公開鍵を送るユーザーの指定が無い
ItentitiyFileについて
ItentitiyFileについては調べてみるも良く解らなかった。
一番最初に読み込ませるユーザー用にカスタマイズされた設定なのかな？
一応調べた資料を残しておきます。
man ssh-copy-idでマニュアルを見てみる
こんな感じ。
Identitiyについて
identify / identification / identifier / identity
そのユーザーが本人かどうか識別するのをidentify。動詞。
識別する行為そのものはidentification。identifyの名詞形。識別、ID、身分証。
そのユーザーを特定するために用い情報をidentifier。識別子。氏名、変数名など。
そのユーザーを特徴付けるあらゆる情報をidentity。アイデンティティ、同一性。
つまりどう言うことだってばよ！
失敗例 3
入力コマンド
ssh-copy-id ~/.ssh/id_rsa.pub
全文
hiyotatu8MBP:.ssh hiyoshitatsuya$ ssh-copy-id ~/.ssh/id_rsa.pub /usr/local/bin/ssh-copy-id: INFO: attempting to log in with the new key(s), to filter out any that are already installed /usr/local/bin/ssh-copy-id: ERROR: ssh: Could not resolve hostname /users/hiyoshitatsuya/.ssh/id_rsa.pub: nodename nor servname provided, or not known
原因
- １つ目の失敗例と違いスペルは合っている。
- が、接続先サーバーのアドレスと公開鍵を送るユーザーの指定が無い
- まあ送れないですよね。
失敗例 4s
入力コマンド
ssh-copy-id ~/.ssh/id_rsa.pub hiyotatu8@153.126.184.96:~/.ssh/authorized_keys
全文
hiyotatu8MBP:.ssh hiyoshitatsuya$ ssh-copy-id ~/.ssh/id_rsa.pub hiyotatu8@153.126.184.96:~/.ssh/authorized_keys
/usr/local/bin/ssh-copy-id: ERROR: Too many arguments. Expecting a target hostname, got: '/Users/hiyoshitatsuya/.ssh/id_rsa.pub' 'hiyotatu8@153.126.184.96:~/.ssh/authorized_keys'
Usage: /usr/local/bin/ssh-copy-id [-h|-?|-f|-n] [-i [identity_file]] [-p port] [[-o <ssh -o options>] ...] [user@]hostname
-f: force mode -- copy keys without trying to check if they are already installed
-n: dry run -- no keys are actually copied
-h|-?: print this help
原因
- 公開鍵の名前も合っているし、送り先の情報も書いてある。
- 最後に付け足してある
:~/.ssh/authorized_keysのせいで送れなかったのだと思う - どこかのサイトから拾ってきたのだと思う(記録は残していなかった)
- 送った鍵の名前を
authorized_keysに変更したかったのだと思う - しかし、
ssh-copy-idコマンドで鍵を転送した場合は指定しなくても転送された公開鍵の名前がauthorized_keysに変更されるので蛇足ですね。
成功例
入力コマンド
ssh-copy-id -i ~/.ssh/id_rsa.pub hiyotatu8@153.126.184.96
全文
hiyotatu8MBP:.ssh hiyoshitatsuya$ ssh-copy-id -i ~/.ssh/id_rsa.pub hiyotatu8@153.126.184.96 /usr/local/bin/ssh-copy-id: INFO: Source of key(s) to be installed: "/Users/hiyoshitatsuya/.ssh/id_rsa.pub" The authenticity of host '153.126.184.96 (153.126.184.96)' can't be established. ECDSA key fingerprint is SHA256:sMz3HIDgnq5XxN+gKfFWYHalH8zsmoKC4ZJdXpNtmyU. Are you sure you want to continue connecting (yes/no)? yes /usr/local/bin/ssh-copy-id: INFO: attempting to log in with the new key(s), to filter out any that are already installed /usr/local/bin/ssh-copy-id: INFO: 1 key(s) remain to be installed -- if you are prompted now it is to install the new keys hiyotatu8@153.126.184.96's password: Number of key(s) added: 1 Now try logging into the machine, with: "ssh 'hiyotatu8@153.126.184.96'" and check to make sure that only the key(s) you wanted were added.
こんな感じ
-iについて’は良く解らないけれど過不足無く必要な情報があるので上手く転送出来たんでしょう。
一応さくらVNCコンソールでSSH公開鍵がちゃんと転送されてるか確かめてみる。
ありました。
やったー
まとめ
なんか疲弊したけど良い復習になりました。
改めて見てみるとしょーもないミス集ですね。恥ずかしいわー
最近ハマっても新しいブログのネタだなこれと思える精神になってきています。嫌なものは嫌だけれどもな！！
後、こまめにログを取るの良いです。
自分のミスを後で振り返り原因を明確にする作業は爽快感があります。
sshに関するログが溜まってきたのでそれで３記事ぐらい作れそうです。
この後、sshd.configでもハマっています。何で設定効かないねん。
チックショー！！
僕がCSSの課題を進めた順番について
CSSメモについて
フィヨルドブートキャンプ CSSの課題の際にiPadにProceateというソフトを使ってメモをしていたのですがそれが残っていました。
参考にならない箇所もあるかも知れませんが、最初の方の大まかなところから作るところについては何処から手をつけて良いか解らないという人の参考になるんじゃないかな？と思い公開します。
僕はこの順番で作りましたよ。
字が読み辛いかも知れませんがスマホでは普通に拡大出来るしPCの場合も画像をクリックで拡大できたはずです。
字が汚い件についてはスマン
大デザインの整理
大きな塊を把握しようとしていますね
まずここから作りました。
中デザインの整理
中ぐらい塊に関わるタグを書いているようです。
これで全体の大まかなレイアウトが出来ます。
footerメモ
footerのリンク横にあるスペースについてメモしています。
同じっぽいなと
画像のサイズ
画像のサイズを書き込んでいます。
コンテンツにある料理の画像が明らかにでかいですね。
デザインの比率
比率で作られてるっぽいという気づきを書いています。
しかし、このメモが活きたかどうかは覚えていないです。
サイズを決める時に迷わないで時短できたはず。
ビルボードイメージ
三つ並んだ画像について書いていますね。
でも、正直何書いてるのか解らん
普通に配置するとマウスを画像の上に乗せた時(on mouse)画像の周囲に1pxの白い幅が発生し気持ちが悪かったので、その対処に苦戦してた時のメモだと思います。
あとで町田さんに聞いたら、そこまでやんなくて良いよって言われた記憶。
コンテンツ
記事部分の情報を整理してるみたいですね。
form
formについての書き込みです。
共通するデザインの場所、共通するHTMLタグを探しているみたいです。
HTMLタグが共通していればそのタグにCSSを利かせれば一気にデザイン変えられて楽そうだなとか思ってた気がします。
これもformについてですね。
読み辛い字でformのフォントはCSSで変えてはいけない、javascriptで変えるというような事が書かれています。
多分、町田さんからのアドバイスだと思います。
アイコン
アイコンについて書かれています
アイコンの場所とborder-radiusの仕様についての覚書ですね。
アイコンの場所についてはともかく、border-radiusの仕様については何書いてるか解んねーなこれ
アイコンを作る際にborder-radiusの仕様を知ることはとても重要だった気がします。
上下左右のborderの色を変更しつつサイズを変えながら仕様を確認して行った時のメモだったと思います。
パンくずリストの<にも丸をつけていますがCSSで図形を作るのでは無く不等号記号（＜）で作りました。
まとめ
- 最初に大きい塊から作って次の塊を作り
- 次にヘッダー、コンテンツ、フッターの内部。
- 最後にフォーム、アイコン
という順番で進めています。
この順番が作りやすいのではなかろうか？
あとは情報を整理したりまとめたりしていますね。
他にもメモはあったのですが、パッと見何書かれてるか解らなかったので未公開で
以上です。
多少でも参考になれば嬉しいです。
ではー
SSHが急に使えなくなった(未解決)
未解決ままです。 結局さくらVPSにdebianを再インストールしました。
一応ログを取っていたのでupしておきます。 興味のある人以外本当に読まなくて良いやつです。
参考資料
さくらのVPSへsshで接続できない PermissionDeny(publickey) - 株式会社オルタナティブエンタープライズ｜ALTERNATIVE ENTERPRISE
SSH で Permission Denied となる傾向と対策
SSHから接続ができない
tarminalでSSHから接続ができないエラーが
Permission Deny(publickey)
と、出てしまう。
こんな感じ。
VNCコンソールを使えるようにする
Connected(encrypted)と表示されるも黒い画面にならず
試しに画面左上のEscボタンを押してみる
すると、こんな画面になる。
画面を広げると下にコマンドが入力出来るスペースが見つかる。
これでようやくVNCコンソールで入力ができる。
sshdの設定を変更する
$ sudo vi /etc/ssh/sshd_config
設定ファイルがviで開くので設定を変更していきます。
公開鍵認証をオフにする
# PubkeyAuthentication yes↓
PubkeyAuthentication noパスワード入力をオン
PasswordAuthentication no↓
PasswordAuthentication yes
こう変更しました。
再起動して設定変更を効かせます。
sshdを再起動
$ sudo /etc/init.d/sshd restart
さくらVPSのシリアルコンソール(β版)だとここでコマンドが見つからないというエラーが出てしまいます。
しかし、先ほど設定したVNCコンソール版だとエラーも吐かず普通に使えてるっぽいです。
こんな感じ。
tarminalからSSHでログインしてみるとパスワードを求められます。
パスワードを入力すると、入れました。
認証鍵ペアの削除
サーバーのauthorized_keysを消す。
PC側のclient_rsaとclient_rsa.pubを消す。
新しいキーペアを作る
出来ました。
scp ~/.ssh/作った鍵の名前これをサーバーに送る サーバーのuser名@サーバーのアドレス:~/.ssh/作った鍵の名前(←名前を変えたかったらここを変更する)
port 22: Connection refused というエラーが出てしまう。
portを22に変更しても、駄目
公開鍵認証をオンに戻し
PubkeyAuthentication no↓
# PubkeyAuthentication yes
パスワード入力をオフに戻してみるも
PasswordAuthentication yes↓
PasswordAuthentication no
駄目
id_rsa.pubの中の文字列をコピーして
vi authorized_keyで新しいファイルを作りつつコピーした文字列をペースト
:wqで保存して終了
chmod 600 authorized_keyで自分しか見れない&編集出来ない状態に変更しました。
sshでtarminalからログインを試みるとパスワードを求められ入力するとログインできてしまうポート番号も変更し直してないのに
おかしいのでtarminalからsshd_configを弄ろうとする
sudo viで設定ファイルを開くためパスワードを求められる
入力しようとするとエラーが出てきてしまう。
debug1:
debug3:
debug1:
debug3:
VNCコンソールでログインする際に
-vvvv -Pでログインの際の詳細をみると
やっぱりエラーをめっちゃ吐いてる’
VNCコンソールでconfigを開いてみると
なんか違う。
特に下の方
こんなん弄ったっけ
ここでdebian再インストールしました。
CSSデザインで一番最初に気をつけるべき３つのポイント
CSSで苦しんでいる人が多いようなので作ってみました。
うろ覚えの簡易版なので間違ってるところもあるかも。
ともかくボックスモデルとfrexboxとresetCSSさえ解れば大枠は作れるのでここを抑えましょう。
ボックスモデルの理解
今更聞けない！エンジニアのための CSS の基礎講座 〜ボックスモデル編〜 | ヌーラボ
この図を頭に叩き込みましょう。
- ボックスモデルを頭に入れる
- borderの位置にちゃんと入ってるか確認してください。paddingとmarginの間ですよ
- widthとheightはcontentに利きます。paddingじゃ無いですよ
- 今後gredデザインというのが主流になっていくっぽいですがそこでもボックスモデルは使われます
- つまり、陳腐化されにくい知識だよ
- ブロック要素とインライン要素の違いも合わせて覚えるが吉
frexは便利
フレックスボックスについて抑えましょう。
ボックスモデルが理解できていないと上手く扱えないのでボックスモデルの位置関係を先に把握しましょう。
- float left等はほとんど使わずにfrexで位置を決める事ができます。
- カエルのやつをやる Flexbox Froggy - A game for learning CSS flexbox
- 僕はこれを2回ぐらいやりました。
floatデザイン→flexboxデザイン→gridデザインという風に進化していっています。
次はgridデザインがくるのですぐ陳腐化するそうですが、今の所はfrexが便利ですよ。
rsetCSSについて知ろう
- ブラウザには初期設定のCSSがあります。
- そしてそれはGooglechrome、FireFox、Safari、IEなどブラウザごと違います。
- そのブラウザでも同じデザインで表示させたい為、CSSの一番最初に全てのCSSを上書きするCSSの設定を置きます。
- その後効かせたいCSSを書き込んでいきます。
- CSSには後に書いたCSSの設定が優先されるという仕様がある為こう行った方法で様々な種類のブラウザで同じデザインが表示されるように工夫しています。
- これをrisetCSSと言い、様々な種類があります。
- リセットされるといっても全ての設定を消すのではなく、使いやすいように良く使われる設定などが書いてあります。
- それが時代や状況によって違う為、複数のrisetCSSがあるのです。
- 自分の使うresetCSSについてある程度知っておくとCSSの指定をする時に混乱を少なくでき楽になります。
原因と結果の探り方
- 何をすべきかを考える
- 今自分が何をしたのかを知る
- その結果どうなったのかを知る
この繰り返しです。
単純なんですが今何やってんのか良く解らなくなりますし、何でこうなったのか解らなくなります。
少なくとも僕はなったぞ！
その対処法を紹介します。
今何をしたのかを明確にする
- どこ何を効かせたのかを解りやすくする
- 解りやすくする為にbackground、textに色を付けよう
- 色はそれぞれ解りやすく違う色に変えましょう。色調は最後に合わせればいいんです。
- 背景に色を付けることでピクセル単位のズレが解ります。
google console を使ってみる
- Macの場合 control＋クリック
- Winの場合 右クリック
でメニューが開きます。
- メニューから検証を選択
- これでgoogle consoleが開きます。
- コンソールのHTMLにマウスを合わせた場所がサイトのどの部分かが解ります。
- コンソールメニューの左上の矢印マークを押すと逆にサイトにマウスを合わせたHTMLの場所が表示されます。
自分が作ったサイトのデザインがどうなっているか？これで検証してみましょう
ボックスモデルが色分けで表示され、それが何pxなのかというサイズも解ります。
なのでどのCSSの指定が効いているのか、また効いていないのかが解ります。
大きな所から手をつける
大きなところから完成させ、徐々に小さい所を作り込んでいくという作りかたが楽です。
- まずは、hedder、nav、sidebar、content、fotterの位置を決めてみましょう。
- それが出来たら上のそれぞれのパーツの中身の位置を決める。
という順番でやっていくと良いと思います。
もっと知りたい方は↓こちらをどうぞ。
難しかった所
確かここが難しかったような
- calc()は便利だが理解に手間取った
- 巨大な画像をどうするか
- formのデザインが乱れる問題
- 図形を作る
終わりに
解らない所があったら教えてください。
答えをそのまま教えることは出来ませんがヒントは出せるかも!
