Copied to clipboard

Flag this post as spam?

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


  • nickornotto 397 posts 900 karma points
    Oct 16, 2020 @ 09:00
    nickornotto
    0

    Free Umbraco CMS with React.js?

    Is there any way of using Umbraco CMS with React.js front-end other than with Headless?

    I've seen tutorials on how to use React.js at the front-end but they seem to be already outdated and not sure whether those solutions will be viable in the future updates to Umbraco.

    If the direction Umbraco takes right now giving the solution of only the Heartcore as a base for SPA with its CMS then I am afraid it's the end of free Umbraco for small business/ enthousiasts websites. Heartcore is simply expensive.

    What do you think?

  • Nik 1593 posts 7151 karma points MVP 6x c-trib
    Oct 16, 2020 @ 09:35
    Nik
    0

    Hi Nick,

    Have a look at the HeadRest package for exposing end points for accessing content. I.e. turning the CMS headless.

    For heartcore projects, HeadRest is probably your only real option, or you can write your own api controllers to handle the requests.

    The Umbraco open source CMS has never been headless out of the box, so it's always been a case of installing a package or creating your own API end points to achieve it I believe.

    Thanks

    Nik

  • Casper 70 posts 308 karma points
    Oct 17, 2020 @ 15:22
    Casper
    0

    You don't need 3. party things, to make things headless. That said, you can' directly serialize IPublishedContent, so you will need to write your own conversion logic.

    Either create a class inheriting from RenderMvcController that replaces the default Umbraco controller, or create one for each route you wan't to hijack. See: https://our.umbraco.com/documentation/reference/routing/custom-controllers

    Ex:

    public class HeadlessController : RenderMvcController
    {
        public ActionResult Index(IPublishedContent model)
        {
            var serializableThing = ...convert your  model...";
    
            return new ContentResult
            {
                Content = JsonConvert.SerializeObject(serializableThing),
                ContentEncoding = Encoding.UTF8,
                ContentType = "application/json"
            };
        }
    }
    
  • Mahdi Shahbazi 4 posts 79 karma points
    Oct 17, 2021 @ 16:20
    Mahdi Shahbazi
    0

    You don't need headless to use reactjs in umbraco. It won't be SPA though. I am using umbraco and react.js for a while and the result is perfect. It is working with both 8 and 9 version

  • Biagio Paruolo 1593 posts 1824 karma points c-trib
    Oct 21, 2021 @ 08:08
    Biagio Paruolo
    0

    Example?

  • Anil Kumar 41 posts 202 karma points
    Jan 21, 2022 @ 16:52
    Anil Kumar
    0

    Hi Mahdi,

    Can you provide an example for setting up Front end using Umbraco backend. That would really help.

    Thanks, Anil Kumar

Please Sign in or register to post replies

Write your reply to:

Draft