AMP pages for API base system

Question

We are trying to move our pages to Google AMP for better mobile and SEO experience. Problem is our system is API base totally. We are using nodejs along with react as of now.

Since in AMP you cannot use javascript to make ajax API calls, is there any way to implement to AMP through API's? Searched on the web but not able to find a optimal solution

Answer 1

You will need an intermediary http server which makes those API calls and generates static HTML which is served to clients.

Answer 2

As React and Angular both supports server side rendering. You can use ReactDOMServer.renderToStaticMarkup(element) to generate static html on server while using benefit of react component structure.

• You can use node server to make API call and pass that data to your React component which will generate AMP html later using renderToStaticMarkup.
• You can also use redux-connect, npm library which wait for API to resolve on server before rendering react component.