4 ms·

I'm working https://annotate.dev https://annotate.dev, a tool inspired by the Stripe documentation, to let anyone create step by step code walkthroughs. Here's

I'm working https://annotate.dev https://annotate.dev, a tool inspired by the Stripe documentation, to let anyone create step by step code walkthroughs. Here's a sample of a walkthrough you can create: https://annotate.dev/p/hello-world/learn-oauth-2-0-by-building-your-own-oauth-client-U2HaZNtvQojn4F https://annotate.dev/p/hello-world/learn-oauth-2-0-by-buildi... Would love to hear any feedback thoughts!

sentientslug 3y ago
This is a really clever idea, and worked great on mobile as well. Is there a way to choose to display the code window underneath the documentation instead of on top?
- tip_of_the_hat 3y ago
  Thanks for the kind words! Not currently, can you elaborate why you'd want to the code window at the bottom?
  - Ginotuch 3y ago
    I think I'd also like an option for the code window to be at the bottom. Generally when I'm reading blogs/articles on my phone I put the line of text I'm reading at the top of my screen. The code being up the top felt like it was in the way of where I was naturally expecting the line I wanted to read was. Also, I think this is great! Definitely something I'd want for my documentation.
    - tip_of_the_hat 3y ago
      This is great feedback, not something I initially considered. I've add it to my todo list
ch1234 3y ago
This is awesome!! I can see a major use case for enterprise or government but along with that would come the desire for on-prem. Any chances of that happening?
- tip_of_the_hat 3y ago
  Thanks for checking it out! I'd be happy to build and support an on-prem solution, but I'd a need commitment from an enterprise/government org. If that's something you're interested in, shoot me an email at alex@annotate.dev!
mclightning 3y ago
can this be self-hosted?
- tip_of_the_hat 3y ago
  Not yet, what use case do you have in mind for self hosting?
  - mclightning 3y ago
    I am sure folks at /r/selfhosted would love it.
orblivion 2y ago
This seems like a cool idea but I'd have to see it in action for something I need to learn. The first thing that jumps to mind is that I want to click on a piece of code and see the explanation for it. It seems that it only goes in the other direction. I could imagine looking at the code and understanding most of it and just wanting to understand part of it. I could anticipate an issue though - it could be many-to-one from explanation to code. The UI for that would be complicated.
roijaboc 2y ago
This is a great app, especially in this age of AI code generation, I am already using it. Looking forward for features such as light mode and exportability among other things.
Kkoala 3y ago
That's a cool idea!
entropie 3y ago
This is really cool. I wish there was something like that when I learned to code.
williamdclt 3y ago
If you’ve not seen it, there’s a vscode extension called CodeTour that does something similar, could be good inspiration (or maybe you already do better!)
- tip_of_the_hat 3y ago
  It's the first time I've heard of CodeTour, I'm really impressed from what I've seen thus far. Digging a bit deeper now, thanks for sharing!
trenchgun 3y ago
This is great idea! I actually have several potential improvement ideas. 1. Put the walkthrough it in a graph, or a minimap to see the whole picture easily? Or in a https://c4model.com/ https://c4model.com/ visualization 2. Why not make clickable code references visually stand out? 3. Make a VScode extension for it
- tip_of_the_hat 3y ago
  Thanks for taking a look and sharing feedback! I'm not familiar with the c4 model, I'll need to investigate. > Why not make clickable code references visually stand out Is the goal here that you want to know that a specific text block annotates a part of the code? > Make a VScode extension for it I think I will! I need to noodle a bit on the user experience here
rafbgarcia 3y ago
Great idea! What did you use for designing the UI?
- tip_of_the_hat 3y ago
  Thank you for checking it out! I use Figma to get a proof of concept of how I want things laid out. From there it's more tinkering at the code level.

sentientslug 3y ago

This is a really clever idea, and worked great on mobile as well. Is there a way to choose to display the code window underneath the documentation instead of on top?

tip_of_the_hat 3y ago
Thanks for the kind words! Not currently, can you elaborate why you'd want to the code window at the bottom?
- Ginotuch 3y ago
  I think I'd also like an option for the code window to be at the bottom. Generally when I'm reading blogs/articles on my phone I put the line of text I'm reading at the top of my screen. The code being up the top felt like it was in the way of where I was naturally expecting the line I wanted to read was. Also, I think this is great! Definitely something I'd want for my documentation.
  - tip_of_the_hat 3y ago
    This is great feedback, not something I initially considered. I've add it to my todo list

ch1234 3y ago

This is awesome!! I can see a major use case for enterprise or government but along with that would come the desire for on-prem. Any chances of that happening?

tip_of_the_hat 3y ago
Thanks for checking it out! I'd be happy to build and support an on-prem solution, but I'd a need commitment from an enterprise/government org. If that's something you're interested in, shoot me an email at alex@annotate.dev!

mclightning 3y ago

can this be self-hosted?

tip_of_the_hat 3y ago
Not yet, what use case do you have in mind for self hosting?
- mclightning 3y ago
  I am sure folks at /r/selfhosted would love it.

orblivion 2y ago

This seems like a cool idea but I'd have to see it in action for something I need to learn. The first thing that jumps to mind is that I want to click on a piece of code and see the explanation for it. It seems that it only goes in the other direction. I could imagine looking at the code and understanding most of it and just wanting to understand part of it. I could anticipate an issue though - it could be many-to-one from explanation to code. The UI for that would be complicated.

roijaboc 2y ago

This is a great app, especially in this age of AI code generation, I am already using it. Looking forward for features such as light mode and exportability among other things.

Kkoala 3y ago

That's a cool idea!

entropie 3y ago

This is really cool. I wish there was something like that when I learned to code.

williamdclt 3y ago

If you’ve not seen it, there’s a vscode extension called CodeTour that does something similar, could be good inspiration (or maybe you already do better!)

tip_of_the_hat 3y ago
It's the first time I've heard of CodeTour, I'm really impressed from what I've seen thus far. Digging a bit deeper now, thanks for sharing!

trenchgun 3y ago

This is great idea! I actually have several potential improvement ideas. 1. Put the walkthrough it in a graph, or a minimap to see the whole picture easily? Or in a https://c4model.com/ https://c4model.com/ visualization 2. Why not make clickable code references visually stand out? 3. Make a VScode extension for it

tip_of_the_hat 3y ago
Thanks for taking a look and sharing feedback! I'm not familiar with the c4 model, I'll need to investigate. > Why not make clickable code references visually stand out Is the goal here that you want to know that a specific text block annotates a part of the code? > Make a VScode extension for it I think I will! I need to noodle a bit on the user experience here

rafbgarcia 3y ago

Great idea! What did you use for designing the UI?

tip_of_the_hat 3y ago
Thank you for checking it out! I use Figma to get a proof of concept of how I want things laid out. From there it's more tinkering at the code level.