Web制作学習 デイトラモダン開発 DAY 33 Next.jsでSEOに関する設定を行おう
TD設定TDの設定には以下の2つを使う！metadata：通常ページで使用generateMetadata：動的ページで使用（paramsで取得）ハッサク上記2つとも、使う時には「import type { Metadata } from ...
Web制作学習
Web制作学習 Web制作学習 デイトラモダン開発編 DAY31 「SSR」「SSG」「ISR」の動きを確認しよう
比較fetchが動くタイミングが違う！SSR：常に最新の状態標準の仕様。（毎回feachする）メリットデメリット常に最新の情報を取得ができる（管理画面の投稿を変えると即反映）ページスピードが遅くなる可能性があるSSG：build時にページの...
Web制作学習 デイトラモダン開発編 DAY26 WordPressのREAT APIを活用して「お知らせ一覧」ページと紐付けよう
2つのURLの違い「IDだけ返ってくる」か「中身（画像URLなど）まで全部セットで返ってくる」かの違いです。パラメータなし：パラメータあり：1..../posts/（パラメータなし）「軽量版」です。関連するデータはすべてID番号だけで返って...
Web制作学習 デイトラモダン開発編 DAY14 TypeScriptを導入
DAY14 TypeScriptを導入TypeScriptの命名ルール（慣習）⚫︎型 (type, interface, class)：PascalCase（先頭を大文字にする）例: UserName, UserData, StringOr...
Web制作学習 デイトラモダン開発 DAY11 共通ボタンのコンポーネントを作成しよう
CSS Modulesについてクラスの書き方により、タグの書き方が変わる。①キャメルケースの場合.buttonTest {}②ハイフンで繋ぐ場合.button-test {}①キャメルケースの場合<span className={style...
Web制作学習 デイトラ モダン開発編DAY6〜7
DAY6 JavaScriptの基本を復習する2・同期処理処理が終わったタイミングで、JSコードが上から順に実行・非同期処理functionsの前にasyncを書くと、JSコードがとばされず、上から順に実行される(例)export defa...
Web制作学習 【デイトラ実務編】WordPressのブロックテーマを構築しよう DAY 4
デイトラ実務編に「【デイトラ実務編】WordPressのブロックテーマを構築しよう」が追加されたので、学習中に記録したいことをこちらのブログにまとめていきたいと思います！theme.json場所外観＞エディタ＞スタイル用途サイト全体に共通に...
Web制作学習 【忘却録】Swiper.jsでよく使う機能
Swiper.js使用時、いつも詰まる部分を注意点としてまとめました。以下、サンプルコードです。▼script.jsconst swiper1 = new Swiper(".card01 ", { centeredSlides: false...
Web制作学習 【デイトラ】実務編 CSS設計【DAY25~27】
講義動画で覚えておきたい項目が多く出てきた為、CSS設計において覚えおくべき概念を中心にまとめました。講義動画を何回も見直してまとめたので、「あれどうだったけ！」を簡単に見返せる手引書的な役割を意識して作成しています。ハッサクこの記事を書い...
Web制作学習 【デイトラ】実務編 Pugで効率的にコーディングしよう【DAY24】
ハッサクこんにちは！ハッサク(@hassaku_888)と申します。2022年6月からデイトラのWeb制作コース受講開始。日々勉学に励んでいます。日々の学習記録は主にTwitterで配信していますが、振り返りたい内容や量が多い場合は、こちら...