Hey HN! It’s Eric, Caleb, Nick, and Garrett from SideGuide (
https://www.sideguide.dev/). We give developers and technical PMs an easy way to learn and evaluate API/SDK products using live code environments. Our product is a lightweight, embeddable, online code environment that lets you play with APIs and SDKs in one click.
Companies use us to let developers experiment with fully-configured examples with zero setup. If you saw Hyperbeam’s interactive example on Show HN a few days ago (https://news.ycombinator.com/item?id=32598062), that was built using SideGuide.
We originally started as a B2C coding education platform after graduating college. Knowing how to use APIs has become a critical part of solving meaningful coding problems, but we watched hundreds of devs struggle to learn from API documentation. API and SDK documentation is often lacking in depth and interactive examples, leading to an incomplete understanding both of the implementation process (how to get an API or SDK working) and of the value (what you can actually do with it). We repeatedly saw students floundering with this, then wasting hours re-inventing the wheel instead of using an off-the-shelf solution.
Eventually we realized that the pain of getting an API or SDK running wasn’t just limited to students, but is something that developers have to deal with all the time—especially when deciding whether or not to use a particular product. When you just want to quickly test an API, you shouldn’t have to futz around with installations, dependencies, and whatnot. Developers and technical PMs should be able to quickly play with the real code before investing time and money in a product. That is why we built SideGuide.
SideGuide allows API/SDK companies to create instant live coding environments that help their prospective users (developers) understand the implementation process and product value through real guided examples.
A company can create a live code environment/sandbox from a GitHub repo of any product example or lab. These online code sandboxes allow developers to quickly play around and learn with no setup or friction and after they are done they export the repo for use in their own projects.
These sandboxes can have optional guides that walk potential users through different parts of the implemented code. The steps in the guides can be attached to any file or code block in the project, so nuance in the code or structure can easily be explained.
In addition, we provide observability and a feedback mechanism for the sandboxes. This is so examples and guides can constantly be improved and support can be delivered when it’s needed.
Getting this right is a challenge because it’s only valuable if you create an experience that developers love. That means spinning up environments quickly, tight integration with API documentation/authentication, and flexible workflows for all of the different types of developers.
Our solution is different from other online coding environments in two main ways. First, we are focused on APIs/SDKs. We are building features to allow developers to quickly play, test, and learn about products instead of providing a fully featured IDE like most other solutions. Second, we give API companies a white-label solution, so they do not have to send clients to another platform to play with their product. This is what Hyperbeam did with their Show HN mentioned above (https://news.ycombinator.com/item?id=32598062). As that example shows, it allows for a more seamless solution all around.
Since we want devs to be able to experiment with examples with no initial setup, we decided to build our own web-based editor with Next.js, Monaco, and Sandpack. We built the UI with Next.js, which provides us fast load times with hybrid static and server-side rendering. We use Monaco for the code editor portion, which allows us to integrate VScode-like features such as language servers. With Sandpack we can take advantage of hot module reloading and npm dependency support.
Currently we only offer web based examples, but runtimes like Python and Node are coming soon. Right now, we host the application ourselves and provide a widget which companies can embed on their docs/website/anywhere. In the future, companies will be able to access a complete white label version of our web app that they can host and integrate seamlessly into their existing developer experience. As for pricing, we are charging a flat rate per month for web environments but once we implement runtimes, we will switch to usage-based pricing.
If you want to learn more about SideGuide please check us out at https://www.sideguide.dev/. We'd love to hear any thoughts and feedback you have!
Our Podcast API product [2] uses RunKit to provide "run node.js code right on our API docs web page". RunKit has been acquired by Stripe. It's unlikely that they'll support more languages.
It would be great to let our api users try out all api endpoints using all different languages right on our web page.
[1] https://www.runkit.com
[2] https://www.listennotes.com/api/docs/