7
votes

Until today I had a simple, mostly static Angular 9 app that would be served using CloudFront/S3 and a few Lambda functions. It worked well but did not have server-side rendering. Today I upgraded to Angular 10 and added angular universal per instructions https://angular.io/guide/universal. I found @ng-toolkit/universal and @ng-toolkit/serverless option but that doesn't work with Angular 10. https://medium.com/better-programming/getting-started-with-serverless-angular-universal-on-aws-lambda-8754bcc4dc19. This tells me Lambda is an option but not sure which piece (server.ts) code should be a lambda?

TLDR everything works fine after adding Universal on the localhost. Normally, for CI/CD of this project, I have an AWS Codepipeline tracking the master branch of the repo, once I merge code to master, it pulls and builds and copies the dist folder to S3 and S3 bucket works as an origin to CloudFront distro. After the S3 bucket dist folder is updated CodePipeline automatically invalidates my distribution and new changes are live on CloudFront.

Since I have added the Universal, I have to redesign the CI/CD and the question is whether deploy the SSR on EC2 vs Lambda.

When I run npm run build:ssr Angular runs ng build --prod && ng run proj:server:production and everything is ready to go. What exactly needs to be deployed as a Lambda if I am not going with an EC2 node/express server?

If I have to go with EC2 and Lambda is not an option, I am planning to follow these steps:

  1. Node/Express EC2 part of Auto Scaling Groups
  2. Create Target Groups for these servers and associate with Application Load Balancer.
  3. Use AWS CodeDeploy to update Angular app on these servers on a Blue / Green Deployment
  4. AfterInstall hook run, npm run build:ssr (probably pm2 or something to keep it alive) or some other command?
  5. Have Load Balancer redirect to port 443 traffic to 4000 on the node/express server
  6. Instead of the S3 bucket as the origin to CloudFront as it is today, add the ALB as the origin for the CloudFront. Do I need to keep the S3 bucket updated with the dist as well?

Any help to figure this Angular Universal deployment piece would be really helpful especially if I can do serverless SSR with Lambda that would be a lot less of an ongoing headache.

1
Hello, do you have any updates on this? I'm looking to implement the same thingDavide C
Hi, what did you end up doing here?Lee Gunn

1 Answers

0
votes

You can try to run your SSR on Lambda@Edge in Cloudfront, but check restrictions/limits and quotas for your use case before.

You have to wrap your express code in lambda-wrapper: https://www.npmjs.com/package/aws-serverless-express-edge