Recipe
2024-7
架空の料理レシピサイトを制作してみました。リサーチは主に有名なサイトを参考にし、そこから若い世代に馴染みのあるハッシュタグを用いたトレンド検索機能などもあるような想定で制作を行いました。
-
制作ツール
Visual Studio Code
-
使用言語
HTML, CSS, JavaScript
制作したレシピサイトは1ページですが、複数ページあることを想定して作りました。 すべてのページにヘッダー、サイドメニュー、フッターを一つ一つ記述するのは非常に大変かつ、変更があった場合すべてのファイルを更新しなければならず、非常に管理がしにくいサイトになってしまいます。
そこでこれらの繰り返し使用されるものをコンポーネント化し、JavaScriptのfetchで挿入するような形で設計をしました。 そうすることで、一括に変更ができ管理のし易いサイトにする事ができました。
ソースコードは こちら
スクリーンショット
