In this article we will look at how we can enable server side rendering on a Angular application and make it run serverless on 'AWS Lambda@Edge'.
...
For further actions, you may consider blocking this person and/or reporting abuse
I registered a dev account just to applause this article.
Rarely do I see a guide that is filled with useful information and flawless to follow.
Way to go, buddy!
Thanks for your article,
everything works good but the root route (/) is not rendered ssr, it s just render the file index.html. I check for your app I found the same thing.
dev-to-uploads.s3.amazonaws.com/up...
Thanks.
If you search for something, or directly access the animal route such as 'd2htk1pm9r9gbg.cloudfront.net/anim...' you will see that it is server side rendered.
Love this post, and nice work on getting this all working with Lambda@Edge. Only issue is I'm also seeing this same problem as the above person in my app with SSR on the root route. Any idea how to get SSR working for the root route? I'd rather not have to redirect to another page like you're doing.
SSR is working on all routes except for the root route. When running on localhost using the default server.ts file it works fine...
I solved the problem,It was with the Default root object CloudFront, it should be empty, the default value was index.html that's why I receive just the content of this file in SSR. also I check for the empty route on my lambda function. you can find more details here : stackoverflow.com/questions/704282...
Great article!
I am able to execute the deployment in AWS for the serverless-distribution.yml, but not able to set it up correctly. Two things I noticed: S3 didn't upload any dist files and CloudFront didn't have an Origin. What could be wrong?
For the serverless-distribution.yml, what are the other lines that I need to change for the AWS config? A sample file would really help. Thanks a lot!
Where the angular app hosted?
The application is deployed using the serverless framework. In the 'Deploying to AWS' section of the blog. We deploy the serverless-distribution.yml stack. That creates a cloudfront distribution and an S3 bucket that will host and serve the application.
Oh so it's hosted on S3 bucket.. gotcha.
I am new to all this but using this article do I still get to setup the AWS Lambda, Cognito, DynamoDB, ElasticCache, and API Gateway in the AWS console with my anuglar 13 app and then do the the deploy with AWS CLI?
I want to control everything though the AWS Console but new to the serverless framework (just learning today) but my Angular app does need SSR for SEO and so far to be truly servverless AWS doesn't seem to have a way to do that.
I want this approach but a way to do SSR in angular:
docs.aws.amazon.com/whitepapers/la...
Thanks for the great article,
everything works good but for some reason only the root route (/) is not rendered, do you have any clue?
Thanks.
Hello Alex,
What is not working exactly? I just went here: d2htk1pm9r9gbg.cloudfront.net/ and you will be redirected to d2htk1pm9r9gbg.cloudfront.net/search