I am looking for HTML note taking editor that I can take notes with HTML preview editing feature. I have been using markdown and asciidoc for 2 years and I am thinking about migrating HTML. But I don’t want to think about styling and organizing HTML when I am taking notes because doing these waste my time.
I need the following features:
Editing on HTML Live preview
Adding code blocks from the menu with one click (2)
Adding images from the menu with one click (3)
Adding admonition note blocks (4)
I have done research on conventional note-taking apps such as Evernote and OneNote but I have not found this feature. I have tried webpage building tools(Adobe Dreamweaver…) that have HTML preview feature but they have not features [(2),(3),(4)] that I need
First of all don’t expect to memorize everything in your head. There is way too much to remember. The best way to retain knowledge isn’t to take notes. (Unless you have a great memory this probably isn’t the best path) its learn by doing.
You can read a whole book on .NET technologies (or anything) but if you don’t write a single line of code yourself, odds are your going to forget, or have a tough time using that knowledge in practice. The main reason is you learn through failure, and you can’t fail taking notes.
If I gave you a project and a 1 month deadline, and you spent the entire month struggling through the code, debugging your code, hitting 5 thousand brick walls and didn’t finish the project in the 1 month, but stayed active, and grinded against the code the whole time, you would learn a hell of a lot more than if you spent 1 month reading about everything possible related to the project.
I purposely didn’t specify what the project was is because it doesn’t matter, the idea is the same regardless. You learn more through doing because you hit the brick walls, because you spend 15 mins debugging, because you screwed up
So yes, you can take notes, but I wouldn’t use that as a main focus. Especially if you plan on using things you read about, you should take a more proactive path. Personally I do the following:
If I want to possibly use something directly in the future, I try it out in a side-project. This means taking what I know, and building out a project more or less from scratch, with as close to a “real” scenario as possible.
If I’m more curious and just want to know about new technologies (hello redux, clojure and web assembly!) I’d read articles on the topic, but not much more. I’d expect myself to have to dig deeper later if I do want to know more about these topics. As I said, it’s fine to look things up, if need be.
If I straight up don’t understand a concept, then I’d brain storm around it, think about things in different angles (This is what I took to finally understand service-workers). Something complex that might not make sense immediately are usually complex topics like algorithms, or fancy technologies. These sorts of things might be great candidates for note taking, but since these concepts are usually complex, you probably need to think about it, and can’t just jump right in.
Finally its great to stay in the loop, so following feeds (rss, twitter, other) are great to hear about new things and expand your horizons, just don’t expect to learn everything and anything, and memorize it all. Learn what is out there to learn but focus on what you will need sooner rather than later.
I use Github Gists for this. I can keep the code file and make notes in comments. Then they are searchable if I need something from them and updatable if learned a better way to do it. Or if I got it but didn’t understand I have it later to work on until I do understand it.
Thanks, again I have looked vscode and atom cannot find any extension that live editing on visual preview.They have html preview feature that can reload html into browser automatically ,but I need to edit on visual preview and get the changes as html code from note taking editor .
. I need to save the material that I learning from and document it in a specific markup format so I can add my new experiences and make connections between things. I have built a tool that can pull out all pages as HTML from documentation outline and then create a big HTML file from that multi-page documentation. For example, I have converted all java documentation into one HTML file with this tool and have added my experiences and create connections between with my computer science notes. These notes save me a lot of pain because sometimes I cannot find anything with a google search and need structured knowledge.
Everything is perfect when in HTML mode but I cannot any tool that converts HTML markup to markdown and asciidoc markups elegantly.I have tried so many tools including pandoc but neither of this programs can make that conversion sufficiently.So I am thinking about taking notes as HTML will be better.
