This article introduces the basic concepts of Markdown and its applications in various software, recommends using VSCode as an IDE, and lists recommended plugins. The author shares their experience switching from Hexo to Hugo, emphasizing Hugo’s flexibility and customization capabilities. Finally, it provides some suggestions for quickly getting started with new technologies and shares a trick for resolving the issue of Hugo theme styles not updating.
Introduction
Markdown
A lightweight markup language that allows people to write documents in an easy-to-read and -write plain text format.
Markdown
Detailed Markdown syntax will not be elaborated upon in this document. We recommend an ebook, click here. Many software applications on the market now support MD as a writing format. The csdn blog system has launched an online editor that supports MD syntax; the default article when first using it is an introduction to MD syntax, which I think is quite good. Evernote added support for MD notes in 2018, with various MD markers available in the shortcut bar, making it almost as easy to use as editing a regular article, and the overall interaction process is friendly to beginners.
IDE Recommendations
When writing this article, it’s already 2020 – you’ve undoubtedly heard of VS Code, after all, anyone thinking about using Git Page to build a blog system is an industry professional. In the early years, Sublime and Atom were also good choices. Thanks to two years of promotion by the open-source community, VS Code has developed rapidly and has gradually become the preferred choice for newcomers.
The relationship between Microsoft’s giant corporation and the open-source community has successfully transitioned from a state of division into a honeymoon phase: embracing open source. My company has also actively introduced the Java ecosystem in recent two years, meaning that in business development, Java’s ecosystem is currently very fragrant domestically.
VS Code Plugin Recommendations
All plugins have their own Readme files, introducing basic usage, core functions, and some authors even provide demo screenshots.
Paste Image, combined with Hugo’s image plugin method, is very convenient for importing images.
Don’t remember the shortcuts, open the VS Code shortcut management menu, search for “md”, read it several times; review it again to see the plugin usage instructions.
Hugo
I switched from Hexo to Hugo, as I love tinkering – it’s just my nature! Ultimately, I couldn’t resist the urge to quietly write articles.
- Hugo supports placing images and Markdown documents in a single folder.
- The Academic theme supports various article styles in its design.
- Various convenient customization extensions.
academic
The default website is exampleSite, and menu introduction uses the #component approach. It’s recommended to use url.
The URL pattern allows for single-page navigation when clicking on navigation links, rather than scrolling to the homepage. This is purely a matter of personal preference.
- Style: Notebooks, Speeches, eBooks
- Flexibility: Customization of overall style and custom CSS styles
This theme’s Chinese support isn’t fully complete; primarily from a visual perspective, the font sizes don’t align well with Chinese reading habits. However, Hexo’s development team is largely comprised of Chinese developers, which is an advantage over Hugo in this regard. Nevertheless, “you get what you build” – manually customize your browser elements. When locating an element to determine the CSS style name to modify, clicking Insert Style Rule Below allows you to easily obtain the node name even with nested CSS layers.
- Introduce
custom.css - Introduce
custom_js - The theme’s built-in syntax highlighting settings can be found here: Official Link
Conclusion
The kids are complaining again, saying you talk in such a vague and unclear way, without mentioning any details.
What I want to say is that with these things, you have enough to work with:
- Official Manuals
- Plugin Documentation
When quickly getting started with new technologies, it’s recommended to first read the official website documentation, scanning through – not aiming for a single thorough reading. The results you get from search engines may not always be consistent with the latest version and could potentially mislead you. Reviewing a new book in the same way is also advisable: first look at the table of contents to understand what the author intends to cover, and sometimes it’s beneficial to read the introduction – particularly with translated foreign books, the preface often covers the core content of the book and its scope.
Easter Eggs
Switching the Hugo Academic built-in style settings and publishing to the site, the style didn’t change when accessed. A clever teammate already figured it out – clearing local browser cache solved the problem. I, being equally ingenious, used: F12 developer mode, switched to network, checked disable cache, refreshed, and voila!
