Code Monkey home page Code Monkey logo

booking's Introduction

Contentful Gatsby Booking App

Netlify Status

Create a Gatsby booking app powered by AWS Amplify.

The index page of the booking app

Static sites are scalable, secure and have very little required maintenance. They come with a drawback though. Not everybody feels good editing files, building a project and uploading it somewhere. This is where Contentful comes into play.

With Contentful and Gatsby you can connect your favorite static site generator with an API that provides an easy to use interface for people writing content and automate the publishing using services like Travis CI or Netlify or AWS Amplify .

Demo Page

name password
demo Password1?

Features

  • booking management
  • inquiry management
  • corporate site management

Component

PlatForm

FlameWork

Access Control

Storage

Master Data

Transaction Data

Other

Api

BackEnd

Calender App

  • Google Calender

Error Tracking

Getting started

type required
Contents Settings true
FrontEnd Settings true
BackEnd Settings optional
  • demo user
name password
demo Password1?

Contents Settings

Contentful Account Create & Create Personal Access Tokens

See export / import with Contentful.

Locale Settings

Change the default locale to Japanese

See Change the default locale to Japanese.

See Localization with Contentful.

Create configuration file

See export / import with Contentful.

Contentful import

$ cd contentful-data
$ npx contentful-cli login --management-token xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
$ npx contentful-cli space import --config example-config.json

See export / import with Contentful.

See Importing and exporting content with the Contentful CLI.

FrontEnd Settings

Install the dependencies

$ yarn install

configuration file setup

$ yarn setup
$ yarn setup
yarn run v1.22.4
$ node ./bin/setup.js
? Your Contentful Space ID XXXXXXXXXXXXXXXX
? Your Contentful Content Delivery API access token XXXXXXXXXXXXXXXXXXXXXXXXXXX
Writing config file...
Config file /path/to/directory/booking/.env.development written
Config file /path/to/directory/booking/.env.production written
All set! You can now run yarn develop to see it in action.
✨  Done in 9.03s.

Start the app in development mode

$ yarn develop

Run the project locally with live reload in development mode.

BackEnd Settings (* optional)

  • AWS account required

init settings

Amplify init settings.

See AWS Amplify CLIの使い方〜インストールから初期セットアップまで〜.

create required parameter

Create the ssm parameters used in CloudFormation.

Launch Stack

  • parameter list
name type description
/${environments(ex: dev)}/contentful/spaceId String Contentful Space ID
/${environments(ex: dev)}/contentful/token SecureString Contentful Content Delivery API - access token
/${environments(ex: dev)}/googleapis/calendar/credentials SecureString Google Calender Credentials
/${environments(ex: dev)}/googleapis/calendar/token SecureString Google Calender API token
/${environments(ex: dev)}/salon/mail/footer String mail footer
/${environments(ex: dev)}/salon/name String salon name
/${environments(ex: dev)}/sentry/dsn String Sentry DSN
/${environments(ex: dev)}/system/email String salon owner's email address

These ssm parameters are used by AWS Lambda.

Change the parameter to secure if necessary.

create resource

$ amplify push

destory 💥

$ amplify delete

Deploy to Netlify

References

  • Gatsby

Webサイト高速化のための 静的サイトジェネレーター活用入門

https://github.com/ebisucom/gatsbyjs-book

booking's People

Contributors

thirosue avatar renovate-bot avatar takeshi-hirosue avatar

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.