Skip to content

Commit

Permalink
docs: 説明資料追加
Browse files Browse the repository at this point in the history
  • Loading branch information
@shuntatakemoto
shuntatakemoto committed Jan 8, 2022
1 parent 5091436 commit 7f685df
Show file tree
Hide file tree
Showing 8 changed files with 108 additions and 46 deletions.
29 changes: 18 additions & 11 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,21 +1,28 @@
# Food Invite

現在開発中です

## 概要

https://food-invite.vercel.app/ <br>
この web アプリの目的は知り合いをご飯に誘うハードルを下げることと、地元民がお勧めする飲食店を知ることです。<br>
具体的には、<br>
・旅行などで外食の際、食べログで上位の店に行くのではなく、旅行先の地元民がお勧めする店に行きたいという経験<br>
・友達とご飯に行く際、食べに行く店がなかなか決まらなかった経験<br>
・あまり親交はないが一緒にご飯に行って話を聞きたいという経験<br>
・特定の人のお気に入りの飲食店はどこなんだろうという経験<br>
上記の経験で感じた問題を解決する Web アプリです。<br>
知り合いと外食に行きやすくなるアプリ<br>

## 開発した経緯

・Twitter で『今日の夜ご飯行きませんか？』とつぶやいて誰からもリプがなかったら悲しい＆誰かがリプしていたらもう追加でリプしにくい<br>
・Twitter でフォローし合っているがあまり親交がない人と一緒にご飯に行って話を聞きたい<br>
・友達とご飯に行く際、食べに行く店がなかなか決まらない<br>
・外食の際、食べログで上位の店に行くのではなく、知り合いがお勧めする店に行きたい＆知り合いのおすすめの店を知りたい<br>

上記の問題を解決する Web アプリです。<br>

## 主な機能

・行きたい飲食店リスト、お気に入り飲食店リストなどといったリストを作成できます（イメージは Amazon の欲しいものリスト）<br>
❶ 行きたい飲食店リストやお気に入りの居酒屋リストなどのリストを作成し、店名と画像を追加する（イメージは Amazon のほしい物リスト）<br>
❷ リストを Twitter に共有して一緒に行ってくれる人を募る<br>
❸ リストを見たフォロワーが一緒に行きたいボタンを押すと直接 Twitter の DM にメッセージ付きで遷移<br>
❹ あとは日程を調整して外食へ GO!<br>

## これから実装予定の機能

