Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

  • Sune Radich Vestergaard 1 post 71 karma points
    Apr 05, 2019 @ 08:57
    Sune Radich Vestergaard

    Using Umbraco Headless with React?

    First of all, bear with me. I am a frontend developer with very little techinical Umbraco knowledge. I've worked on frontends on 'regular' umbraco solutions, but have never myself configured or setup an umbraco site before.

    Basically what I want to understand is this: How can I use Umbraco Headless with a ReactJS application?

    I've found this page in the documentaion it contains several ways to use Umbraco Headless with .Net, but only very little about Node.js/React. Also, the npm package mentioned seems outdated and incomplete, as it contains very little, and the code within have alot of //not implemented comments. On top of that, it contains no README, and was last updated a year ago.

    I have access to a Umbraco Headless instance, and if I request from /umbraco/rest/v1/content/published/ i will get quite a lot of data. Are there any documentation about what the data means, and how you are supposed to use it?

    Are there any best-practice to how you consume the data? How you manage the various components? How you map your react component with the right data from Umbraco?

    Or is the best practice to go with .Net and use Umbraco Headless that way?

  • saurabh 1 post 71 karma points
    Jun 14, 2019 @ 22:34

    Hi Sune , I have similar requirement to use React.js as a frontend app for Umbraco ,please let me know if you got any answer else where.Thanks.

  • John Bergman 440 posts 1024 karma points
    Jun 17, 2019 @ 07:10
    John Bergman

    Are you needing a web api, or do you want to pull content (html) over into the react application?

  • Louis Jackson-Rees 107 posts 340 karma points c-trib
    Jun 17, 2019 @ 08:53
    Louis Jackson-Rees

    Umbraco Headless is still not fully released, hence why there is a lack of docs and updates to the NPM package.

    It also looks as though the Git repo for that NPM package no longer exists, so it might be worth waiting for Headless to fully launch later this year. Where i imagine there will be a new set of docs and node packages.

    You could also set up a traditional umbraco site and manually build the API controllers yourself however, this would need you to have a knowledge of c#.

    There is an existing Angular service which the umbraco backoffice uses to fetch content, maybe you could reverse engineer / wrapper this to achieve what you need.

  • Louis Jackson-Rees 107 posts 340 karma points c-trib
    Jun 17, 2019 @ 09:02
    Louis Jackson-Rees

    You may also want to look at this package from Matt Brailsford:

    He also summarises the differences between his package and umbraco headless.

    You may also be interested in the GraphQL package:

  • Tom 711 posts 948 karma points
    Aug 06, 2019 @ 03:48

    Sorry for such a basic question but how does one actually run up headrest/incorporate it in to a project

  • Qaisar 28 posts 74 karma points
    Sep 17, 2019 @ 08:27

    First make sure you have .net framework 3.5 installed.

    You need to run the build.cmd file through VS Developer command prompt. it will create a nuget package file in artifacts folder. Then you need to install that package through nuget in your umbraco project.

    Hope this helps.

  • Qaisar 28 posts 74 karma points
    Sep 17, 2019 @ 08:35

    After installing headrest nuget package on an umbraco v8 project and running the project for basic setup. I am getting errors like

    message "Exception has been thrown by the target of an invocation."

    I have already created another post with the detailed setup here: Umbraco headrest/headless V8

    Perhaps someone has experienced that before or someone has managed to make it work? Any thoughts about how to solve this guys?

Please Sign in or register to post replies

Write your reply to: