Creating content separate from PG is easier than trying to shoehorn your thoughts into different boxes on a webpage layout in PG.
The tool that best fills this need for me seems to be Typora.
It offers a “live view” of the rendered code and large set of format options for the semantic flow of your markup as well as an “outline” view for organizing your thoughts in greater context.
pasting the final draft into PG for last touches of styling and layout organization makes the best use of both tools, in my (limited) experience.
I’ve documented the workflow process as i went and I’m including the markdown file here in case anyone else finds it useful.
The Workflow.md document walks you thru the various features and organizes the Block and Inline elements according to how well they transfer to PG. Some features, while powerful, do not lend themselves to clean markup – which was my aim.
NOTE: Apparently the PG forum will not let me upload a .md file so i’ve posted it on the slack channel where you can download it.
DISCLAIMER: I am not affiliated with Typora in anyway.