地元民がお勧めする飲食店を知りたい
・共同編集でみんなでリストを作成できます（例えば鹿児島旅行のときに外せないとんかつ屋さんのリストに対して店追加のリクエストができる）<br>
・Twitter で今日のご飯行く相手の募集ができます（自分の行きたい店リストを twitter に共有し、行きたい人がいたら DM に通知される）<br>
・都道府県ごとにリスト、お店を検索できます（旅行先のご飯を決めるときは Food Invite で検索！）<br>
Binary file added public/explanation-slide-1.jpeg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/explanation-slide-2.jpeg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/explanation-slide-3.jpeg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/explanation-slide-4.jpeg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/fi-logo.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion src/components/templates/layout/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ type LayoutProps = {
const Layout = ({
children,
title = 'Food Invite',
description = '知り合いをご飯に誘うハードルを下げることを目的としたアプリです',
description = '知り合いと外食に行きやすくなるアプリ',
image = 'https://food-invite.vercel.app/default.png',
}: LayoutProps) => {
const user = useSelector(selectUser);
Expand Down
123 changes: 89 additions & 34 deletions src/pages/index.page.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import type { NextPage } from 'next';
import Head from 'next/head';
import Image from 'next/image';
import React from 'react';
import { Button } from '../components/atoms/Button';
import Layout from '../components/templates/layout';
Expand All @@ -17,47 +18,101 @@ const Home: NextPage = () => {
<>
<Head>
<title>Food Invite</title>
<meta name='description' content='Generated by create next app' />
<meta name='description' content='知り合いと外食に行きやすくなるアプリ' />
<link rel='icon' href='/favicon.ico' />
</Head>

<Layout>
<main className='text-center bg-main-color'>
<p className='p-12 text-5xl font-bold'>Food Invite</p>
<p className='m-4'>サービスを利用するにはTwitterでログインが必要です。</p>
<Button label='Sign In with Twitter' onClick={signInTwitter} backgroundColor='#EEE8AA' />
<p className='mt-16 text-2xl'>このアプリは何？</p>
<p>・知り合いをご飯に誘うハードルを下げること </p>
<p>・地元民がお勧めする飲食店を知ること</p>
<p>を目的としたアプリです</p>
<main className='bg-main-color'>
<div className='pt-16 text-center md:flex'>
<div className='flex justify-end pr-8 md:w-1/2'>
<div>
<h2 className='py-4 text-5xl font-bold md:pt-20'>Food Invite</h2>
<p>知り合いと外食に行きやすくなるアプリ</p>
</div>
</div>
<div className='py-8 md:flex md:justify-start md:pl-16 md:m-auto md:w-1/2'>
<Image src='/fi-logo.png' alt='food-image' width='160' height='160' />
</div>
</div>

<div className=' p-4 '>
<p className='mt-12 text-2xl'>このアプリでできることは？</p>
<p className=' mt-4'>
・行きたい飲食店リスト、お気に入り飲食店リストなどといったリストを作成できます（イメージはAmazonの欲しいものリスト）
</p>
<br />
<p>
・共同編集でみんなでリストを作成できます（例えば鹿児島旅行のときに外せないとんかつ屋さんのリストに対して店追加のリクエストができる）
</p>
<br />
<p>
・Twitterで今日のご飯行く相手の募集ができます（自分の行きたい店リストをtwitterに共有し、行きたい人がいたらDMに通知される）
</p>
<br />
<p>
・都道府県ごとにリスト、お店を検索できます（旅行先のご飯を決めるときはFood
Inviteで検索！）
<div className='py-8 text-center md:py-28'>
<p className='m-4'>サービスを利用するにはTwitterでログインが必要です。</p>
<Button
label='Sign In with Twitter'
onClick={signInTwitter}
backgroundColor='#EEE8AA'
/>
</div>

<div className='pt-12'>
<p className='px-4 text-3xl font-bold underline md:px-12'>このアプリは何？</p>
<div className='md:flex'>
<Image
src='/explanation-slide-1.jpeg'
alt='food-image'
width='1920'
height='1080'
loading='lazy'
/>
<Image
src='/explanation-slide-2.jpeg'
alt='food-image'
width='1920'
height='1080'
loading='lazy'
/>
</div>
<div className='md:flex'>
<Image
src='/explanation-slide-3.jpeg'
alt='food-image'
width='1920'
height='1080'
loading='lazy'
/>
<Image
src='/explanation-slide-4.jpeg'
alt='food-image'
width='1920'
height='1080'
loading='lazy'
/>
</div>
</div>

<div className='px-4 pt-16 md:px-12 md:pt-28'>
<p className='text-3xl font-bold underline'>なんでつくったの？</p>
<div className='py-8'>
<p>友達と外食の際、食べに行く店がなかなか決まらない</p>
<br />
<p>
Twitter
で『今日の夜ご飯行きませんか？』とつぶやいて誰からもリプがなかったら悲しい＆誰かがリプしていたらもう追加でリプしにくい
</p>
<br />
<p>
Twitter でフォローし合っているがあまり親交がない人と一緒にご飯に行って話を聞きたい
</p>
<br />
<p>
外食の際、食べログで上位の店に行くのではなく、知り合いがお勧めする店に行きたい＆知り合いのおすすめの店を知りたい
</p>
<br />
<p>上記の問題を解決する Web アプリです</p>
</div>
</div>

<div className='py-8 text-center md:pt-28'>
<p className='pb-4'>ソースコード⬇︎</p>
<a href='https://github.com/shuntatakemoto/next-food-invite'>
<Button label='Githubを開く' />
</a>
<p className='pt-4'>
作成者:
<a href='https://twitter.com/haruta_8_'>&nbsp;@haruta_8_</a>
</p>
</div>
<p className='pt-12 pb-4'>ソースコード⬇︎</p>
<a href='https://github.com/shuntatakemoto/next-food-invite'>
<Button label='Githubを開く' />
</a>
<p className='pt-12 pb-4'>
作成者:
<a href='https://twitter.com/haruta_8_'>&nbsp;@haruta_8_</a>
</p>
</main>
</Layout>
</>
Expand Down

1 comment on commit 7f685df

@vercel
Copy link

@vercel vercel bot commented on 7f685df Jan 8, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

Please sign in to comment.