さえずり ももこ

40代後半で、やむを得ず(?)WEB勉強を始めました。 その記録を残したいと思います。

さえずり ももこ

40代後半で、やむを得ず(?)WEB勉強を始めました。 その記録を残したいと思います。

最近の記事

nav難しい・・・

デイトラのポートフォリオ作成過程中。 ポートフォリオ作成方は、テンプレートとなるテーマを購入するなりと入手宇して、中身を自分に合わせて修正する感じ。 他の方の作られてるのをいろいろ見てみると、自分のポートフォリオがなく、もっと追加したいなと思い、クリ★スタさんのデザインカンプ初級編に挑戦。 htmlは書けたけど、やっぱりcssが・・・ nav menuのところで詰まる・・・ containerを使うと、navのitemが垂直方向の真ん中にこない・・・ containerを

    • デイトラ16日目完了

      昨日に引き続き、今回はスマートフォン版のXD作成。 レッスン動画やサンプルがMacなので、同じフォントがなかった。 昨日、そのことをSlackで調べたら同じフォントを入れないとだめで、 今はとりあえずやり方の習得にフォーカスを置きましょう的なことが書いてあったのでそれでよしとした。 でもフォントが違うことで、少しずつずれが生じて要素間の間隔を合わせても結果物には大きさのズレが生じた。仕方ないか・・・ しかし、やり方はわかった。 レッスン動画の講師の方の作業が早くて見ながら感

      • デイトラ15日目完了

        XDの学習。 学習といっても多分初歩的な段階だろうけど楽しかった。 時間たつのが早すぎてやばかった。 デイトラからダウンロードしたXDファイルを開いたら、 すごく小さく表示されてしまい、右上のズームらしきもので倍率を大きくすると今度はワイヤーフレームが見えなくなり・・・ レッスン動画には説明がなかったのでググって解決。 ■手こずっが解決したこと ガイドラインを引くことができなかった。 動画ではマウスをアートボードの左端に当てると、マウスポインタ―の形が変わりドラッグで線が

        • デイトラ14日目完了

          Bootstrapを利用してデイトラの簡易ページの作り替え。 目標時間1.5時間内。 実際は1時間10分ほどでできた。 ■手こずったが解決できたこと 1.コース一覧をBootstrapのCard-decksで作ったけど、 コース一覧の背景色をしていするとイメージ下のpタグの下の余白が白のままになってしまった。いろいろやってみたが結局解決できず、14日目の講座に添付されていたツイッターの動画を見ると、コース一覧と下のお問い合わせの背景色が反転していた・・・なるほどね・・・

          昨日の問題解決!!

          Bootstarpの練習がてら修正したホームページ。 要素の幅がどうしてもcontainerをはみ出してしまってその原因がわからなかったが、デイトラのslackで教えてもらった。 container要素にはスタイルを当てないこと!! スタイル等を当てたいのなら、直下にもう一つの要素を作りそこに当てること。あー解決してとてもすっきり!うれしい!! 教えてくださった”おっきー様”に感謝!!

          昨日の問題解決!!

          デイトラ9-12日完了

          昨日は早く予定切り上げるつもりが長くなってしまい、勉強できなかった。 今日は予定の無い日だったので一日じっくり(Toggleの時間では約8時間)勉強できた。 Bootstrapの勉強。 CSSであれだけ苦労して、いまだにあまりよくわかっていないのに・・・という正直な気持ち。 でもCSSに別途書き込まなくてもいいから楽だけど、表現の自由はあまりないなと思った。私が知らないだけなのかわからないけど、色の設定なども少なすぎるから結局はstyleで別途指定。 デイトラの勉強は午前

          デイトラ9-12日完了

          デイトラ8日目完了

          8日目完了。 デイトラを受講する前に一度デザインカンプからのコーディングをやったことがるので、Chromeの検証ツールで確認しながらコーディング。 8日目の指示ではできるだけ動画を見ずにと書いてあったけど、フォントサイズとかパディングやマージン、色がわからないからこれでも大丈夫だったのかな・・・ コーディングは割とすらすら書けたけど、やっぱりCSSあてるのが難しかった。ヘッダーの右側のメニューがどうしても横並びにならなくて・・・ 何度ソースを見直してもわからなかったけど、原

          デイトラ8日目完了

          デイトラ7日目完了

          レシポンシブデザインのコーディング。 iPhoneXに合わせる設定。 PC版の設定を後から上書きしていく感じ。 主な作業はfloatの無効化。 各要素の幅の設定。 ヘッダー部分の3つ並ぶメニューが左によってしまう問題。 PC版ではfloatに設定。 レシポンシブではflexに設定。 PC版でfloatに設定するとき、 float(浮いている)要素をcontent=""という疑似要素を作り上げそこに格納していき、display:block; としたものをいじる感じだった。

          デイトラ7日目完了

          デイトラ6日目完了

          悩みに悩んだ末に先週から始めた#デイトラのWEB制作コース。 6日目完了。 floatよりflexが簡単。 作成画面途中の初級、中級、上級画像とテキストを横並びにするのに 動画の説明通りにやってきたつもりなのに、横並びにはなったものの 初級と中級は小さく上級は元のサイズのままだった。 びっくりしてコードの見直し。 原因は、上級欄のdivの閉じカッコの位置が間違っていた。 割とすぐ見つけてよかったけどこんな失敗はパニックる・・・ 気をつけよう。 Emmet使いやすい。 まだ

          デイトラ6日目完了

          今日の学習記録

          ProgateのJavaScriptコースⅠ~Ⅴまで。 ProgateのjQueryはどうやらJavaScript旧盤を見てくださいということらしいが、どうしたらいいんだ? 今、勉強しているJSはES6バージョンなのに・・・ jQueryまでが一通り終わったら有料の学習サイトでの学習を検討している。 候補はデイトラのWEB制作コースかテックアカデミーのフロントエンドコース。値段は20万円程度差がある。 金額以外の違いはメンターがいるかいないか。ビデオ面談?があるかないか。

          今日の学習記録

          今日やったこと Progate-Sass

          ProgateのSassコースをやりました。 独学のロードマップをいろいろ参考にしていますが、 初級レベルでも知っておかなきゃいけないものが多くて その数からして、私できる?!って気持ちになってしまいますが・・・ やるとこまでやってみます。

          今日やったこと Progate-Sass

          1週目でやったこと

          ProgateのHTML&CSSを一通り終えて、ネットで見つけた@Shogo(しょーごログ運営)さんのデザインカンプの入門問題をやろうとするもさっぱりわからなかったので、Udemyから村守 康さんのこちらの講座を聞きました。https://www.udemy.com/share/101XQ8AEcfeFhWRXUH/ とても分かりやすかった。すべてを真似てやるのは私にはまだ無理だけど、Progateの基本をもっと整理した感じ。この講座を聞いてやっとできました。@Shogo(

          1週目でやったこと

          この年でWEBの勉強

          なんで勉強を始めたか。 2021年。40代後半です。 若い時、約3年プログラマーとして仕事をしていました。 プログラマーと言っても、大学を卒業してそんなに知識もなく、 実務で活躍するほどの実力もなかったのです・・・ 入社して2年目で結婚しました。 仕事はずっと続けたかったのですが、いろんな状況が重なってしまい結局やめることになりました。 それから今までプログラミングなんで無縁との生活をしてきました。 子育てして家庭のことをやって。 そんななか夫が失業しました。 今は家でフ

          この年でWEBの勉強