11月4日 フィヨルドブートキャンプ学習記録
学習内容
- Linuxゲリラ戦記を読み進め。 「31.シェルスクリプトでのプログラミング。Ctrl+Cで強制終了」〜「32.初めてのプログラミング補足/diffコマンドとTabキー」まで。
理解した点
- シェルスクリプトでのプログラミングについてざっくり理解。 ※細かい文法などはここでは覚えずに、後に環境を構築してから行うことにする。
- CUI環境では、「Ctrl + C」でプログラムを強制終了 させられる。
- 「diff ファイル名1 ファイル名2」とすることで、2つのファイルを比較して差分を確認する事ができる。
分からなかった点、疑問に思った点
- 本日は特になし。
所感
シェルスクリプトのプログラミングについては、細かい文法を覚えようとすると先に進みそうにないので、ざっくり見ておいて後から実際に手を動かしながらやっていこう。 シェルファイルは、前に仕事で実行したことはあったが作ったことはなかったので、実は密かに作ってみたいと思っていた。
明日の予定
引き続き、Linuxゲリラ戦記を読む。
11月3日 フィヨルドブートキャンプ学習記録
学習内容
- Linuxゲリラ戦記を読んだ。 「21.ファイルを移動するmvコマンド。Tab補完」〜「30.シェルスクリプトでプログラミングする前の予習。」まで。
理解した点
- 「mv 移動させたいファイル名 移動先」で、ファイルを移動させる事ができる。
- 「mv 名前変更前のディレクトリ(ファイル)名 名前変更後のディレクトリ(ファイル)名」で、ディレクトリ名やファイル名を変更できる。
- 「cp コピーしたいファイル名 コピー先」で、ファイルをコピーできる。
- 「cp -R コピーしたいディレクトリ名 コピー先」で、ディレクトリをコピーできる。
- 「rm 削除したいファイル名」で、ファイルを削除できる。
※「-R」とつける事で、ディレクトリを削除できる。(ディレクトリを削除すると、中のファイルもろとも消し飛ぶので注意!)
- 「touch ファイル名」で、空ファイルを作成できる。
※主に、ファイルを編集せずにタイムスタンプのみ更新したい場合に使用される。(ちなみにそんな状況があるかどうかは不明らしい)
- 「」は任意の0文字以上の文字を表す。
※例えば、「1*」とすると、「a1」、「b1」、「a1c」などを表すことになる。
- Linuxで初心者におすすめの「nano」というテキストエディタがある。「nano」と入力すると、エディタが開く。
- 「chmod A 権限 ファイルやディレクトリ名」とすると、ファイルやディレクトリに読み取り可能かなどの権限を付与、削除できる。
※Aの部分について
最初に、u(個別ユーザーに対してか)、g(所有ユーザーに対してか)、o(その他)に対して権限を付与、削除するかを指定する。
次に+(権限を付与)、-(権限を削除する)をつけ、その後にr(読み取り)、w(書き込み)、x(実行)のいずれかを設定する。
例えば、「u+rw」とした場合「個別ユーザーに対して、読み取りと書き込みの権限を付与」となる。
- 「echo "表示したい文字列"」で、文字列を表示できる。 ※これの応用として、「a=2」と実行した後「echo $a」と実行すると、変数aの中身(つまり2)が表示される。(この時、「$」をつけ忘れると、そのまま「a」と表示されてしまうので注意。)
分からなかった点、疑問に思った点
所感
ひとまず今のところは難なく読み進められている感じ。 早くコマンドを試してみたい気もするが、まずは焦らずに読み進めだ。
明日の予定
引き続き、Linuxゲリラ戦記を読む。
11月2日 フィヨルドブートキャンプ学習記録
学習内容
- Linuxゲリラ戦記を読んだ。 「8.ソフトウェアの検索・インストール・削除・更新」〜「20.新しくディレクトリを作る。mkdirコマンド」まで。
理解した点
- Linuxでは基本的にコマンドを用いて、ソフトウェアのインストール、削除などを行う。
- 「man コマンド名」と入力すると、そのコマンドについての説明が見られる。
- 「pstree」コマンドで、現在動いている全てのプログラムを表示できる。
- 「ps」コマンドで、現在動いている全てのプロセスを表示できる。
- 「Ctrlキー+Altキー+F1キー」と押すと、真のCUI環境(※)を呼び出せる。 ※これ以外の方法で呼び出すCUI環境はあくまでも、「GUI環境の上にCUI環境を作り出している」もの。
- 「top」コマンドで、全てのプロセスをリアルタイムで表示できる。 ※「ps」コマンドで表示できるのは、あくまでも「そのコマンドが実行された自転で動いているプロセス」
- 「パイプ」を利用すると、とあるプロセスの出力結果をとあるプロセスの入力として利用できる。
- 「kill プロセス番号」と入力すると、コマンドを強制終了できる。
- 「adduser」コマンドで、新規に一般ユーザーを追加できる。
- 「userdel」コマンドで、一般ユーザーを削除できる。
- 「mkdir」コマンドで、新しくディレクトリを作成できる。
分からなかった点、疑問に思った点
- 今回は特になし。
所感
4分の1を読み終えた。 ひとまず、ざっと読んで概要を理解することに重点を置いているので、そこまで苦労せず読めている感じ。 コマンドとか色々覚えることが多いので、今後「debian」をインストールした時に実際にやりまくって覚えていこう。
明日の予定
引き続き、Linuxゲリラ戦記を読む。
10月16日 フィヨルドブートキャンプ学習記録
学習内容
- CSS上級課題 アイコン作成に着手
実施したこと、理解した点
上級課題のアイコン作成について Q&Aで質問をし、アイコン作成についていくつか参考になる資料を提示していただいたので それらを見て実際に、何個か作成を行った。 提示された資料は、プラクティスに課題の参考としてURLが貼ってあったので、質問する前に自分でちゃんと探していれば良かったかなと感じた。
overflowプロパティについて アイコンを作成する上で初めて出会ったプロパティだったので、学習。 ボックスの範囲内に内容が納まりきらない場合に、どうするかを指定するプロパティ。 主な値には以下がある。 visible:要素がはみ出す場合、そのままはみ出して表示される。(デフォルトの値) hidden:要素がはみ出す場合、はみ出した部分は削除される。 scroll:要素が範囲内に納まらない場合、納まらない部分ははみ出さない。 要素が納まらない場合は、スクロールバーが表示される。 auto:要素が範囲内に納まらない場合、どう表示するかはユーザーエージェントに依存する。 要素が範囲内に納まらない場合は、スクロールバーが表示される。 ※ユーザーエージェントとは? 利用者があるプロトコルに基づいてデータを利用する場合に使用するソフトウェア、またはハードウェアのこと。
z-indexについて 要素の重なりの順序を指定する。 デフォルトは0で、大きい値を設定するほど上に表示される。
分からなかった点、疑問に思った点
- アイコンを作る上で、擬似要素やpositionなど様々な要素を用いたので、もう一度復習しておく。
自分で描いてみたアイコン
※メールアイコン、ページタイトルアイコンは資料を見ながら、引用文内のアイコンは資料のヒントから自力で作成。 - メールアイコン(2つ) https://codepen.io/ryotori1024/pen/BazKQgN https://codepen.io/ryotori1024/pen/jOrqBbp
ページタイトルアイコン https://codepen.io/ryotori1024/pen/MWeymjK
所感
アイコンの作成の仕方について、質問して解決できたはいいが、参考となる資料は全てプラクティスにURLが貼ってあったので、質問する前にもう少し自力で探すべきだったかなと反省した。
明日の予定
引き続き、課題を進める。
10月15日 フィヨルドブートキャンプ学習記録
学習内容
- CSS上級課題を進めた。
実施したこと、理解した点
- フォーム部分を装飾 フォームのテキストボックスの左端が揃っていないのを、きちんと揃えた。 初級課題の時は、要素に「text-align:right;」をつけるのみで良かったが、今回は事情が違って少し複雑だったので、今回のやり方もしっかり押さえておく。(このやり方については後日改めてまとめる予定)
分からなかった点、疑問に思った点
- 今回は特になし。
所感
いよいよ課題も大詰めとなってきた。 気を抜かずに、しっかり最後までやり切ろう。
明日の予定
引き続き、上級課題を進める。
その他
10月14日 フィヨルドブートキャンプ学習記録
学習内容
- HTML上級課題を進めた。
実施したこと、理解した点
フォーム部分、フッター部分の装飾 フォームの左端が揃っていなかったり、フッターの作者情報の部分がおかしかったりしたので、そこの装飾に着手。 疑問だった、フォームが凹んでいるように見せる件については、Q&Aで質問をして解決出来た。
box-shadowプロパティについて ボックスに影をつける為のプロパティ。 影は、2〜4つの長さの値で定義されるが、任意で色、insetキーワード(内側につける)を設定できる。 １番目の長さの値は、水平方向の影のオフセット距離を表す。正の値を指定すると右へ、負の値を指定すると左へ影が移動する。 ２番目の長さの値は、垂直方向の影のオフセット距離を表す。正の値を指定すると下へ、負の値を指定すると上へ影が移動する。 ３番目の長さの値は、ぼかし距離を表す。負の値を指定することはできない。 値が大きいほど影の端のぼかしが強くなり、値が0の場合には端がくっきりとした影となる。 ４番目の長さの値は、広がり距離を表す。正の値を指定すると影の形状を全方向に拡大、負の値を指定すると縮小する。 色を設定すると、その色が影の色となる。 insetキーワードを設定すると、影が外側ではなく内側につくようになる。 ↓例 https://codepen.io/ryotori1024/pen/qBNbWyQ
分からなかった点、疑問に思った点
- フッターの作者情報の部分を綺麗にするのにちょっと苦戦しているので、明日出来なかったらQ&Aに質問する。
所感
あとはフッター部分と、画像をCSSの図形で描く部分のみとなってきた。 時間はかかっているものの、完成に近づけられているので、最後まで頑張ろう。
明日の予定
フッター部分の装飾と、図形を作成する部分に入る。
