Skip to content

justinblough/serverless-react-boilerplate

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

serverless-react-boilerplate

serverless license Join the chat at https://gitter.im/99xt/serverless-react-boilerplate

Requirements

  • Java Runtime Engine (JRE) version 6.x or newer to run dynamodb locally.

Features

  • Support serverless v1.0
  • Support offline development with dynamodb, lambda and API Gateway
  • Support local dynamodb seeds/migrations
  • Build automation in client and server to ease local development
  • Rich request template
  • Lambda CRUD operations for a Todo application with live reload
  • React web application to utilize the API

Demo

A todo app built with serverless. View Demo Site

How to develop and test offline?

We have used serverless-offline plugin and serverless-dynamodb-local plugin in this boilerplate. You can declare your table templates and seeds in offline/migrations folder just like the todo.json template. When you spin up the offline server, these tables will be used as the datasources for your lambda functions. Once you are ready to deploy your database and api in AWS use npm run deploy.

Production vs Offline

Thanks to the offline plugin's environment variable IS_OFFLINE we can select between local dynamodb and aws dynamodb.

var dynamodbOfflineOptions = {
        region: "localhost",
        endpoint: "http://localhost:8000"
    },
    isOffline = () => process.env.IS_OFFLINE;

var client = isOffline() ? new AWS.DynamoDB.DocumentClient(dynamodbOfflineOptions) :  new AWS.DynamoDB.DocumentClient();

###Directory structure

|──serverless
|  |──handlers
|  |  |──todo
|  |  |  |──lib
|  |  |  |  |──todo.js
|  |  |  |  |──helper.js
|  |  |  |──handler.js
|  |──database
|  |  |──dynamodb.js
|  |──offline
|  |  |──migrations
|  |  |  |  |──todo.json
|  |──test
|  |──event.json
|  |──templates.yml
|  |──serverless.yml
|  |──package.json
|──web
|  |──src
|  |  |──components
|  |  |──index.js
|  |──index.html
|  |──package.json
|  |──webpack.config.js
|──gulpfile.js
|──package.json


Installation & Usage

  • Clone this repo.
  • Make sure AWS credentials are setup properly. Otherwise refer this document
  • Install webpack and serverless globally.
 npm i -g webpack webpack-dev-server
 
 npm i -g [email protected]
  • Install project dependencies. cd serverless-react-boilerplate and type,
  npm install 
  • Install dynamodb local. (Make sure you have Java runtime 6.x or newer)
  npm run db-setup
  • Run the client and server
 npm run app
  • Visit http://localhost:8080

Deploying to AWS

When you are ready to deploy your database and api to AWS, run following command. This will deploy your local dabase and local API Gateway to AWS.

npm run deploy

Contribution

Your contributions are much appriciated.

Release Log

  • Release v2.2.0 - Added foundation css framework for the react client
  • Release v2.1.1 - Improvements in react web app
  • Release v2.0.1 - Dynamodb local table creation bug fix
  • Release v2.0.0 - Added support for serverless v1.0 and Issues #24 #25
  • Release v1.0.3 - Fixed local dynamobd get packaged for deployment
  • Release v1.0.2 - Added support for [email protected]

Links

License

MIT

About

A serverless react boilerplate for offline development

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 98.8%
  • HTML 1.2%