Code Monkey home page Code Monkey logo

ashitano-omise's Introduction

Project "F"

Usage

# project clone
$ git clone xxx

# node install
refs: https://qiita.com/1000ch/items/41ea7caffe8c42c5211c
$ nobenv install 10.15.3
$ nobenv rehash

# npm update
npm update -g npm

# npm package install
$ npm i

# development by webpack-dev-server (HMR)
$ npm run watch
$ open http://0.0.0.0:1234

# production build
$ npm run release

# release tag
$ git add ./public
$ git commit -a
$ git push origin master
$ git tag -a release-v0.x -m 'comment'
$ git push origin release-v0.x

デザインルール

原則下記ルールを採用する

font-size

単位はrem

font-family

日本語は'Noto Sans JP', 英数字は'Roboto'

サイジング

8の倍数

アスペクト比

1:1.414 (白銀比)

grid-system

320px単位

  • 1col: 320px
  • 2col: 640px
  • 3col: 960px

記事の追加

1. 画像追加

src/assets/images/<id>/ ディレクトリ作成

  • 一覧用 <id>/top.jpg
  • 詳細 - 内装 <id>/inner.jpg
  • 詳細 - メニュー <id>/menu.jpg
  • 詳細 - スタッフ <id>/staff.jpg

2. 一覧の情報追加

src/data/index.json を編集

3. 詳細の情報追加

src/data/shops/<id>.json を作成、編集

4. ページ生成用の情報追記

page_config.json を編集

5. 確認する

$ npm run watch

ashitano-omise's People

Contributors

tkc310 avatar

Stargazers

 avatar

Watchers

 avatar

ashitano-omise's Issues

[詳細]セクション見出しに予めテーマを入れるか?

セクション見出しに関して
予めテーマを設定しておくか悩みどころ

例えば
・こんなお店です
・オススメの料理はこちらです
・こんな人がいます
など、入れるかどうか悩む。

入れない場合は
・店名
・料理名
・?
などになるかな

[共通]サンプル文言と画像の差し替え

3投稿分の画像とテキストの差し替え

画像はLINEで送付済
差し替え文言は下記を利用
画像の関係性は気にしなくてok


———————————————
店名
Cafe&Bar CIKAME

内装
目黒駅から歩いて3分のところに開店します。”インスタ映えする料理”をテーマに有名ホテルで修行したシェフが料理を作ります。お店の雰囲気はヨーロッパから取り寄せたアンティーク家具を中心にエレガントでありながらくつろげる空間を意識しています。店内のレジ横には親しくさせていただいているアーティスト様の作品も販売しております。ぜひお手にとってご覧ください。

料理
オーナーの地元である新潟から取り寄せたお米や野菜、お肉を使ったメニューがオススメです。お一人様でも十分に食べきれる量となっておりますが、お二人様でシェアしていただくとちょうど良いかと思います。テーブルに置いてあります小物と合わせてお写真撮影していただけますとインスタ映えすること間違いなしです!

スタッフ
オーナーである鈴木幸子とシェフの田中庸介が皆さんをお待ちしております!オーナーの鈴木は長年カフェでバリスタとして働いていた経験を生かし、皆さんに美味しいコーヒーをご提供いたします。またイケメンシェフとしてお客様からお声がけいただくことも多い田中は顔だけではないということをお料理で表現しております!皆様、何卒よろしくお願いいたします。

———————————————
店名
Coffee Shop 豆屋まめ

内装
店名にもある豆をモチーフにしたインテリアやオブシェをご用意しております。コーヒー豆が店内でゆっくり寛いでいただけるように、雑誌もお店の入り口の本棚にご用意しております。ぜひコーヒーを飲みながらゆっくりコーヒーをご賞味ください。店内のインテリアで一番のおすすめ豆の柔らかいフレームをモチーフにしたクッションです。

料理
コーヒー豆は全世界から取り寄せています。一杯一杯丁寧にドリップしたコーヒーはどれもおすすめですが中でも1番の自信作はモロッコ産のコーヒー豆、テパタオテネンです。甘い香りからは想像もできない渋い味わい、一度飲んだら癖になってしまう大人向けの味わいとなっております。ラテアートをリクエストいただければ喜んでデザインいたしますので、お気軽にリクエストしてください。

スタッフ
若い頃はバックパッカーとして世界のコーヒーを味わうために旅をしていた店長西川、実家では猫を10匹買っている猫好きの前田、三度の飯よりも掃除が好きな相川の3人で皆産をお待ちしております。お店がお休みの日に相川はコーヒー巡りをするのが趣味です。オススメのお店などがありましたら、ぜひご紹介ください。



———————————————
店名
パンケーキ専門店 PANKU

内装
パンケーキ食べたい!パンケーキ食べたい!と思っている皆さん、ぜひいらしてください。私たちパンケーキ専門店 PANKUでは今までに味わったことのないパンケーキメニューを多数ご用意してみなさんをお待ちしております。お店で利用しているパンケーキソースは店内で販売も行っておりますので、お家でも食べたい!という方はぜひご購入ください。

料理
1番のおすすめはドラゴンフルーツを使ったらドラゴンパンケーキです。見た目には華やかでインスタ映えすること間違いないです。パンケーキの生地には沖縄の塩を隠し味としてこっそり入れています。パンケーキは1枚から5枚までカスタムすることができますので、お腹が空いている方はぜひ5枚にチャレンジしてみてくださいね!

スタッフ
パンケーキ大好きな店長黒川が皆さんをお待ちしております!黒川はお店の営業終了後は立川駅前のバー、TACHIKAWADOWNでバーテンとしても働いております。パンケーキを食べた後にお酒を飲みにもいらしてくださいね!よろしくお願いします!!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.