For years I’ve received bug reports with stack traces that were garbled and hard to read. It’s easy enough to use a regular expression to fix them, but I noticed that some folks on my team hadn’t thought to do that. So, I created TidyTrace.com to quickly and easily do it for my team members.

For example, take this Java stack trace

Exception in thread "main" java.util.InputMismatchException\n\tat java.base/java.util.Scanner.throwFor(Scanner.java:939)\n\tat java.base/java.util.Scanner.next(Scanner.java:1594)\n\tat java.base/java.util.Scanner.nextFloat(Scanner.java:2496)\n\tat com.example.myJavaProject.hello.main(hello.java:12)

After formatting it on TidyTrace.com, it’s much more readable

Exception in thread "main" java.util.InputMismatchException at java.base/java.util.Scanner.throwFor(Scanner.java:939) at java.base/java.util.Scanner.next(Scanner.java:1594) at java.base/java.util.Scanner.nextFloat(Scanner.java:2496) at com.example.myJavaProject.hello.main(hello.java:12)

Behind the Scenes: Actually formatting the stack trace was the least interesting part of this project. It could easily be written in a single line of code. I did split it to multiple lines for better formatting though. The real journey was in the other aspects of building and deploying the site.

Adventures in Advertising: Attempting to monetize through Google AdSense hit a snag – apparently, TidyTrace was "too content-light" for their liking. An experiment with another ad network bombarded the site with adult content, so I took that down quickly! I know none of us need that to pop up at work haha.

Deploying with Azure: I had never used Microsoft Azure before, and was pleasantly surprised how easy everything was. It was really cool that they had a free tier, and Azure created a Github action for me so that whenever I push to Github it automatically deploys the site. I didn’t read much of the Azure documentation myself; I just asked ChatGPT what to do each step of the way.

Learning Curve: My CSS skills aren’t all that great, but ChatGPT did the heavy lifting for me. As part of this I learned about CSS Grid which is super cool! There’s a really quick/easy tutorial I found that was really enjoyable to go through: https://www.joshwcomeau.com/css/interactive-guide-to-grid/

Example ChatGPT conversation: If you haven’t used ChatGPT 4 as part of your development process before, I highly recommend it! I’ve found it to be much better than GitHub Copilot. Just be sure you’re using ChatGPT 4, because it produces much higher quality code than 3.5. Here’s a real example conversation I used yesterday to tweak some of the behavior on the site. In this particular example, ChatGPT didn’t come up with exactly what I wanted so I gave up and asked ChatGPT for the API and fixed it myself. https://chat.openai.com/share/e8436702-937f-40ad-9977-ee7ee7...

Feedback Wanted: I’d really appreciate your thoughts, feedback or suggestions on TidyTrace.com. In particular, if you have a stack trace that isn’t formatted well, I’d be happy to look to see if I can make TidyTrace.com fix it for you.