kojo@web制作勉強中 | 山好き

40代女子、派遣社員+ちょっと副業。 派遣は3年の期限があるのがわずらわしくなり、手に…

kojo@web制作勉強中 | 山好き

40代女子、派遣社員+ちょっと副業。 派遣は3年の期限があるのがわずらわしくなり、手に職をつけてフリーになりたいとWeb制作勉強中。 もっと早く始めればよかったとも思うけど、まだまだやる気も体力もあるのでがんばります。 趣味は山登り。おこじょに会えるとキュンキュンします。

デイトラWeb制作 -Day21~22-　課題③まで

なんだか急に子育て放棄されたみたいな、、自分で何とかがんばれという課題になりました(笑)　 始めに作ったケーキ屋さんのwebページに、アコーディオンやスクロールトップボタンなどを追加します。 難易度急に高くなったように感じます。でもいろいろ検索しながら、なんとかできた。やったー！ でも合ってるのか、少し不安です。特にJavaScript（jQuery)は、一応動いたのですが、初級はコードレビューがないので、AIにレビューしてもらいました。 変数を使おう 何度も使うのでな

kojo@web制作勉…

    • デイトラWeb制作-Day20- ChatGPT活用

      ChatGPTなど、AIを使ってみたほうがいい時5つ辞書として活用（なんとなく知っていた上で、「こういうのあったよな、なんだっけ」って時に使うとよい。 タイポ（打ち間違い）のチェック（自分で探してもなかなか発見しづらい） エラーメッセージの意味を知るのに使う（英語も怖くない。エラーメッセージには答えが書いてある） コードの解説に使う。（まずは自分で読んで理解しようとしてみてから！初めから丸投げしないこと） 記事の解説に使う。（検索した解説記事などを読んで、さらにわか

      kojo@web制作勉…

      • デイトラWeb制作-Day19-　アニメーションいろいろ

        今回はちょっと課題感があり、楽しそうです。 アコーディオンとか、ハンバーガーメニューを作ります。 作成していて、覚えておいた方がよさそうなことをメモしておきます。 buttonタグについてJavaScript、jQueryのクリックイベントに使用するタグは、 「button type="button"」として作成するのが良い。 理由：キーボード操作でカーソルをあてることができるから。 要注意：buttonタグには、必ずtype属性を指定すること！！！ type属性を指

        kojo@web制作勉…

        • デイトラWeb制作-Day18-　jQuery②メソッドとパラメータ

          本日もこつこつやっていきます。 メソッド、パラメーターとはメソッドとは、セレクタで指定した要素を操作する命令文のこと。クラスを追加して！CSSを設定して！テキストを変更して！など。 パラメーターとは、どのようにメソッドを実行するか具体的に指示する補語。パラメーターに渡された値のことを引数と呼ぶ。 // クラスの追加jQuery("#js-btn").addClass("btn-register");//クラスの削除jQuery("#js-register").remove

          kojo@web制作勉…

        デイトラWeb制作 -Day21~22-　課題③まで

        kojo@web制作勉強中 | 山好き

          デイトラDay17 jQuery①

          jQueryの基本的な書き方まずはCDNを読み込み。<body>タグ直前に記載しておく。 ただし自作jsファイルより前にすること。 基本文法。 jQuery("主語").動詞("補語"); //javaScriptの場合document.querySelector("#js-title").innerText = "Hello, javaScript!";//jQueryの場合jQuery("#js-title").text("Hello, jQuery!");//また

          kojo@web制作勉…

          デイトラDay17 jQuery①

          kojo@web制作勉強中 | 山好き

          デイトラWeb制作 Day16 -JavaScript基礎講座（DOM操作）-

          動きが付けられると、プログラミングしてる～、っていう感じで楽しくなってきます。 20年前には、オブジェクトって意味わからん、って思っていました。初心者向け情報がたくさんある、素晴らしい時代になりました。 「DOM」とはDocument Object Modelの略称 HTMLやXMLドキュメントなどのマークアップ言語と、CSSをJavaScriptなどのプログラミング言語からアクセスできるようにするためのAPI（仕組み） DOMは、HTMLやXMLのドキュメントをオブジェ

          kojo@web制作勉…

          デイトラWeb制作 Day16 -JavaScript基礎講座（DOM操作）-

          kojo@web制作勉強中 | 山好き

          裏銀座ルート山行記録（2024.9.11-14）

          7月に計画して悪天で中止した、裏銀座ソロ山行。 そして平日しか予約が取れない山小屋たち。 遅い夏休みを頂き、平日の贅沢な山行をしてきました。 前泊+山小屋3泊。七倉山荘、野口五郎小屋、三俣山荘、ヒュッテ大槍。 烏帽子から双六までを裏銀座といって歩く方は結構いますが、やっぱり槍まで行くのが正式だよね、と思い、少し背伸びしてこのルートに決定。 天気予報は連日「晴れのち昼から雨」だったけど、一度もレインウェア着なくてすみました。 今回は確実に降られると思い、レイン着ても暑くな

          kojo@web制作勉…

          裏銀座ルート山行記録（2024.9.11-14）

          kojo@web制作勉強中 | 山好き

          デイトラWeb制作 Day14～15 JavaScript基本文法　Object

          引き続きJavaScriptの基礎を学びます。 let 変数 of 配列 が、なかなか私の中に定着しないところ。 オブジェクトとは配列と同様に複数のデータを扱うことができる。 配列と違うところは、キー（プロパティ）を使ってデータを管理すること。そのため、何を表すデータなのかが理解しやすくなる。 const scores = { math: 87,　//数学のスコアだよ　 english: 90,　//英語のスコアだよ science: 65, //サイエンスのスコア

          kojo@web制作勉…

          デイトラWeb制作 Day14～15 JavaScript基本文法　Object

          kojo@web制作勉強中 | 山好き

          デイトラWeb制作 Day13 JavaScript 変数と定数について

          遅めの夏休み頂き、5日間山に行っていました。裏銀座コース、とっても良かった。おこじょさんにも会えた♪ リフレッシュできたし、やっぱりwebのお仕事したい！と思いました。勉強再開します。 変数は「let」で定義する再代入ができて再宣言ができない。 書き換える値は、「let」で定義。 letは、for文のカウンターや一時的に使用する変数に適している。 定数は「const」で定義する再代入と再宣言ができない。 書き換え予定がないものは、予期せぬ書き換えを防ぐために「const」

          kojo@web制作勉…

          デイトラWeb制作 Day13 JavaScript 変数と定数について

          kojo@web制作勉強中 | 山好き

          デイトラWeb制作 Day8~10 HTML/CSS基礎編終了

          基礎編終了無事にDay8～10の課題終わりました。 先にDay11～12の、emmetやスニペットを学習してから戻ってきたの、正解だったかもしれません。たくさん活用しました！ おしゃれなサイトができてうれしいです。 チャレンジしたこと(css)cssの入れ子を使ってみた。 メディアクエリに不等号記号を使ってブレイクポイントを指定してみた。書き方：「min-width: 768px」→　「width >= 768px」 チャレンジ結果無事に反映できて、ちゃんと使えること

          kojo@web制作勉…

          デイトラWeb制作 Day8~10 HTML/CSS基礎編終了

          kojo@web制作勉強中 | 山好き

          デイトラWeb制作　-Day11-

          Day8-10飛ばして、早く使いたい便利機能の学習レッスンの一覧を見ると、Day11でショートカットキーとかemmetの使い方、設定の仕方の方法の解説があるようでした。 であれば先に便利機能を覚えてから、戻ってみようかと思います。 全動画を見ました。9割がたすでに使用していた機能でしたが、知らなかった＆便利そうなものをメモしておきます。 cssのemmet①　値がアルファベットの時の展開 m:a → margin: auto; 「m12 →　margin: 12px;

          kojo@web制作勉…

          デイトラWeb制作　-Day11-

          kojo@web制作勉強中 | 山好き

          デイトラWeb制作　-Day7-

          flexbox内に配置する時の、imageの幅指定方法を整理この二日間、急遽地元へ戻ることに。新幹線内で作業しました。画面小さいと効率落ちますね。 さて、今のデイトラ講座のお手本は、直接imgタグに幅を指定しています。 私は「imgタグには直接指定せず、divなどで囲んで指定する」というやり方を覚えていたので、そのやり方でhtmlを書いてました。 レスポンシブ対応の説明のところで、pc画面での画像幅を指定する箇所が出てくるのですが、imgを囲んだdivに幅指定しても、言う

          kojo@web制作勉…

          デイトラWeb制作　-Day7-

          kojo@web制作勉強中 | 山好き

          本日の進捗:デイトラサポート→Discord登録。そして、rgbaが古いという新たな知識。

          本日の出来事　スマホの画面破損本日、スマホ画面に、縦線が急に入る。 かなり蛍光グリーンな感じでまぶしい。 これは毎日見てたらかなり精神やられそうなので、我慢せず修理屋さんへ直行。1時間で修理できる、というが、、4万円超。たかっ。 しかし毎日この蛍光グリーンみているストレスor新規購入コストを考えたら修理依頼するしかない。 頑張ってweb制作するしかない。 修理待ち時間にデイトラのDiscord参加修理待ち中に入ったスタバの、セキュリティ大丈夫かわからないWifiで、デ

          kojo@web制作勉…

          本日の進捗:デイトラサポート→Discord登録。そして、rgbaが古いという新たな知識。

          kojo@web制作勉強中 | 山好き

          Macチャレンジ+デイトラDay5

          本日のタスクMac使ってみよう！もろもろ設定作業 デイトラDay5 （おまけ）メルカリ出品 1.Macを使ってみる ガチでWindowsユーザーです。 デイトラはDay5から、いよいよコードを書き始めますが、 家族が使わなくなってしまったMacbookAir（黒くて指紋が目立つやつ）を譲り受けたので、せっかくなのでMacでやってみようかと。もろもろの設定をしてみます。 メモリ8GBなので若干スペック心配。 最初に立ち上げてMacさまにおすすめされたのは、OSのアッ

          kojo@web制作勉…

          Macチャレンジ+デイトラDay5

          kojo@web制作勉強中 | 山好き

          デイトラweb制作コース開始　Day4までで知らなかったこと

          デイトラweb制作コース始めました。営業力的なものが自分には皆無なのでそっちの方向も学びたいのと、自分の知識が通用するのか自信がないのと、デイトラ運営の皆さまのYouTubeなど拝見してその熱意に感動し、もう寄付でもいいや、っていう感じでぽちりました。 しかし始めたからにはちゃんとやりたい。頑張っていきます。 他社や独学でもちょっと勉強してたので、知っていることもあるのですが、 きっと自分が知らないことがあるはず…！と、がんばって初見の情報を探しています。 やっぱりありまし

          kojo@web制作勉…

          デイトラweb制作コース開始　Day4までで知らなかったこと

          kojo@web制作勉強中 | 山好き

          Sassで@charset "UTF-8"が出力されたりされなかったり。

          本当の駆け出しです。 初案件、初心者用なのかすでにcssファイルがあって、この中に書いていってね、て感じなのです。 私はsassが使いたいので、sassファイルに、もともとお客様のcssにあった内容をコピーしてから実装しようとしたのですが、@charsetが、出力されない。あれ？ そこでとりあえずの策として、sassにコメントで追加し、納品時にcssにてコメントを外そうとする。 /* @charset "utf-8"; //最後にコメントを外す。------------

          kojo@web制作勉…

          Sassで@charset "UTF-8"が出力されたりされなかったり。

          kojo@web制作勉強中 | 山好き