This package adds two premium-style frontend tools to your existing static tools project:
ip-inspector.htmlhttp-curl-builder.htmlIt also includes shared UI assets and an optional Cloudflare Worker backend.
assets/
├─ shared/
│ ├─ tool-shell.css
│ ├─ tool-shell.js
│ ├─ storage.js
│ ├─ export.js
│ └─ icons.js
├─ ip-inspector/
│ ├─ ip-inspector.css
│ ├─ ip-inspector.js
│ └─ ip-services.js
└─ http-curl-builder/
├─ http-curl-builder.css
├─ http-curl-builder.js
├─ curl-generator.js
├─ request-runner.js
└─ code-generators.js
ip-inspector.html
http-curl-builder.html
cloudflare-worker/
├─ worker.js
└─ wrangler.toml
Copy these files/folders into the root of your tools website:
ip-inspector.html
http-curl-builder.html
assets/shared/
assets/ip-inspector/
assets/http-curl-builder/
Then add two cards to your homepage/tool hub:
<a class="tool-card" href="ip-inspector.html">
<h3>IP & Network Inspector</h3>
<p>View your public IP, browser details, timezone, and network diagnostics.</p>
</a>
<a class="tool-card" href="http-curl-builder.html">
<h3>HTTP Request & cURL Builder</h3>
<p>Build API requests, generate cURL/fetch/Python code, and test endpoints.</p>
</a>
Use a local server because ES modules and some browser APIs work best over HTTP.
Simple static server:
python3 -m http.server 8000
Open:
http://localhost:8000/ip-inspector.html
http://localhost:8000/http-curl-builder.html
For your Jekyll project using make serve, open whichever server address Jekyll prints, for example:
http://localhost:4000/tools/ip-inspector.html
http://localhost:4000/tools/http-curl-builder.html
http://localhost:4001/tools/ip-inspector.html
http://localhost:4001/tools/http-curl-builder.html
Both tools work on GitHub Pages without a backend.
The IP tool tries:
window.RMV_API_BASE + /api/ip, if configuredhttps://ipapi.co/json/https://api.ipify.org?format=jsonThe HTTP tool can:
fetch() requests when the target API allows CORSIf a target API blocks browser CORS, use the generated cURL in the terminal or configure the optional Worker proxy.
The Worker adds:
GET /api/ip
POST /api/proxy
Deploy:
cd cloudflare-worker
npm install -g wrangler
wrangler login
wrangler deploy
Then add this before the page scripts in both HTML files, or in a shared config file:
<script>
window.RMV_API_BASE = "https://network-api-tools.cloud-data.workers.dev";
</script>
For production, protect /api/proxy with stricter rules: rate limits, allowed domains or authentication, stronger private-network blocking, and response-size limits.
localStorage.This package has been updated for:
Frontend production path:
https://ruslanmv.com/tools/
GitHub Pages origin/fallback:
https://ruslanmv.github.io
Worker base URL:
https://network-api-tools.cloud-data.workers.dev
Local development origins:
http://localhost:8000
http://127.0.0.1:8000
http://localhost:4000
http://127.0.0.1:4000
http://localhost:4001
http://127.0.0.1:4001
The Worker CORS origins in cloudflare-worker/worker.js are:
const ALLOWED_ORIGINS = [
'http://localhost:8000',
'http://127.0.0.1:8000',
'http://localhost:4000',
'http://127.0.0.1:4000',
'http://localhost:4001',
'http://127.0.0.1:4001',
'https://ruslanmv.com',
'https://www.ruslanmv.com',
'https://ruslanmv.github.io'
];
The frontend modules already default to:
const DEFAULT_WORKER_BASE = 'https://network-api-tools.cloud-data.workers.dev';
Test after deploying the Worker:
https://network-api-tools.cloud-data.workers.dev/api/ip
curl -X POST "https://network-api-tools.cloud-data.workers.dev/api/proxy" -H "Content-Type: application/json" --data '{
"method": "GET",
"url": "https://api.github.com/repos/octocat/Hello-World/issues?state=open&per_page=1",
"headers": {
"Accept": "application/vnd.github+json",
"User-Agent": "Network-API-Tools"
},
"body": ""
}'