WEBエンジニアになりたい!part8

どうも、冬でも汗ばむカルロスです。

最近はまっているYoutuberはフワちゃんTVです。

 

 

今回は、投稿したレシピの一覧を見れるようにしました。

今回の記事はマジKAWAIIです。

 

前回の課題

サイトに便利機能を追加する。でした。

カルロスは、安い・早い・そこそこ美味しい。がテーマのレシピサイト

「貧乏パッド」を作っています。

その貧乏パッドに、機能を二つ追加しました。

 

気分で検索機能

お会計機能

 

です。

 

気分で検索機能

人に何食べたい?と訪ねた時、

相手からやさしいやつがいい。とか、こってりしたやつがいい。

なんて言われることありますよね。

こういう時に、作る側は何を作ればいいか困っちゃうものです。

そんな時はこちら

 

気分で検索機能です。

 

 

料理のタイプを選択するチェックボックスを作りました。

レシピを投稿する時に、料理にあったチェックボックスを選択してレシピを共有することで

レシピを検索する時に好みのお料理を探すことができます。

この機能を使えば、抽象的なリクエストから最高のレシピを検索することが出来ます。

 

 

お会計機能

貧乏パッドは

安く、手早く、そこそこ美味いがモットーでございます。

安く仕上げるために、材料費を管理しやすくしました。

レシピの材料費を自動計算出来ます。

 

 

左側に食材、右側に価格を入力します。

 

 

麻婆豆腐の食材を入れてみました。

すると、下のお会計の欄に自動で計算してくれます。

250円、お得!

お店の半額以下の値段で食べれちゃいます。

 

 

 

コードはこんな感じ。jqueryを使いました。

 

本編

 

 

我々がどこに来たかわかりますでしょうか。

都会のシティボーイ&ガールならすぐにわかると思います。

 

え?左のコイツは誰かって?

失礼いたしました。彼がシュウイチ先生です。

part8にして初の無修正のシュウイチ先生。

ハンサムですね。乳首がデカそう。

 

 

 

 

正解はそう、

 

 

原宿に来ております。

カルロスも、高校生の時にオシャレな雑誌に乗るため

埼玉から電車を1時間乗り、駅前をうろついていました。

収穫はゼロでした。外見より中身を磨こうと決心した高校時代。

 

 

原宿はオシャレな街です。

オシャレは我慢、多少の寒さも耐えろ聞きますが、

 

 

度が過ぎている女の子が立っていました。

 

 

寒そうなので、前を閉めてあげました。

あれみたいですよね、

あれ、

そう、傘子地蔵ですね。

 

あとは、

 

 

 

クレープ食べました。

ヨーグルトストロベリークレープです。

 

 

半分食べて、後はスズメにあげました。

これもあれみたいですねえ。

なんだかわかりますか?

あれですよ、

舌切り雀です。

 

そんなこんなで、今回のお勉強する場所は

 

 

KAWAII MONSTER CAFEです。

配色のイかれた最高にカワイイカフェです。

店内は、

 

こんな感じ。

めちゃくちゃユニコーンがいます。

サバンナのヌーくらい。(嘘です)

ここに来れば、一生分のユニコーンを見ることが出来ます。

 

 

マスコットもいます。

三週間寝てないムックって感じの見た目でした。

 

 

気になる料理は、

 

 

どれも、カラフル。

 

 

ケーキはこんな感じ。

小学生の時にこんな感じの消しゴムを集めてました。

味は、カワイイ味。

一番美味しかった料理はポテトでした。

 

 

そんなカフェで、お勉強です。

 

 

今回は、投稿したレシピの一覧を見れるようにしました。

参考ページはこちら

https://bituse.info/php/37

https://webliker.info/02035/

 

 

コードはこんな感じです。

新たに、HTMLでページを作成しました。

このページに投稿されたレシピの一覧を見れるようにしました。

実際に使うとこんな感じです。

 

 

レシピを投稿して、

 

 

データベースに保存します。

先ほど作った、ページを確認すると

 

 

こんな感じです。写真と料理名を一覧で見ることが出来ました。

これでようやくレシピサイトって感じですね。

次回は、投稿したレシピを編集できるようにします。

 

次回の課題

今までのpart1から8にかけてWEBプログラミングの勉強をしてきましたが、

内容を理解しきれていない部分があります。

難しいんだもの、仕方ないわ。

そこで、次回の課題は

 

今までの学んだ内容のおさらいをする。

 

今回の学び

・データベースの情報をHTMLで確認できるようになった。

・KAWAIIは原宿にある。

 

実は、WEBエンジニアになりたいシリーズは次回で最終回です。

あと一回でカルロスはWEBエンジニアになれるのでしょうか。

次回、感動のフィナーレになる!かも。

 

 

写真は、KAWAII料理を食べて可愛くなったカルロスとシュウイチ先生です。

 

part9へ続く

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です