以下のレッスンページにアクセスしていただき、
その中の「サーバーと接続するためのFTP情報」に接続するFTP情報を用意しております。
▼レッスンページ
https://web-programming.jp/cording-beginner-ftp/
FTP情報は全生徒共通となりますが、
コーディングデータをサーバーにアップロードする際は、
誰が作成したデータか判断するために、
以下のように自分の名前のフォルダに対象データを格納して、
フォルダごとアップロードいただくようお願いします。
（アップロードするフォルダの例）
フォルダ名：tarou_yamada_20210414
フォルダの中身：index.html、imagesフォルダ、assetsフォルダ
URL：https://www.prsc.pro/cording-biginner/tarou_yamada_20210414/
・フォルダ名は自分の苗字と名前と日付を半角英数のアルファベットで組み合わせること
・フォルダの中身は表示に必要なファイルのみをアップロードすること
・PSDデータなどの重いデザインデータはアップロードしないこと
・使用してないjpegなどの無駄な画像データはアップロードしないこと
・他の人のアップ済みフォルダやファイルを削除、変更しないこと
filezillaの左右にローカルサイトとリモートサイトが表示されているのであれば
サーバー接続は無事出来ているという事なので、ダウンロード操作が上手くいってないという事です。
ローカルサイトのフォルダが何も選択されてなくてエラーが出ている可能性があるので、
画面左のローカルサイトからフォルダを以下のように選択して再度試してもらえますか？
（ローカルサイト側のフォルダの選択の例）
/Users/ご自身のMACの名前/Desktop
正しくCSSファイルをアップロードしても、
記述した内容が反映されない時は、
反映前の古いCSSが呼び出されている可能性があるので、
以下手順に沿ってブラウザのキャッシュをクリアしてお試し下さい。
https://support.google.com/accounts/answer/32050?hl=ja&co=GENIE.Platform%3DDesktop
1.パソコンで Chrome を開きます。
2.画面右上のその他アイコン その他 をクリックします。
3.[その他のツール] 次に [閲覧履歴を消去] をクリックします。
4.上部で期間を選択します。すべて削除するには、[全期間] を選択します。
5.[Cookie と他のサイトデータ] と [キャッシュされた画像とファイル] の横にあるチェックボックスをオンにします。
6.[データを消去] をクリックします。
それでも反映されない場合は、
編集したCSSファイルの中身を開いて、
プロパティや値などのタイプミスがないか確認してみましょう。
Photoshopでスライスした位置が動画と少し異なる程度であれば、
CSSのpositionの値を調整して同じような見た目に仕上げることができるので、
10px単位のずれであれば気にせずに作業を進めていただいて大丈夫です。
Photoshopでスライスした位置が動画と少しでも異なるのであれば、
positionの値も変わってきてしまいますので、
各自スライスした画像の左上を基点として、
positionの値を調整しながら見本と近い仕上がりにして下さい。
どんなタイプミスかによりますが、
Atomなどの高機能なコーディング用のエディタであれば、
記述がおかしいと高い確率で色が変わってくれるので、
そのおかしくなった色の近くに原因があることが多いです。
あとはコードは多くなってくると、
間違いを探しづらくなるので、少し書いたらおかしな箇所はないか、
細かくチェックする癖を付けるとタイプミスを早く見つけれるようになります。
インデントは動画通りでなくても大丈夫ですが、
タグの階層ごとに揃えた方が第三者に見てもらう時に読みやすくなります。
また今回対象となっているプログラミング言語の場合、
インデントが揃ってなくても表示が崩れることはありません。
プロのエンジニアでも、
普段からあまり使用しないコードの意味は忘れていて、
必要な時にググって作業するのが普通なので、
受講中は丸暗記する必要はないのでご安心下さい。
ギガファイル便で提出されたデータを見ると、
重要なファイルがなくて課題の確認ができない時があります。
HTMLファイルの提出だけでは画像等が正常に表示されなくなりますし、
フォルダ内に必要なデータやフォルダがないとレイアウト崩れやエラーの原因となるので、
ギガファイル便で送る際はお手本データのフォルダ構成を見比べましょう。
