1

So ages ago (1992?) I naively used Dreamweaver to produce a non-commercial multi-page website.

Each element is an embarrassing hodge podge of html enmeshed with inline styling.

The content is actually valuable and useful to the public, but I am ashamed to revive it because publishing it nowadays would paint me as an execrable developer, which I guess I was.

So, I'm looking for some kind of tool that would:

1 - take in the messy code

2 - extract the inline css and produce one separate css file

3 - extract the html and produce one separate html file that uses the above css file

Yes, I know there are several ways of doing this. By hand, or with complex regex, or with tools that do only half the job like extracting only the css.

However my main goal is to save time so I hope and pray there is a tool, library, framework, online or local app, that accomplishes all of 1, and 2, and 3.

Thanks, I would be very grateful for any pointers.

Improve this question

1 Answer 1

Reset to default
0

Few notes first:

  • Complex regexes are not really suitable for such a task, or dealing with HTML and other XML-like markups in general.
  • No tool will do it in a way to make people think you know your CSS. It can still be very messy after such extraction due to repetition, too narrow/wide scope of selectors, lack of or wrong usage of IDs and generally not understanding what would the most optimal way of defining all the different CSS blocks. Even current AI would have trouble with doing it any properly.
  • Unless it's just one page, turning some random multi-page old code into SPA (single HTML page application) feels nearly impossible to automate. It needs proper routing through JavaScript, etc.

TLDR: the difference of showing your skills will be minimal if you just use a tool for this. You won't really impress anyone by having CSS separated, the front-end development advanced quite a lot.

Thus I heavily recommend migrating manually and learning a framework like React or simplier Svelte instead of trying to do what you're trying to do. Or just releasing the website as-is if you don't have time for that.

Improve this answer
1
  • I've learned a ton since '92. Have been programming in react for almost 10 years. CSS did not come out until after this project but I've been working with CSS since '97. I'm not trying to fool anyone about my skill level today. I'm just embarrased by my 1992 level. I simply wanted to avoid the extreme tedium doing it by hand. You never know if someone has a github that does what you want. The "separation" I seek would be only the first step in modernizing my app. I'd add other cool modern techniques. I'm used to very complex regexes, looks like that's my next step, if no one has any tips.
    – Sliced Bread
    Commented Aug 6 at 2:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.