2025/5/26(月)デイトラweb制作コース挫折しない! 539日目
作業:2時間
作業内容
【Web制作コース 539日目】
- 【bakushins-portfolio制作 58日目】コーディング TOTAL 183時間
P | 【コーディング】 bakushins-portfolio制作 新規案件につきデイトラコミュニティーでデザイナーさんと打ち合わせ GraphQLでフェッチした記事にStyling |
D | 【コーディング】 bakushins-portfolio制作 デザイナーさんとデイトラコミュニティーで打ち合わせ ngrok登録、公開 GraphQLでフェッチした記事にStyling |
C | 新規案件につき依頼主との打ち合わせ前にデザイナーさんと事前打ち合わせ それに合わせ ngrokのアカウント作成して進行中のサイトをdesignerさんと共有 ngrok 便利じゃ〜! WordPressからGraphQLでフェッチした記事にStyleが !important しても当たらない 今日の挫折感はここ☝️ どうやらWordPressの記事はもともと動的に設計されていることが原因 globals.scss もしくは _variants.module.scss からStyleを当てる必要がある |
A | 1日のルーチンを積み上げる! |

bakushin
さらにフェッチで dangerouslySetInnerHTMLで直接HTMLを挿入しているため、そのHTML内の要素には追加のクラス名が付与されない!
→ classNameがつかないのでStyleを当てるのに設計が必要🤔明日もDO!

bakushin
とにかく、テーブルなどもCocoonのスタイルが再現された‼️ここからフェッチ先のStyleで仕上げる!

2025/5/27(火)デイトラweb制作コース挫折しない! 540日目
作業:3時間
作業内容
【Web制作コース 540日目】
- 【bakushins-portfolio制作 59日目】コーディング TOTAL 186時間
P | 【コーディング】 bakushins-portfolio制作 GraphQLでフェッチした記事にStyling |
D | 【コーディング】 bakushins-portfolio制作 GraphQLでフェッチした記事にStyling Widget実装 |
C | dangerouslySetInnerHTMLでフェッチしたからなのやっぱり🤔 styleがなかなか効かない ようやくすいすいと効くようになった Styling自体はなんでもないんだけんど🤔 で、気になるWidgetの実装も並行した Claudeに図解もしてもらいながらやっとSSGで実装できた 最初に答えがわかると復習・学習が早いので助かる😊 他の実装方法もあるだろうけど自分の軸をずらさなければ型が決まってくる SSGが今回は軸👍️ 思ったより残りのStylingも早く終わりそう、明日でStylingをFINISHしたい🔥 |
A | 1日のルーチンを積み上げる! |

bakushin
デイトラのWeb制作コースではNext.jsもヘッドレスCMSも教わってない内容👨💻
ClaudeはじめAIがないと開発が遅くなるし挫折感が半端ないくらい押し寄せてくるだろうな🤔
2025/5/28(水)デイトラweb制作コース挫折しない! 541日目
作業:4時間
作業内容
【Web制作コース 541日目】
- 【bakushins-portfolio制作 60日目】コーディング TOTAL 190時間
P | 【コーディング】 bakushins-portfolio制作 GraphQLでフェッチした記事にStyling |
D | 【コーディング】 bakushins-portfolio制作 GraphQLでフェッチした記事にStyling Widget実装 新規案件の打ち合わせ日時決定 |
C | ちょっと苦戦するかなぁぁ🤔 って思ったけどフェッチ記事のStylingも完成👍️ WordPressのプラグイン(Table of Contents Plus)もCocoonも曲がある かと思いきや妙に素直な感じでStylingがキアmるので半分笑いながらのStylingだった😊 WidgetはなかなかWordPressじゃないとクセが強いわ🤔 でも、これであとはレスポンシブでデブロイ可能だ! 明日、明後日で終えたいなぁ 頑張る🔥 |
A | 1日のルーチンを積み上げる! |

