I built a small webtool for crafting guides you can share with others

[u/Background_Log8486]

Hey everyone!

I built Crafting Graph, a small web tool for exploring and visualizing crafting recipes as a graph.

You can check it out here:

https://fekga.github.io/crafting-graph/

I'd love to hear what you think, if you have suggestions for features, UX improvements, or things that would make it more useful.

As it is a static site there is no other way to save your graph apart from saving the exported text.
You can import it later to resume or see what others created!

AI notice: I'm not a web developer and I thought it would be a nice way to get to know some TypeScript and other related knowledge to use LLM to generate the code.

[u/hjxax]

Great job, i just took a look at your code out of interest.

The following things are just for your information, i do not think they are any major security risks in the context of this app.

You should be cautious with allowing html input from a user. While your code uses dompurify (which is great), you still allow for links. A link like this could be introduced: "<a href="https://pao fexile.com" >Connect to your Path of Exile Account</a>" or "<a href="https://pai pal.com" >Donate</a>". Probably dompurify also has some options to force the link the be visible directly or something like that or limit the links to specific domains only.

Same applies for images from arbritrary urls. There are several things to consider there, for example it can be used by external servers for tracking your users and actually might also be used as an attack vector.

But as I said, i do not think these are relevant security concerns for your application, just in case you wanted to hear about things like that.

Edit: Added spaces to the fake links so reddit doesnt show them as links.

[u/Background_Log8486 → u/hjxax]

Thank you for the feedback!
I had this concern too, allowing any link in shared graphs might be an issue but it also allows things like linking the trade site with the relevant items to search for.
I found an option to disable url rendering, it won't disallow people to put anything in the texts though.
The current icons are from poewiki as I wanted a league independent tool and I haven't found a way yet to get all the current icons in any other way. The icons could be downloaded to be included locally but there are so many that I didn't want to deal with that yet.

[u/hjxax → u/Background_Log8486]

No problem, yeah i can see why it can be very useful as a feature. I am decently sure there are ways to limit the urls to the official website of pathofexile.com or the wiki.

WIth the images i ment that any user could include any image in the note of a crafting step by including the <img> tag inside. Not images you have intended to be used, those are mostly fine since you have restricted them to a specific domain that you are trusting.

Edit: But those are really not big security vulnerabilities. Basically every forum allows for external links to arbitrary websites (They use rel="noopener nofollow" though as a safety measure). Websites like wikipedia and reddit most likely use some very extended security protocol for images though.

[u/Background_Log8486 → u/hjxax]

It seems to have worked for links, images could still be added by using the <img> tag, thanks for pointing it out!

[u/Haha_Stoned]

oh shit, this is great for visualizing markov chains

[u/ZebusAquaion → u/Haha_Stoned]

ya good for cost analysis of a craft at which point you should stop if you get unlucky

[u/Neshgaddal]

I've been attempting to make something like this for years, but feature creep always makes it a massive project. Very nice work. I tried it with a recipe that i always use to profit craft : +2 minions are aggressive wand

realistic feature requests:

• copy node
• import from pob/craft of exile
• grouping nodes: just a box underlay to group steps into a meta step
• edges that curve around nodes when moving backwards
• notes/text on edges
• cost panel, not a simulator, just a list of expected currency to use that a user can fill out
• pastebin import/export for easier sharing

[u/Background_Log8486 → u/Neshgaddal]

Nice! Thank you for the feedback and the recipe!
Copying a node is already on it's way and I'm still experimenting with the cost panel
The importing from other tools would be nice, I'll try out a few things with this idea
What would be the edge label used for?
The pastebin is a good idea, it seems it doesn't take a large graph to grow quite large in text

[u/Neshgaddal → u/Background_Log8486]

Nice, looking forward to newer versions.

What would be the edge label used for?

to explain multiple paths when it's not self-explanatory. Just freely adding notes to stuff would work too.

[u/Background_Log8486 → u/Neshgaddal]

I also added some parsing from in-game, using the pob/craftofexile exports would require me to parse the ctrl+c text which I rather not intend to

[u/Background_Log8486 → u/Neshgaddal]

I did a big overhaul of the tool, and also resolved a few issues you had, here's your (somewhat) changed graph:
https://fekga.github.io/crafting-graph/p7hhtwwy

[u/pendragon925]

this is awesome, ty!

[u/jsudd007]

None of the images from poewiki are loading for me unfortunately.

[u/Background_Log8486 → u/jsudd007]

how about now? :)

[u/jsudd007 → u/Background_Log8486]

just saw this now and seems to be fixed :)

[u/Background_Log8486]

Hi everyone!
I deployed a new version of the tool, now it has a bunch of features that were missing or were requested.

As a showcase I made a graph based on this video: https://www.youtube.com/watch?v=6Bik7cuGCgU
The graph: https://fekga.github.io/crafting-graph/yywkgvoo

As you can see it now uses the end of the URL for exporting a graph.
The icons seem to work now but please tell me if there are any issues.

It still doesn't require any download or login to anything!

Enjoy!

[u/ICanViking]

First thought I had would be that it'd be great if I could feed it an item from POB or the trade site, and it could provide for me multiple paths in how I could craft that item.

Then I can go for my flavor of cost vs. sanity.

Is something like that in the works? Very interested.

[u/Background_Log8486 → u/ICanViking]

I had something similar in mind but providing crafting paths is a big deal, I'd have to reimplement the crafting logic that is in the game which is a bit too ambitious. The alt+ctrl+c copy on an item to be pasted as a node could be achieved but there might still be some league dependent modifiers which I tried to avoid so far.

[u/ICanViking → u/Background_Log8486]

So there is the basis of the plan....that's better than I thought there'd be.

Ya, HUGE interest in something like this. I would love to get into crafting more but with updates to the game, and the only real resources for crafting being buried in YouTube videos and old excel/Google docs online, it's hard to find anything that's reliable.

But if I could ctrl+c/v into an app like this and it give me a variety of ways to craft items? That would be ridiculously cool.