I came to learning front end a short while ago from being very familiar with apps like illustrator, photoshop, reaper and so on. With these I have just one file, I can save incrementally when something significant has changed, but I’m used to just being able to spam CTRL-Z if something isn’t working and starting over. Unfortunately, I keep trying to undo work in parallel HTML and CSS files, but I don’t know how far to go in each and it all gets messed up and I keep losing work because of it.
What is a good strategy for keeping track of changes in 2 separate files? Should I be saving incrementally much more often. I have actually considered just using style tags for CSS so I can keep it all in one file and undo as I want to and then move the CSS over when finished, is that a terrible idea?
One thing that doesn’t help my messy situation is I don’t really have a handle on naming conventions for selectors, I try to not write duplicate code for elements that will all be styled the same way, but invariably find I need to change something later and have to rename classes, which I often get confused and wish I had just named everything uniquely from the get go. I know it’s not very economical, but should I stick to unique selectors for different sections at least until I become better at organising everything?
Any tips or advice would be greatly appreciated as I’m getting a bit tired of unpicking work I’ve messed up through lack of organization.
Edit: What would be amazing (for me at least) would be a vscode extension that kept a single undo file for both the CSS and HTML (and JS) and would undo changes in order in all the files you have open. If you close one it would prompt you to make an incremental save.
(I can dream)