bakushin
新規案件の打ち合わせ日時を、依頼主、デザイナーさんと決定した!
依頼主さんがZoom有料契約しているのでZoom決定!
2025/5/29(木)デイトラweb制作コース挫折しない! 542日目
作業:2時間
作業内容
【Web制作コース 542日目】
- 【bakushins-portfolio制作 61日目】コーディング TOTAL 192時間
P | 【コーディング】 bakushins-portfolio制作 スムーススクロールの修正 |
D | 【コーディング】 bakushins-portfolio制作 Serviceセクションのカード修正 Loading実装の設計 |
C | スムーススクロールを修正しようと思ったけど別パートを修正 どうしてもServiceセクションのFigureで表示してるimageの画素が荒くなる さらにimage囲ってるborderも表示されなくなった、なぜ🤔 1時間ほど???が続き、ようやく原因にたどり着いた Next.jsの画像最適化機能と競合してる感じ Webpにしてたので4-16kbが4枚ほど AIに聞くとこのサイズなら Next.jsのタグではなくても良い!と回答 HTML で imageタグを使ったら画素が直った! デザイナーさんにオリジナルの画像を送っていただいたりお手数おかけしたけど、まさかのNext.jsだった🤔 勉強になった🍀 |
A | 1日のルーチンを積み上げる! |

bakushin
Loding画面を作るのを忘れてた!devで毎回表示されるのも面倒経ったので最後に製作計画だった!
GSAPが良さそう!ディレクトリ構成のベストプラクティスをClaudeに相談した😊
レスポンシブの手前なのに、あともう少し🔥
2025/5/30(金)デイトラweb制作コース挫折しない! 543日目
作業:4時間
作業内容
【Web制作コース 543日目】
- 【bakushins-portfolio制作 62日目】コーディング TOTAL 194時間
P | 【コーディング】 新規案件の打ち合わせ bakushins-portfolio制作 スムーススクロールの修正 |
D | 【コーディング】 bakushins-portfolio制作 新規案件の打ち合わせ(Zoom) Serviceセクションのカード修正 Loading実装の設計 |
C | 新規案件の打ち合わせ 依頼主とポートフォリオサイトでお世話になっているデザイナーさん https://x.com/ngu_pursing と3人で 仕様としては Shopify でデザインから作成となったので Remix でサイト制作となった 会員サブスクリプション(決済機能) ログイン後研修プログラムヘアクセス可能 メールマーケティング ブログ・お知らせ機能 こんな仕様に決定😊 |
A | 1日のルーチンを積み上げる! |

bakushin
サイト管理として毎月の管理費をいただけることになる感じ🙌
デザイナーさんも今回の依頼主から定期的にいろいろなデザイン依頼がある感じ🙌
LINE構築も👍️🔥
今後はWebマーケティングも託したいと依頼があったので嬉しい😊
2025/5/31(土)デイトラweb制作コース挫折しない! 544日目
作業:7時間
作業内容
【Web制作コース 544日目】
- 【bakushins-portfolio制作 63日目】コーディング TOTAL 201時間
P | 【コーディング】 bakushins-portfolio制作 スムーススクロールの修正 |
D | 【コーディング】 bakushins-portfolio制作 Loading実装の設計 Widgetの実装修正 WebMのフェッチ修正 ドロワーボタン・再アニメーションの修正 |
C | 色々とカオス化した最終盤の感じ PC幅のStyling、Animationは100%完成!と思ったところ でも、LodaingのStylingが最終的に位置調整だけ残ってたことを1日が終わってから気付いた😊 でも、ようやくあとはレスポンシブにまでたどり着いた! ここから1週間でデブロイに持っていこうと思う! 何よりも2週間ほど手を付けれなかったWebGLの学習に時間を振り戻さねばならない! 藻で風呂いちかくなってきたこと、月替りもありXでのPDCAに振り替えようと思うところ🤔 とにかく🔥 |
A | 1日のルーチンを積み上げる! |
コメント