Webiny-js: Headless CMS React Guide

[EmilK15]

For users that want to integrate with out headless CMS API, we should create a Guide for them to use for React.

This is:

• Feature request

[Pavel910]

@SvenAlHamad what exactly is this issue about? @Fsalker will be doint nextjs I guess, so what should @EmilK15 do here?

[SvenAlHamad]

Plain React, something like this:
https://strapi.io/blog/build-a-blog-with-react-strapi-and-apollo

[EmilK15]

I believe my plan so far is to create a E-Library system example.
Basically just a way to create a Group called Library, add a Content Model named Book with the following fields:
IBSN, title, img, description.
And then have the React application pull that from the GraphQL interface

[EmilK15]

Put some simple styling for a Library of fantasy novels:

I think the file not found is due to how I setup my server. I'll be doing this again with a fresh project, but wanted to complete the skeleton of this library application first

[doitadrian]

I like the theme, "fantasy novels" too, great job!

The only thing that's a bit awkward for me are the colors. I really somehow have a feeling that I'm looking at a web page that was created in 2005. :)

Maybe we could play with the colors a bit, what do you think?

BTW I really like this site: https://coolors.co/generate

It basically creates a set of colors that play well together. Maybe you'll find something there to your liking as well.

[EmilK15]

Yea I put a color palette so it wouldn't look super awkward to start. I've used coolers before too.
Usually I integrate scss into the application so the primary/secondary/tertiary are completely up to the user, but I didn't want to add another layer of complexity to the project. It should just be, if you are using React, this is how easy it is to integrate with our Headless CMS.
I'll take a look into changing the layout as well. At the very least the content of the Guide is there, now it's just visual tweaks so it looks a bit better :)

[EmilK15]

See this PR: with the corresponding tutorial: https://github.com/webiny/docs.webiny.com/pull/117