serverless-components / fullstack-app Goto Github PK
View Code? Open in Web Editor NEW⚡ Ready-to-use, serverless, full-stack application built with AWS Lambda, Express.js, React, AWS DynamoDB and AWS HTTP API.
Home Page: https://www.serverless.com
⚡ Ready-to-use, serverless, full-stack application built with AWS Lambda, Express.js, React, AWS DynamoDB and AWS HTTP API.
Home Page: https://www.serverless.com
Amplify's federated support is limited, here is a feature-request I wrote up.
aws-amplify/amplify-js#6300
I've been working though and implementing this in my own app. I would love to see it implemented in a boilerplate. The boilerplate should support Google, Facebook, Apple login.
BTW, so far I have not needed to make changes to Amplify in order to implement this.
The password should be salted before being sent to the api. With this current configuration it is propagating poor security practices. This is why to fix this and other authorization like issues service providers exist for this: Auth0, Authress, Google, Okta, etc...
Just installed the fullstack-app and followed the instructions to add the API url to my frontend's config.
But I am getting a CORS error out of the box.
Access to fetch at '{apiUrl}/users/register' from origin '{cloudfrontUrl}' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
I have not touched any of the boilerplate code yet at all. Just added the API url, and deployed
Hi there,
i tried to deploy express component with custom domain. It times out.
tail of the sls debug:
eploying...
Deploying Express App...
Packaging Express.js application...
Unzipping /tmp/f22um5/source.zip...
Files unzipped into /tmp/124af1u...
Installing Express + AWS Lambda handler...
Installing Serverless Framework SDK...
Zipping files...
Files zipped into /tmp/1zrzrh.zip...
Verifying the provided IAM Role with the name: permissions-dev in the inputs exists...
Creating or updating the meta IAM Role...
The provided IAM Role with the name: permissions-dev in the inputs exists.
Meta IAM Role created or updated with ARN arn:aws:iam::764972025726:role/api-bpfdjni-meta-role
No AWS Lambda function found. Creating one with the name: api-bpfdjni-function
Creating AWS Lambda...
Lambda created with ARN arn:aws:lambda:us-east-1:764972025726:function:api-bpfdjni-function
Verifying alias "default"...
Alias "default" not found. Creating...
Alias "default" created.
API not found. Creating API with name: api-api...
API api-api created with ID ezd9fywszb
Add permission to Lambda enabling API Gateway with this ARN to call it: arn:aws:execute-api:us-east-1:764972025726:ezd9fywszb//
Permission successfully added to AWS Lambda for API Gateway
Getting Route53 Hosted Zone ID for domain: co.nz
Domain hosted zone id for co.nz is Z050840636UWGRLMLF294
Checking if a certificate for the co.nz domain exists
anything i'm doing wrong?
Hi,
When the stack is deployed and there is an error that requires the stack to manually removed, where can I find the cloudformation
stack in AWS Console to remove it? Is it not using CloudFormation?
When testing the fullstack-app demo, I am having an issue logging into my account.
After I click "sign in" button, I am getting a "failed to fetch" error:
Origin https://www.serverless-fullstack-app.com is not allowed by Access-Control-Allow-Origin
This is a good framework to base your design on.
https://github.com/react-boilerplate/react-boilerplate
But it is React and not React Native, if you use Expo then you have to rework design for React Native. There are also some redundancies with the Amplify framework that you can leave out in a redo.
I ran:
serverless init fullstack-app
cd fullstack-app
Then edited .env
and entered my AWS key details. Then:
serverless login //This is required but not mentioned in the readme
serverless deploy
And the output is:
2s » Serverless » Error: 404 - The referenced component instance "dev.fullstack-app.permissions" does not exist
Could not deploy /api without setting a domain
Error: Failed to validate ACM certificate. Unsupported ACM certificate status FAILED
at findOrCreateCertificate (/var/task/utils.js:421:11)
at processTicksAndRejections (internal/process/task_queues.js:97:5)
at async createOrUpdateDomain (/var/task/utils.js:886:35)
at async Express.deploy (/var/task/serverless.js:53:7)
at async Runtime.module.exports [as handler] (/opt/nodejs/node_modules/@serverless/core/handler.js:273:24)
8s › fullstack-api › Failed to validate ACM certificate. Unsupported ACM certificate status FAILED
This is looking really good and its very fast to run. Thank you.
I followed the doc to make a .env file for each of my stages.
I'm also hoping to have a domain specific for the stage, like test.api.domain.com or api.test.domain.com but
this is causing certificate issues etc
A simple domain like mydomain.com works great, and I get a site at www.mydomain.com and an api at api.mydomain.com
Please can you provide more information / examples on customising the domain for different stages?
I would like to suggest using Expo instead of standard React. Expo supports generating web, IOS and Android apps off from a single source code now. That is an extremely useful feature.
I am using Expo currently in my own app without any significant issues. The biggest difference is that you have to use React Native everywhere, not plain React.
Don't worry about the run-time size. When you are ready for production - eject the app and get rid of it.
The template currently sets the API domain manually in config.js. Can this be done automatically with output variables?
Here's what I've tried so far:
In API's serverlesss.yaml:
app: myapp
org: foobar
component: express
name: api
inputs:
src: ./
In the site's serverless.yaml:
app: myapp
org: foobar
component: website
name: app
inputs:
src:
src: ./
hook: npm run build
dist: build
env:
REACT_APP_API_ROOT: ${output:api.apiGatewayUrl}
But running serverless deploy
in the app
folder gives this error:
Serverless › Failed running "src.hook": "npm run build" due to the following error: Command failed: npm run build
env: node: No such file or directory
I'm guessing this error is because it can't resolve the output:api.apiGatewayUrl
variable. Any ideas?
Any idea why I'm getting a "site: Access Denied" error during the deployment to our environment?
PS C:\Repositories\fullstack-app> serverless deploy
serverless ⚡framework
Action: "deploy" - Stage: "dev" - Org: "janasmuth" - App: "fullstack" - Name: "fullstack-app"
database:
name: database-dev
arn: arn:aws:dynamodb:ap-southeast-2:155608619720:table/database-dev
region: ap-southeast-2
indexes:
gsi1:
name: gsi1
arn: arn:aws:dynamodb:ap-southeast-2:155608619720:table/database-dev/index/gsi1
site: Access Denied
permissions:
name: permissions-dev
api:
url: https://mmvbkodzkf.execute-api.us-east-1.amazonaws.com
api:
openapi: 3.0.3
paths:
/users/register: (max depth reached)
/test/: (max depth reached)
/users/login: (max depth reached)
/user: (max depth reached)
info:
version: 0.0.1
21s » Serverless » Errors: "deploy" ran for 3 apps successfully. 1 failed.
PS C:\Repositories\fullstack-app>
PS C:\Repositories\fullstack-app> serverless deploy
serverless ⚡framework
Action: "deploy" - Stage: "dev" - Org: "abc" - App: "fullstack" - Name: "fullstack-app"
database:
name: database-dev
arn: arn:aws:dynamodb:ap-southeast-2:12345:table/database-dev
region: ap-southeast-2
indexes:
gsi1:
name: gsi1
arn: arn:aws:dynamodb:ap-southeast-2:12345:table/database-dev/index/gsi1
site: Access Denied
permissions:
name: permissions-dev
arn: arn:aws:iam::12345:role/permissions-dev
api:
url: https://abcd.execute-api.ap-southeast-2.amazonaws.com
api:
openapi: 3.0.3
paths:
/users/register: (max depth reached)
/test/: (max depth reached)
/users/login: (max depth reached)
/user: (max depth reached)
info:
version: 0.0.1
24s » Serverless » Errors: "deploy" ran for 3 apps successfully. 1 failed.
According to the documentation, all I need to do is write domain: example.com
in the serverless.yml to get the https://xxxxxx.cloudfront.net automatically route to my domain. So that's exactly what I did, I went to fullstack-app > site > serverless.yml and added the domain name where it was supposed to go like so:
component: website
name: site
inputs:
src:
src: ./
hook: npm run build
dist: build
domain: example.com
Simple I thought.
However, when I deploy the app nothing happens with the domain and the site is only accessible through the usual https://xxxxxx.cloudfront.net.
P.S.The domain I'm trying to use is in my Route 53 account and I have tested it before that all works fine with other services.
Hi all,
I successfully deployed this project to AWS. All was working almost fine.
But today I upgraded serverless component. And I couldn't ever deploy. Nothing is working.
So, now when trying to deploy from root with the provided command: serverless deploy --all --stage dev
Doing the same from site
or api
folder is having the same issues.
Could you please help us?
This is a more general question about working with Serverless Components, not necessarily specific to this repo. If there's a better place to post this, let me know.
The API component in this repo references output from the permissions and database components. How does that work?
See api/serverless.yml lines 9, 17, and 19:
component: express
app: fullstack
name: api
inputs:
# Express application source code.
src: ./
# Permissions required for the AWS Lambda function to interact with other resources
roleName: ${output:permissions.name} # <<--- _HOW_ does this work??
AFAICT, the only linkages between the API component and the permissions component are the app
values, and directory structure (api/
and permissions/
being siblings).
I'm trying to add a layer to a lambda using those conventions—sibling directories, same app
values—but I keep getting invalid reference ${output:commoncode.arnVersion}
. What am I missing? How do these output references work?
Used command serverless create --template-url https://github.com/serverless-components/fullstack-app
, added .env
file with keys and domain.
Running sls deploy --all
from the root folder gives an error
λ sls deploy --all --stage dev
serverless ⚡ framework
Error: Attempting to deploy multiple instances to multiple apps
at getTemplate (serverless\node_modules\@serverless\components\src\cli\commands\utils.js:333:15)
at processTicksAndRejections (internal/process/task_queues.js:97:5)
at module.exports (serverless\node_modules\@serverless\components\src\cli\commands\runAll.js:25:24)
at Object.module.exports (serverless\node_modules\@serverless\components\src\cli\index.js:118:7)
0s » Serverless » Attempting to deploy multiple instances to multiple apps
I would like to include uuid package that I am referring in API component. Is there a way to define layers? and if yes how do you do that in serverless yaml?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.