serverless-typescript-starter
serverless-typescript-starter copied to clipboard
postlight
Feat: react universal
This branch is an experiment with doing server-side rendering with react + mounting/hydrating on the front end. Right now it's only a proof of concept built for local development (for deployment, would need to decide where to host static js build files for front end, for example), but locally it works.
To try it, run:
yarn start
This runs serverless-webpack's local dev server along with a separate webpack-dev-server to serve the front-end build.
Then load localhost:8000/hello in your browser. You should see a Hello world page. Click on that and the text changes to Hello Adam (uhh I hope your name is also Adam). I just did that to verify that the app had mounted as expected on the front end.
Oh, and also:
If your request headers 'accept' common html request headers (e.g., text/html and one other b/c IE is weird), you will be served html. If not, you will be served JSON. So, for example, if you were to run:
curl http://localhost:8000/hello
You would instead get a response of:
{
"name":"World"
}
If instead you were to run:
curl -H "accept: text/html" http://localhost:8000/hello
You'd get the html:
<html>
<head></head>
<body>
<div id="app" data-reactroot="true">
<div class="App">
<b>Hello World</b>
</div>
</div>
<script type="text/javascript">window.APP_STATE = {"name":"World"}</script>
<script type="text/javascript" src="http://localhost:8080/assets/app.js"></script>
</body>
</html>
You get the idea.
yarn deploy now deploys the the lambda and api gateway code, then also builds and deploys the static assets to S3.
The API Gateway endpoint is configured to serve the s3 content from the AWS console. Hopefully will be able to incorporate this with serverless config. This is far from perfect, but it's working:
https://p9r1atzsrf.execute-api.us-east-1.amazonaws.com/dev/hello