ryouri

https://github.com/koishichito/progate-hackathon

Next.js

GitHub

React

Figma

TailwindCSS

料理名だけでなく味や難易度などのタグも選べるレシピ検索アプリ

もしお

トリオとトリオ

的場安美

Keeeisukeeee

推しアイデア

料理を作る際に気になるポイントをタグとして感覚的に検索できる!

作った背景

時間・費用・環境など制約が多い一人暮らしの自炊で、料理初心者でも使いやすいレシピ検索アプリがほしかった

推し技術

vercel v0 TailwindCSS

プロジェクト詳細

概要

「料理名だけでなく味や難易度などのタグも選べるレシピ検索アプリ」

このアプリの検索方法は、①料理名を検索フォームに入力する方法と②「味」「食事タイプ」といった項目ごとにタグを選択する方法があります。選択できる項目とタグは以下の通りです。

  • 味: 「甘い」「辛い」「あっさり」「こってり」
  • 費用: 「安い」「高い」
  • 時間: 「短い」「長い」
  • 難易度: 「簡単」「難しい」
  • 食事タイプ: 「主食」「主菜」「副菜」「汁物」
  • 料理のジャンル: 「和食」「洋食」「中華」「イタリアン」

こだわりポイント

  • 料理を作る際に気になるポイントをタグとして感覚的に検索できる、分かりやすいアプリを作りたい

使用技術

  • React
  • TailwindCSS
  • Vercel v0 自然言語からWebページのUIデザインやコンポーネントを自動生成してくれるAIツール。 シンプルで温かみのあるWebページに仕上がりました。

もしお

@8806363f3023f261