Skip to content

Separate HTML template from build output #7

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
danmooney merged 1 commit into from
May 20, 2026
Merged

Separate HTML template from build output #7

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,6 @@ starting_files/
test-results/
public/*
!public/.gitkeep
!public/index.html
!public/privacy.html
!public/favicon.svg
!ads.txt
116 changes: 0 additions & 116 deletions public/index.html
View file
Open in desktop

This file was deleted.

97 changes: 97 additions & 0 deletions src/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,97 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Python Dict to JSON Converter Online</title>
<meta name="description" content="Convert Python dictionaries to JSON format online. Paste your Python dict and get the equivalent JSON output instantly.">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
</head>
<body>
<div id="root"></div>

<main class="content-section">
<section class="recommended-reading">
<h2>Recommended Reading</h2>
<p class="affiliate-note">The links below are Amazon affiliate links. If you purchase through them, we may earn a small commission at no extra cost to you.</p>
<ul>
<li><strong><a href="https://www.amazon.com/dp/1492056359?tag=dict2json-20" target="_blank" rel="sponsored nofollow noopener">Fluent Python (2nd Edition)</a></strong> by Luciano Ramalho &mdash; The definitive guide to Python's data model. Essential reading if you work with dictionaries, classes, and idiomatic Python day-to-day.</li>
<li><strong><a href="https://www.amazon.com/dp/1718502702?tag=dict2json-20" target="_blank" rel="sponsored nofollow noopener">Python Crash Course (3rd Edition)</a></strong> by Eric Matthes &mdash; The most popular hands-on introduction to Python. Great for anyone newer to the language.</li>
<li><strong><a href="https://www.amazon.com/dp/1593279922?tag=dict2json-20" target="_blank" rel="sponsored nofollow noopener">Automate the Boring Stuff with Python (2nd Edition)</a></strong> by Al Sweigart &mdash; Practical Python for working with files, JSON, web data, and everyday automation.</li>
</ul>
</section>

<h2>About Python Dictionaries and JSON</h2>

<section>
<h3>What is a Python Dictionary?</h3>
<p>A Python dictionary is a built-in data structure that stores key-value pairs. It's one of Python's most useful and widely-used data types, allowing you to create mappings between related pieces of information. Dictionaries are defined using curly braces <code>{}</code> with key-value pairs separated by commas.</p>
<h4>Key Features of Python Dictionaries:</h4>
<ul>
<li>Keys must be unique and immutable (strings, numbers, or tuples)</li>
<li>Values can be of any type, including other dictionaries</li>
<li>Dictionaries are mutable and can be modified after creation</li>
<li>Order is preserved in Python 3.7+ (unordered in earlier versions)</li>
</ul>
<p>Learn more about Python dictionaries in the <a href="https://docs.python.org/3/tutorial/datastructures.html#dictionaries" target="_blank" rel="noopener">official Python documentation</a>.</p>
</section>

<section>
<h3>What is JSON?</h3>
<p>JSON (JavaScript Object Notation) is a lightweight, text-based data interchange format that's easy for humans to read and write and easy for machines to parse and generate. It's language-independent and has become one of the most popular data formats for web APIs and configuration files.</p>
<h4>Key Features of JSON:</h4>
<ul>
<li>Data types: strings, numbers, booleans, null, arrays, and objects</li>
<li>Uses double quotes for strings and property names</li>
<li>No support for comments or trailing commas</li>
<li>Widely supported across programming languages</li>
</ul>
<p>Learn more about JSON at <a href="https://www.json.org/" target="_blank" rel="noopener">json.org</a>.</p>
</section>

<section>
<h3>Converting Between Python Dictionaries and JSON</h3>
<p>While Python dictionaries and JSON objects are similar, there are some key differences in syntax and data types:</p>
<table>
<thead>
<tr><th>Python</th><th>JSON</th></tr>
</thead>
<tbody>
<tr><td>True/False</td><td>true/false</td></tr>
<tr><td>None</td><td>null</td></tr>
<tr><td>Single or double quotes</td><td>Double quotes only</td></tr>
</tbody>
</table>
<p>Our converter handles these differences automatically, ensuring your Python dictionary is properly converted to valid JSON format.</p>
</section>

<section>
<h3>Common Use Cases</h3>
<ul>
<li>Converting configuration files between Python and JSON formats</li>
<li>Preparing data for REST APIs that require JSON</li>
<li>Debugging Python dictionary structures</li>
<li>Learning the differences between Python and JSON syntax</li>
</ul>
</section>
</main>

<footer>
<p>For more information about data structures and formats, visit:</p>
<ul>
<li><a href="https://www.python.org/doc/" target="_blank" rel="noopener">Python Documentation</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON" target="_blank" rel="noopener">MDN Web Docs - JSON</a></li>
</ul>
<p class="affiliate-disclosure"><small>As an Amazon Associate, we earn from qualifying purchases. This site may contain affiliate links; we may earn a commission at no extra cost to you.</small></p>
<p><small><a href="/privacy">Privacy Policy</a></small></p>
</footer>

<script async src="https://www.googletagmanager.com/gtag/js?id=G-QFE6TJB3X9"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'G-QFE6TJB3X9');
</script>
Comment thread
danmooney marked this conversation as resolved.
</body>
</html>
2 changes: 1 addition & 1 deletion webpack.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ module.exports = {
},
plugins: [
new HtmlWebpackPlugin({
template: './public/index.html',
template: './src/index.html',
}),
],
devServer: {
Expand Down
Loading