Adobe Launch for ReactJS | Community
Skip to main content
jorisdebeer
jorisdebeer
Level 4
August 19, 2021
Solved

Adobe Launch for ReactJS

  • August 19, 2021
  • 2 replies
  • 3027 views

Does Adobe provide a NPM package for adding Adobe Launch to a ReactJS web application?

 

Where can I find it?

 

If not, is there any clear documentation and guide for adding Adobe Launch and tracking pages and clicks for a ReactJS web application?

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
    Best answer by Alexis_Cazes_

    For React application add the Adobe Launch script in the head of your html file, index.html I guess.

    Adobe Launch will then load and you can use it in the same way as you would do with default implementation.

     

    Some restriction are that page bottom is not really useful anymore unless it is something for first load of page and you are not even sure that it will be fired after the React content is available. Page top is only useful on first run. 

     

    You should implement a data layer on the page and it needs to contain an array on which you can evaluate if new event was pushed.

    React also uses routes that do not reload the page so you need to figure out a way to know route changed, so you can use the data layer approach or one of this one that is listed in this answer: Re: Blazor Server - Adobe Experience League Community - 428045 . I know it is about Blazor Server the thread but my answer is based on experience that I have with React Apps.

     

    Hope this helps.

     

    2 replies

    yuhuisg
    Community Advisor
    yuhuisgCommunity Advisor
    Community Advisor
    August 20, 2021

    There are no special steps for any website framework. The implementation is almost always the same:

    1. Define a data layer, preferably an event-driven one a la GTM's dataLayer.
    2. Add the Launch <script> snippet in <head> in all pages. In your case, putting it in the index.js file should be sufficient.

    If you're asking about best practices, though, then that's another topic, and depends entirely on how your website has been built. Launch's Core extension has some built in even triggers, e.g. history change, click, form submit, etc., so those might help you get going.

      Alexis_Cazes_
      Alexis_Cazes_Accepted solution
      Level 10
      October 28, 2021

      For React application add the Adobe Launch script in the head of your html file, index.html I guess.

      Adobe Launch will then load and you can use it in the same way as you would do with default implementation.

       

      Some restriction are that page bottom is not really useful anymore unless it is something for first load of page and you are not even sure that it will be fired after the React content is available. Page top is only useful on first run. 

       

      You should implement a data layer on the page and it needs to contain an array on which you can evaluate if new event was pushed.

      React also uses routes that do not reload the page so you need to figure out a way to know route changed, so you can use the data layer approach or one of this one that is listed in this answer: Re: Blazor Server - Adobe Experience League Community - 428045 . I know it is about Blazor Server the thread but my answer is based on experience that I have with React Apps.

       

      Hope this helps.

       

        Terms & ConditionsAccessibility statement

        Loading footer...