Fun Projects, ReactJS, Tools

Merge HTML Files Online

How do I merge HTML files?

Voila! Here’s an online tool for it:

You can:

  • Drag and drop to select files
  • Drag list of files to reorder

I started building it because I tried to export a bunch of Evernote notes, in order to send one HTML file to my Kindle. This works nicely.

The functionality was written with React and it was simple enough–string concatenation. The interesting parts are:

1. UI Design

Since I’m basically at a loss when it comes to web design, the learning I had to do on UI to make the page look even moderately appealing was interesting.

When I’m trying to acquire knowledge on a new field, I usually go get a bunch of books around the same topic. Because on one hand, opposing opinions at the same time generates less bias. On the other hand, well, books and books are not created equal. Some authors are vastly more capable of pinning down problem solving than others.

So, for resource recommended on the topic of design: Hello Web Design.

2. Deploying

I’ve done handfuls of side projects before, which ended in various states of completion. Of the deploy tools I use, Heroku is definitely the most friendly. Especially if you want to get a Minimal Viable Product out the door as soon as possible, deploying on Heroku will save you huge amounts of hair pulling with configuration.

Better yet, it’s free! With minimal use. And if you ever do need to scale, it’s as easy as adding a pack. A definite choice at the start of any pet project.

2023-01-22 Update: Heroku canceled their free tier and so is no longer a good starting ground. NextJS deployment might be a better option if you’re using it.

3. Domains

Since domains charge yearly compared to monthly charged servers, it’s much cheaper to get one. This time I entertained myself with the popular GoDaddy.com instead of the simple bare bones google domain.

And I don’t like GoDaddy at all.

It took me at least a dozen frustrated tries to cancel the “automatic renewal”, the option to unselect not even present when you pay. And you have to wait a month before you’re allowed to transfer the domain out. Plus plenty of privacy options that you can basically get for free somewhere else (e.g. google domains), which are made to sound scary if you don’t buy.

To Recap

Overall, it was a fun thing to work on. Much learned. 😀

Standard

10 thoughts on “Merge HTML Files Online

  1. Ray says:

    I tried to use this to combine Chrome HTML Docs but it didn’t seem to work. Tried both Dragging and Dropping them in the field or using the Select Files Button, but my files do not seem to move into the application to be merged.

  2. SGD says:

    You are amazing! I just pulled together online journal files from 1997-2001 into one loooooong (but tiny in file size) document.

    In the past I’d try to read through, but the dead links would inevitably stop me from jumping to the next file and I’d have to go back to the directory. My memory sucks so I’m looking forward to reliving my early 20s 🙂

  3. Anon says:

    Hi Lucia, I’m a bit lost as to all of the resources in this site, so if I’m misunderstanding something, I apologize. BUT, if you were the one who created the HTML merge tool, I just wanted to say THANK YOU SO MUCH. I’ve just rediscovered it. It used to be just https://html-merge.com/, right? Because I used to use that ALL THE TIME, and then one day it wouldn’t work anymore. And most Merge HTML sites online only let you do like, 20 at a time, which is so frustrating when you have a LOT to merge. And then today, I decided to dig around more and found this, where now it’s https://html-merge.herokuapp.com/, and it works and it’s glorious and I’m so thankful YOU DON’T EVEN KNOW. So, thank you!

    • Yes indeed. Because it costs money to keep the domain and it generates 0 revenue, I decided to stop paying for it. Now it’s completely free to serve. Glad you find it useful. 😀

  4. P says:

    Hi Lucia, I’m the anon that thank you for creating the HTML Merge site. It no longer works, unfortunately. At first it said, [“Application Error.” An error occurred in the application and your page could not be served. If you are the application owner, check your logs for details. You can do this from the Heroic CLI with the command. [heroku logs — tail]. Now, it says, [“There’s nothing here, yet. Build something amazing.”] I know absolutely nothing of these things, but I’m curious. You mentioned that “it costs money to keep the domain” — how much money? I truly find the tool to be tremendously helpful because it doesn’t limit me to 10 at a time like most other sites, and it’s just SO easy to deal with, and I really miss it and am just trying to understand what the options are for getting a site like that up running again. I wish I had a talent for this stuff. It’s all gibberish to me! haha. Some things are so fascinating to me. We are in 2022. The internet is this super powerful tool! Tech is unstoppable! Why is finding an HTML merger so difficult to find for idiots like me? Blech.

  5. Anne says:

    Dear Lucia,
    Is your HTML merger coming back online? I’ve found it incredible useful and I use it all the time.
    I would appreciate it so much. It is a wonderful tool!

    Best regards,
    Anne

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.