せきね　2020/3/28

▼▼慣れるまでは頻繁に確認する▼▼

守破離！！

▼▼ここから作業ログ▼▼

早速作業ログページを作ってみた。

日時はショートカットだけど時間は手打ち。多分やり方ありそう。

時刻は「どれくらい時間かかったのか」をみたい時だけでよいかと。

アイコンも「自分以外の人も同じページに同じ頻度くらい記載するときだけで。

2020/3/28 17:28

ほんまや

そして時刻は3回連打が必要で2回だと月まで囲う（日付残し）という謎の仕様も把握

2020/3/28

4回は元に戻った。予想と違った（予想：2020/3/282020/3/28）

ssekine.icon*7

チャンネルへの飛ばし方がわからない...

躓くまでが早すぎて笑う

検索履歴

RSS通知のチャンネル確かあったよな・・と思い

じゃあ実際通知が飛んでるページを改めて確認しよう

他に載せてる場所ないし、あれ？じゃあこのまま・・？で以下につづく

「仕様通りに作った」からとうまく行くかはわからない

「動いた」というのがただ一つの正しさ

[#times_tech-camp]

あ、うまくいった。単純だった。

強調してるだけかと思ったらそんなことなかった。

ブラケティングだけだとどうかな？と思って試してみたらうまくいった。

https://gyazo.com/17ae0e1749f826482e4c33ee01f2ed24

ちなみに記号入れても検索できなかったので「@の上の記号」で調べたら上記ページがでた

そうかこれアクセント記号だ。そのアクサンなのね。

コード扱いということになるのね。

2020/3/28 17:55

続きをと見せかけて再び脱線

ただ現状よくわからなくて沼にハマりそうなのでログだけ残しておく

https://gyazo.com/018ed235228f477f0a090e93e2225749

リンクから飛ぶと実際URLについてる

確認しに行きます！

確認したけど行に飛んでる感じではなかった・・もう少し調べます。

行全体が押せるのかと思ったけどそんなこともなかった

行に飛んだ。理解した。

行の記載内容を変更しても問題ないことは確認

行をズラしたらリンクもズレた！（75→76）位置固定じゃないのか

「何行目」ではなく、その行そのもののに固有のURLが作られるイメージかな？

行を作ってURLをリンクにしてからその行自体を消したらページに飛んだけど行には飛ばなかった。

お、同じページ上でもいけた

ページ切り出しして、該当部分が消え去った

ホームから直接飛ぶとついてない

https://gyazo.com/fce08eeac135bb1687b19e10d6a7fbc2

なるほどわからん

これで作業環境の事前準備系はひとまずOKかな？

進め方も後は今日の終わりのまとめを書けばひとまず大丈夫かなー

学んだことのまとめは何か一通り学んだ段階で都度って感じを現状ではイメージ

https://gyazo.com/8252bbd83401d30afbe9e2cc04f3f293

2の画像が見れない

1と2の違いはURL

https://gyazo.com/24f744bd642fd04e21f586cdeabf0d32

自分で検証できないけど

いや、別のつくればできなくはないか

ミスだった→指摘受けるまで気付いてなかったということなので上の理解で多分合ってる

同じ表示だったら作成段階で気づくはずなので

必要になるときが来たらちゃんと自分で検証します

学習の進め方のイメージはだいぶ固まってきた。

ので、今日あとは早速少しだけ課題に手を出してみる。

ぜんぜんわからない。手も動かしようがないレベルでわからない。

というわけでまずは最低限の作業イメージをつけるために色々調べた。

なんとなく使ってたけど改めて意味を知るとなるほど

https://gyazo.com/e390e5b190f97e75203d93885511ca52

基本構造もわかった。それぞれの要素の詳細については動かすときに改めて調べる

カスケードとは、何段も連なった小さな滝のこと。転じて、同じものがいくつも数珠つなぎに連結された構造や、連鎖的あるいは段階的に物事が生じる様子を表す。

CSSの“Cascading”の名称の由来ともなった概念で、ある要素のスタイルを決定する際に、まず「すべての要素に設定されたスタイル」（があればそれ）を適用し、次に「ページ全体に設定されたスタイル」（同）を、続いて「上位の要素」「その要素のタグ」「その要素の属するクラス」「その要素のID」「タグに直に記述されたスタイル」などといった具合に、上流で適用されたスタイルを引き継ぎ、競合する場合は上書きしながら、段階的に設定していくことを意味する。

https://gyazo.com/1ff1a847e0b7ad145bc3cd92204e7da3

HTMLは言語っていうか文法って感じの印象がある。表示する文章自体はそのまんまだからかもしれないけど。

HTML：骨組み

CSS：肉付け

Webページの見栄えを整えるにあたり、CSSでは次の3つの要素を用います。

セレクタ – どのHTMLタグに対して見合えを調整するか

プロパティ – どういった内容のデザインを施すか

値 – プロパティはどの程度か

https://gyazo.com/608d49cd623db5ec08dbb7449520fe92

別に深い意味はなく統一してなかっただけ？

セレクタ＝HTMLタグの中身だから

となるはずで、ややこしいから区別のためにあえて分けてるのかな？

前に買った本

それぞれ読んでわかったこと

それぞれ言語

UserCSS：CSS

それぞれの記法

UserCSSは「自分だけに適用する」方法と「閲覧者全員に適用する」方法がある

UserScriptは「自分だけに適用する」方法のみ（個人が勝手にやるには影響範囲が大き過ぎるから）

それぞれのコードを記述する場所

結構前に終わってたうけるw

わかりやすそうな記事をピックしたので後日改めて読む

遅い時間になってしまったけどそれぞれ調べてこの後の学習の流れのイメージが沸いたので整理をする

ゴール：

実装だけ考えればそのままコードをパクればよい

これをベースとしてコード1つひとつを理解できればこのお題はクリア

これらも参考になりそう

この後やること：

それだけで成功しても、どこかエラーが出ても一旦は良い

コードを読みながらわからないことを調べる

実際に反映してみる

中身を変えつつどういうパターンならうまくいくかトライアンドエラーで理解する

まだ使い方がよくわからないのでこれも実際に使いながら覚える

表示しながら試してみたけど右クリック効かなかった

この課題においてはHTMLはセレクタ記入のためにHTMLタグの要素だけ最低限覚えれば大丈夫そう

▼▼今日のまとめ▼▼

学習スタイルの確認と実践

作業ログを残す

調べて頭の中だけで理解しているときと深さが違う

ちゃんと残してるので数日後には綺麗さっぱり忘れてるとかも起こりにくそう

「見られてる」意識も働くのでわからなくて簡単に投げ出すみたいなこともあまりなかった。

課題（というか懸念）は平日とか時間が裂けない日にどうやるか、と単純に継続できるか

書き方も工夫できる余地は多いと思うけど、ハードル上げたくないからとりあえず今はあまり考えない

他の受講生が参考しやすい作業ログサンプルだとは思うしその意味でも初日としては良かったのでは

ところで他の受講生の作業ログの確認はどれだけ推奨なのだろうか？

先終わってる人いたらその人のページのCSSとかそのまんま答えだし非推奨？

それも含めて情報検索・それ以上に受講生同志の積極的な情報交換が重要と考えて推奨？

多分後者な気がする。

が、「無思考コピペ」は非推奨

コピペするときは

1. それで動くか？ちゃんと試す

2. なぜその書き方なのか？を自分でも調べてみたり、コードを一部削除・変更してみたりする

3. 「なぜ、他の受講生はその情報を見つけられたか？」その探し方とか考え方をしっかり学ぶ

と、とても有意義かと！

トライアンドエラー

質問するのではなく調べた結果をまとめて確認をしてもらう

課題の概要把握

基本用語の確認

HTML：主にWebサイトをつくるときに使われるマークアップ言語。文章の構造を決める。

ハイパーテキストリンク：別のWebページの住所。

ソースコード：上記のマークアップやハイパーテキストリンクを含めたプログラミング言語で記載されたテキスト

CSS：主にWebサイトをつくるときHTMLと共に使われる言語。文章のスタイルを決める。

セレクタ：どのHTMLタグに見栄えを調整するか

プロパティ：どういった内容のデザインを施すか

値：どの程度のプロパティか

自分だけ反映なら自分のページにコードを記載

全員に反映ならSettingsのページにコードを記載

行リンク：特定のページの指定行に飛べるリンク。行ごとにURLがありテロメアをクリックすることで表示される。