ampreact
⚡⚛ AMP HTML, Next.js, React, styled-components, GraphQL, and TypeScript — The most trendy website boilerplate possible.
About
The core of ampreact
is built on Next.js, used for all the routing and
serving of pages. For styling, styled-components makes it easy—with
just a small modification to the rendering of the <style />
tags generated,
it works nicely with AMP HTML. Finally, react-amphtml
is used for rendering all of the AMP HTML built-ins, extensions, and
the <script />
tags needed to use them.
The pages generated should all by properly validated by AMP HTML 💯
Usage
All the usage and benefits of Next.js are available to ampreact
.
-
Installation:
npm install
-
Development:
npm run dev
-
Production:
npm run build npm run start
Example & Validation
An example of ampreact
can be seen here: https://ampreact.dfrankland.now.sh/
For proof of validation, either:
-
Append
#development=1
to the URL and check the console for errors -
Paste the page HTML into https://validator.ampproject.org/#url=https%3A%2F%2Fampreact.dfrankland.now.sh%2F
Deployment
Because ampreact
is built on top of Next.js it is simple to deploy to
Now or any other cloud infrastructure providers.