<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: XFreeTool</title>
    <description>The latest articles on DEV Community by XFreeTool (@xfreetool).</description>
    <link>https://dev.to/xfreetool</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4128051%2F7f623004-83df-43ec-bd74-74303cee3e27.png</url>
      <title>DEV Community: XFreeTool</title>
      <link>https://dev.to/xfreetool</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/xfreetool"/>
    <language>en</language>
    <item>
      <title>A Browser-Only Workflow for Cleaning JSON, Decoding Base64, and Preparing PDFs</title>
      <dc:creator>XFreeTool</dc:creator>
      <pubDate>Wed, 16 Sep 2026 12:27:43 +0000</pubDate>
      <link>https://dev.to/xfreetool/a-browser-only-workflow-for-cleaning-json-decoding-base64-and-preparing-pdfs-180h</link>
      <guid>https://dev.to/xfreetool/a-browser-only-workflow-for-cleaning-json-decoding-base64-and-preparing-pdfs-180h</guid>
      <description>&lt;p&gt;Small technical tasks often arrive together: an API response that is hard to read, a Base64 value buried in a request, and a PDF that needs one quick edit before it can be shared. Opening a separate desktop app for each step is usually more friction than the task deserves.&lt;/p&gt;

&lt;p&gt;This tutorial shows a simple browser-only workflow for those three jobs. The examples are deliberately small, so you can adapt them to your own debugging or documentation process.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Disclosure: I work on XFreeTool, the free web toolbox used in the examples below.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h2&gt;
  
  
  1. Format the JSON before you inspect it
&lt;/h2&gt;

&lt;p&gt;Start with the raw payload. It is much easier to spot a missing field, an unexpected nesting level, or an array with the wrong shape after formatting it.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight json"&gt;&lt;code&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nl"&gt;"user"&lt;/span&gt;&lt;span class="p"&gt;:{&lt;/span&gt;&lt;span class="nl"&gt;"id"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="mi"&gt;42&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="nl"&gt;"role"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="s2"&gt;"editor"&lt;/span&gt;&lt;span class="p"&gt;},&lt;/span&gt;&lt;span class="nl"&gt;"flags"&lt;/span&gt;&lt;span class="p"&gt;:[&lt;/span&gt;&lt;span class="s2"&gt;"beta"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="s2"&gt;"export"&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt;&lt;span class="nl"&gt;"enabled"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Open a JSON formatter, paste the payload, and format it. The readable version becomes:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight json"&gt;&lt;code&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"user"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt;
    &lt;/span&gt;&lt;span class="nl"&gt;"id"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="mi"&gt;42&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
    &lt;/span&gt;&lt;span class="nl"&gt;"role"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"editor"&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="p"&gt;},&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"flags"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="s2"&gt;"beta"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"export"&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"enabled"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;At this point, validate the structure before copying it into a fixture, issue, or API client. A formatter is not a replacement for schema validation, but it is a fast first pass when you are reading unfamiliar data.&lt;/p&gt;

&lt;p&gt;You can use the &lt;a href="https://www.xfreetool.com/en-us/tools/json-formatter" rel="noopener noreferrer"&gt;XFreeTool JSON Formatter&lt;/a&gt; for this step.&lt;/p&gt;

&lt;h2&gt;
  
  
  2. Decode Base64 only when you know what you expect
&lt;/h2&gt;

&lt;p&gt;Base64 is an encoding, not encryption. Treat it as a transport representation: decode it to inspect a value, but do not assume decoding makes sensitive data safe to share.&lt;/p&gt;

&lt;p&gt;For example, this value:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;SGVsbG8sIGRldmVsb3BlciE=
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;decodes to:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Hello, developer!
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Use a Base64 encoder/decoder when you need to inspect a header value, reproduce an integration bug, or create a small test value. Before pasting anything into a ticket or chat, remove tokens, credentials, and customer data.&lt;/p&gt;

&lt;p&gt;The &lt;a href="https://www.xfreetool.com/en-us/tools/base64-encode-decode" rel="noopener noreferrer"&gt;Base64 Encode/Decode tool&lt;/a&gt; keeps the task focused: paste, decode, inspect, and copy only the safe result.&lt;/p&gt;

&lt;h2&gt;
  
  
  3. Prepare the PDF as the final handoff
&lt;/h2&gt;

&lt;p&gt;Once the data work is done, the final artifact is often a PDF: a generated report, exported documentation, or a file that needs a small cleanup.&lt;/p&gt;

&lt;p&gt;A practical sequence is:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Merge the pages or source files in the intended order.&lt;/li&gt;
&lt;li&gt;Remove pages that contain scratch output or sensitive notes.&lt;/li&gt;
&lt;li&gt;Check page orientation and document title.&lt;/li&gt;
&lt;li&gt;Export the final version with a clear filename and share it through the appropriate channel.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;For ad-hoc jobs, a browser PDF tool is useful because it keeps the workflow close to the data you just inspected. XFreeTool includes a &lt;a href="https://www.xfreetool.com/en-us/category/pdf" rel="noopener noreferrer"&gt;PDF workspace&lt;/a&gt; with focused tools for common document tasks.&lt;/p&gt;

&lt;h2&gt;
  
  
  A compact checklist
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Format JSON before diagnosing it.&lt;/li&gt;
&lt;li&gt;Decode Base64 to inspect it, not to treat it as secure.&lt;/li&gt;
&lt;li&gt;Remove secrets and customer data before sharing examples.&lt;/li&gt;
&lt;li&gt;Make PDF cleanup the final handoff step.&lt;/li&gt;
&lt;li&gt;Use a repeatable workflow so small tasks do not interrupt the rest of your work.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The point is not to replace your primary IDE, API client, or document system. It is to reduce the setup cost of short, everyday tasks. A focused browser tool can be enough when you need one operation, one result, and then want to get back to building.&lt;/p&gt;

&lt;p&gt;If you want to try the workflow, start at &lt;a href="https://www.xfreetool.com/en-us/" rel="noopener noreferrer"&gt;XFreeTool&lt;/a&gt;.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>productivity</category>
    </item>
  </channel>
</rss>
