Skip to content

add example for full stack application (front end and backend) #420

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jul 16, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,7 @@ serverless install -u https://github.com/serverless/examples/tree/master/folder-
| [Aws Auth0 Api Gateway](https://github.com/serverless/examples/tree/master/aws-node-auth0-custom-authorizers-api) <br/> Demonstration of protecting API gateway endpoints with auth0 | nodeJS |
| [Aws Node Dynamic Image Resizer](https://github.com/serverless/examples/tree/master/aws-node-dynamic-image-resizer) | nodeJS |
| [Aws Node Dynamodb Backup](https://github.com/serverless/examples/tree/master/aws-node-dynamodb-backup) <br/> Serverless DynamoDB changes backed up to S3 | nodeJS |
| [Aws Node Fullstack](https://github.com/serverless/examples/tree/master/aws-node-fullstack) <br/> Demonstration using a front end deployed with serverless-finch and a backend. | nodeJS |
| [Aws Env Variables Encrypted In A File](https://github.com/serverless/examples/tree/master/aws-node-env-variables-encrypted-in-a-file) <br/> Serverless example managing secrets in an encrypted file | nodeJS |
| [Aws Env Variables](https://github.com/serverless/examples/tree/master/aws-node-env-variables) <br/> This example demonstrates how to use environment variables for AWS Lambdas. | nodeJS |
| [Aws Fetch File And Store In S3](https://github.com/serverless/examples/tree/master/aws-node-fetch-file-and-store-in-s3) <br/> Fetch an image from remote source (URL) and then upload the image to a S3 bucket. | nodeJS |
Expand Down
103 changes: 103 additions & 0 deletions aws-node-fullstack/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
# Example – Serverless Email Sign-Up Form

This demo application helps you test Serverless Framework Enterprise's main features:

* **Insights** - Monitoring, metrics and alerts for your functions.
* **Safeguards** - Best practice policies that run before you perform a deployment.
* **Secrets** - Store sensitive credentials in the Serverless Enterprise Dashboard and reference them in your Serverless Framework Project.

![Serverless Framework Enterprise Email Sign-Up Form Example](https://s3.amazonaws.com/assets.sales.serverless/github/enterprise-examples/email_form_preview.gif)

## Installation

#### Clone this repository

```shell
$ git clone https://github.com/serverless/enterprise.git
```

#### Install Front-End & Back-End Dependencies

Navigate into this example project and install dependencies on the frontend and backend.

```shell
# location - enterprise/examples/email-signup-form/frontend
$ npm i
```

```shell
# location - enterprise/examples/email-signup-form/backend
$ npm i
```

#### Create a Tenant and Application in Serverless Framework Enterprise

The Serverless Enterprise Plugin adds a `login` command to the Serverless Framework, use it like this to log you in:

```shell
# location - enterprise/backend
$ serverless login
```

Make sure to follow the prompts and create your Tenant (it's like a Github Org) and Application.

#### Add the Tenant and Application to this project's `serverless.yml`

![App and Tenant](https://s3.amazonaws.com/assets.sales.serverless/github/enterprise-examples/email_form_appandtenant.png)

#### Deploy the back-end

```shell
# location - enterprise/backend
$ serverless deploy
```

#### Run the front-end

```shell
# location - enterprise/backend
$ npm run start
```

#### Add the back-end URL in the front-end

The front-end form is not directed at the API endpoint out of the box. You must copy the POST URL that is returned on `serverless deploy` of the `backend` into the front-end.

The URL should resemble this.

```
https://bpcn36m16a.execute-api.us-east-1.amazonaws.com/dev/submit
```

In the front-end, click "Demo Utilities" and paste this URL into the `FORM API` field. The form should now work, as well as the testing features in the Utilites panel.


## Testing Serverless Insights

The user interface of this example application has a few utilities you can use to test out Serverless Framework Enterprise.

Click on "Demo Utilities" in the top right. A side panel will expand which you can use to invoke the example application's Function several times, to fill Serverless Framework Enterprise with invocation data.

You can also use the panel to generate a random Function code error that will appear in Serverless Framework Enterprise.

Read more about [Insights here](https://github.com/serverless/enterprise/blob/master/docs/insights.md).

## Testing Serverless Secrets

The goal of our Secrets feature is to support storing and using any generic secret as a [Serverless Variable](https://serverless.com/framework/docs/providers/aws/guide/variables/). This will be supported in upcoming weeks.

What Secrets supports now is creating a specific type of secret: AWS Access Keys.

You can use Secrets to reference temporary AWS Access Keys that last for 1 hour, used for the purpose of deploying your Serverless Framework project to the underlying AWS account.

Since these are temporary credentials, they mitigate the risk of developers leaving long-term credentials anywhere (e.g. Github) and are perfect for CI/CD.

Read more about [Secrets here](https://github.com/serverless/enterprise/blob/master/docs/secrets.md).

## Testing Serverless Safeguards

The goal of our Safeguards feature is to be alike a linter for serverless architectures. Safeguards are best practices and organizational policies that are enforced upon deployment. When a deployment happens, Framework Enterprise scans your `serverless.yml` and CloudFormation file before deployment and looks for issues.

Safeguards are immediately applied, out-of-the-box, when you add the Serverless Enterprise Plugin.

Read more about [Safeguards here](https://github.com/serverless/enterprise/blob/master/docs/safeguards.md).
6 changes: 6 additions & 0 deletions aws-node-fullstack/backend/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
# package directories
node_modules
jspm_packages

# Serverless directories
.serverless
22 changes: 22 additions & 0 deletions aws-node-fullstack/backend/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
/**
* Form Submit
*/

const submit = (event, context, callback) => {

if (event['queryStringParameters'] && event['queryStringParameters']['error']) {
let r = Math.random().toString(36).substring(7);
throw new Error(`Random error ${r}`)
}

callback(null, {
statusCode: 200,
headers: {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Credentials': true,
},
body: JSON.stringify({ message: 'form submission received' }),
})
}

module.exports = { submit }
Loading