what is the easiest way to access my collections data via API to populate in a react web app?

default discord avatar
olivier_vd
last month
14

what is the best way to access my content (collections) to populate my front end web app (React)? Is there some sort of Client to authenticate?

  • default discord avatar
    thisisnotchris
    last month

    Hey @olivier_vd great question



    Payload has an extensive doc on

    https://payloadcms.com/docs/authentication/overview


    Authentication



    In addition, there is an access control system to fine tune permissions



    A common approach is to generate an API-key for your user



    However, if you create a login form on your frontend and hit the login endpoint for your auth enabled collection...



    Then payload creates a secure cookie automatically on the client that authorizes your users requests



    These should satisfy most use cases



    Let me know if you have more questions

  • default discord avatar
    olivier_vd
    last month

    Thank you @thisisnotchris , the API-key looks promising! I'll give that a go ๐Ÿ™‚

  • discord user avatar
    Jarrod
    Payload Team
    last month

    @olivier_vd really depends on the type of content you want to access. Is it public? protected behind access control/auth?



    you can make fetch requests (rest/gql) to retrieve data, I would say that is probably the simplest. If you have content that you want to restrict based on users and their access to certain data, you can set up access control on collections.



    On the frontend you would have a login form (if you want to have private data). When a user logs in with rest/gql, a cookie will be attached to the request and if you make another request to any of the api endpoints you can use

    credentials: "include"

    on the request and it will send the user along with the request and payload will use that user to authenticate/validate access to certain data.



    James made a nice video on access control if you learn more from that kind of content ๐Ÿ™‚

    https://www.youtube.com/watch?v=DoPLyXG26Dg&t=292s
  • default discord avatar
    olivier_vd
    last month

    it's mainly to fetch the content that is created via the cms (to show on the front-end). Perhaps it's easier then to connect with mongoAtlas directly? This is my first full stack app, so I'm still learning as I go ๐Ÿ™‚

  • discord user avatar
    Jarrod
    Payload Team
    last month

    Sure thing! I think that video I linked above would still be super valuable to watch. I do think learning how to use the browsers native

    fetch

    api will also be valuable! ๐Ÿ™‚

Open the post
Continue the discussion in Discord
Like what we're doing?
Star us on GitHub!

Star

Connect with the Payload Community on Discord

Discord

online

Can't find what you're looking for?

Get help straight from the Payload team with an Enterprise License.