Make the Integrate section inte-great

[pjhul]

Apologies for the horrible joke in the title 😅

Here's a bit of a brain dump from the time I spent looking through the 'Integrate PostHog' section recently. Nailing this is going to be my last big goal before the new-year, so wanted to put together an overview of some of the steps I'm taking.

Overall, my biggest goal is to reframe this entire section to be more feature-centric rather than being library/platform centric. I think this will have a number of benefits:

1. Better maintainability: Nearly every library page has their own section on each feature, which creates a challenge when updates need to be made to every page.
2. Less variance in quality: A result of all this duplication is that some libraries provide great detail on certain features, while other simple show a single code snippet.
3. Better activation for more 'advanced' features: As we all know, the value a team gets from PostHog grows greatly when they start using more products. Creating digestable guides for each feature where users can easily select their desired library/platform I think will make discovery of things like Feature Flags and Experiments far better.

Objectives

• [ ] Refresh the landing page to make it more visual (#5027)
• [ ] Reframe the entire section from library focused to feature focused
  • Create feature-specific pages with snippets from each library
  • Create 'Getting started' guides for each major feature within PostHog (Event capture, Feature Flags, etc.)
  • Allow the user to select which library they are using at the start of the guide
  • I especially like how Stripe have done this with their interactive getting started guides. This is obviously way more built-out that what I would be trying to do, but a great benchmark to eventually work towards.
• [ ] Reframe the 'Third-party' section as 'Framework guides' (I especially like TailwindCSS's version of this)
  • A lot of these pages are simply out of date and need a refresh
• [ ] Create better guidance on setting up a proxy, and make it a more apparent throughout the section
• [ ] Refresh 'Identifying users' and 'User properties'
  • These pages are both really foundational, but can often lead to confusion
• [ ] Create a dashboard to track some metrics related to this section
• [ ] Move 'Webhooks' out of this section

Existing issues / PRs

• [ ] #4902
• [ ] https://github.com/PostHog/posthog-js/issues/492
• [ ] https://github.com/PostHog/posthog.com/issues/4802
• [ ] https://github.com/PostHog/posthog.com/issues/4769
• [ ] https://github.com/PostHog/posthog.com/issues/4407
• [ ] https://github.com/PostHog/posthog.com/issues/4150
• [ ] https://github.com/PostHog/posthog.com/issues/3666
• [ ] https://github.com/PostHog/posthog-js/pull/496

Notes

I'm also in the process of setting up some user feedback sessions with a couple of my friends to get more hands-on data regarding where users get stuck.

cc: @jamesefhawkins @lharries @kappa90 @corywatilo

[lharries]

Strongly agree with this! Lots of very impactful stuff.

Likely worth getting input from @raquelmsmith and @kappa90 for the getting started sections as they've spent a lot of time thinking about onboarding. And a key part of onboarding is the docs and getting everything setup properly.

I wonder if this landing page is less important as most people arrive via google search/command line search/clicking links in the subheader?

The getting started section should have an extra page about everything you need to get all the analytics setup. Potentially with a code snippet that both turns on session recording and has an example feature flags?

---

Side point - @corywatilo and I have been exploring the idea of in-app sidebar docs (similar to google sheets). Worth keeping in the back of your mind when doing docs stuff :)

[raquelmsmith]

I can definitely see how this page needs a reboot, and your ideas sound solid 💪 One thing to keep in mind is that the current page leave someone with no question about where to go to find code snippets for their specific library. I've had issues in the past in some docs where I go to the page and the button to select my library isn't super obvious and I either get really frustrated until I find it, or leave. In the stripe docs, the button to select library goes away as soon as you scroll. So all that to say, make sure it is very, very obvious where to select your library so you see the appropriate snippets.

@kappa90 was thinking about integrating the docs into our onboarding flow. I actually really like the idea of the docs being feature-centric with an option to select your library - this will make it easier to show a single doc instead of having to ask "what is your library" and then showing the correct doc in every onboarding flow (or storing the info in the db which I'd rather not do).