しょーごさんの初級Ex課題の備忘録【超初心者のコーディング】

コーディングにやや自信がついてきていた気持ちを

バキバキと折っていただきました(?!)

初級課題でした。

デザインが素敵で作っていて楽しかったです^^

【再掲載】2023年12月26日に掲載していた記事を再掲載しました。(2024年10月11日)

目次

目標は20時間!実働36.5時間でした…

ざっくり内訳はこちらの通り

  • PC版ピクセルパーフェクト 5時間
  • スマホ・タブレット版レスポンシブ 10.5時間
  • PC版のHTML&CSS 13時間
  • スマホ端末確認&サーバーにサイトを公開 8時間(?!)

しょっぱなから

画像の上に文字を載せるだと?!

と手が止まりましたがググるとなんとか行けるものでどうにかこうにか形になっていきました^^

はじめの挫折はこちら!

スマホサイズにすると何故かフッターが意味わからん位置に出てくる…

フッターが悪さしているのか、レスポンシブが悪さしているのか、

なにが悪いのかわからないまま、あっさり5時間経過…。

上のセクションのheight(高さ)をPCサイズで指定していることが原因でした。

このときはじめてデベロッパーツール(検証)の使い方がわかりました。

すご~い、これ便利~

使い方わからなくてあんまり使っていませんでした。

私は全部のPC版の見た目を作る→レスポンシブという順番で作ったのですが、

その都度レスポンシブしていればすぐに気づけたかも、と思いました。

その辺は好みだそうです!

続いての挫折はレンタルサーバー!

レンタルサーバーを使ってサイトを公開?!

まずドメインてなに?ってところから勉強開始しました←

  • サーバー(土地) ※ロリポップ

  • ドメイン(住所) ※ムームードメイン

  • Webサイト(家)

みとか

あのね、私はロリポップでサーバーを契約してるからこれを使いたくて、
でもそのドメインにこのブログ掲載してるんだけどブログ消さないでサイト公開出来る?
新しくドメイン契約しないといけないの?
複数のポートフォリオ載せてる人はめちゃくちゃ契約してるの?
違う?じゃあそれどうやってやるの?

という質問はグーグル先生に聞いてもズバッと回答してはくれません。

もう意味わからないからしょーごさんのロードマップに載っている

レンタルサーバーConoHa WING契約しちゃおっかな寸前までいきましたが…

なんとかロリポップでサブドメイン作ればいいってことがわかり公開出来ました!

そのあと画像だけ表示されないというくだりで5時間消費しましたが(←)

※アップロード時に何故かimgフォルダが消失しているのに気づかず5時間、、、。

形になったときの喜びはひとしおです^^

子どもたちを「サンタさん来ちゃうから」と爆速で寝かしつけ、

スマホで確認して、タブレットで確認して、よしセルフチェック完璧!で深夜に提出!

はい!6個もミスがありました!!!

しょーごさんのレビューで気づいたこと

本当になんでおかしいと思わなかったか自分でもとても不思議なのですが、

私の作ったスマホのファーストビューがこちら。

ででーん↓

写真大きすぎじゃん!

この画面何回もチェックしてるのに、おかしいと思わなかったんですよね…

ロゴの位置とかフォントのサイズをpx単位でこだわって、全体に目が向きませんでした。

こんな感じで修正してみました。

私のコーディング是非見て行ってください↓

ID:ex1  パスワード:ex1

https://test.mitoka-desing.com/

初級Exはこれにて終了!

つぎはjQueryという未知の世界に入っていきます!

Progeteでやってみたら眠くなりました。寝ました。

なんども「向いてないかも~」と思いましたが、

なにかで見た「プログラミングは挫折するのが当たり前」という先人たちの言葉を胸に、

やり抜きます。

しょーごさんのサイトはこちら^^↓

https://cv.recommect.com/ad/ogXiAB?rmt_aid=ja8HdG&openExternalBrowser=1

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

目次