DriversRecommendedOutdated drivers can make a good PC feel brokenScan driver issues before chasing fixes manually.Scan NowHalloween DealsAmazon USHalloween week deals: useful picks before month-endAmazon US: current deals, useful picks and tech finds.Check DealsWindows FixRecommendedWindows errors stealing your time? Find the fix fastScan stability, cleanup and performance issues.Fix Now×
FREEDOM251

Freedom251 › Blog › browser automation

How to Republish a DEV.to Tutorial on Medium Without Losing Its Formatting

By Freedom251 Team · · 14 min read

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

The dependable way to cross-post a DEV.to tutorial to Medium is to import it as a draft, then compare that draft with the published DEV.to source before you publish anything. The publish-agents project and its medium-publisher package can automate the browser portion, but a successful import only proves that Medium created a draft. It does not prove that headings, fenced code, links, lists, images, metadata, or privacy-sensitive values survived unchanged.

This workflow uses the publish-devto route described in Fernando Paladini’s tutorial. You prepare a public DEV.to article, authenticate a local browser session, import the article into Medium, inspect the real editor, make only targeted repairs, and repeat the check before deciding whether to publish. Keep the original DEV.to URL as the intended canonical source when that is the version you want search engines and readers to recognize.

As an Amazon Associate I earn from qualifying purchases.

What you need before importing

Prepare the source, destination account, and local environment before opening the importer. A missing prerequisite usually looks like a formatting problem later, so verify each item first.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

A published, public DEV.to article

The route reads the source through DEV.to’s public API. Use a DEV.to article that is already published and reachable without a private session. Copy its exact public URL, including the article slug, and open it in a private browser window to confirm that an unauthenticated reader can see it.

Do not use a private draft, an article protected by an access control layer, or a URL that redirects to a different revision unless you have checked which version the API will return. The imported content is only as accurate as the public source that the route can retrieve.

A Medium account that can create stories

Sign in to the Medium account that should own the cross-post. The account must be able to create a story, not merely read or bookmark one. The tutorial’s browser login is interactive: a browser window opens, you complete the sign-in flow yourself, and the tool stores a reusable browser session locally.

Node.js 20 or newer and a usable terminal

The tutorial specifies Node.js 20 or newer. Check the version installed on the machine that will run the project; installing a newer version on another computer does not help if the importer runs elsewhere. You also need a terminal capable of running npm and the browser-installation step documented by the project.

Free tools Windows power users keep installed

One-click scans. No signup required.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Use the setup commands from the tutorial and the release documentation rather than copying commands from an old blog post. The tutorial references publish-agents release v0.2.3 and the package @paladini/medium-publisher-mcp. Treat that release as a dated example: a newer release, package name, browser requirement, or setup sequence may exist when you perform the import.

Rights and a canonical-source decision

Only republish material for which you have the necessary rights, including code, screenshots, diagrams, quotations, and images supplied by someone else. DEV Community’s official Writing, Editing and Scheduling help answers the question “Can I cross-post something I’ve already written on my own blog or Medium?” with “Absolutely, as long as you have the rights you need to do so!” That permission does not transfer ownership of third-party material to you.

Decide which URL represents the original version before you import. For a DEV.to-first article, that is normally the public DEV.to URL. Write down the exact URL so you do not accidentally set a stale slug, a tracking URL, or a different language version as canonical.

Why the first Medium copy should remain a draft

Publishing immediately turns an automation mistake into a public correction job. A draft gives you a controlled checkpoint: you can inspect the editor’s actual blocks, compare them with the source, and discard or repair the copy without exposing broken code or private data.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

The importer performs extraction and browser actions. It does not establish semantic equivalence between the two pages. Medium’s editor can change independently of the tool, and a future import can behave differently from the one you just checked. Treat automation as a repeatable starting point, not as a proof of fidelity.

A draft-first process also separates two decisions that are often confused:

  • Transfer decision: did the tool create a usable Medium draft from the public DEV.to article?
  • Publication decision: after comparing the draft with the source, is this particular copy safe and accurate enough to publish?

Only the second decision makes the article public.

Set up the browser-automation project

Use the tutorial’s documented release as an example

Obtain the open-source publish-agents project using its own documented installation method. The tutorial builds and links @paladini/medium-publisher-mcp, referring to v0.2.3. Pinning that release can make a reproduction easier, but it is not a promise that the release is current or compatible with a later Medium interface.

Record the project version, Node.js version, operating system, and browser used for each import. That small log makes a failed rerun diagnosable: you can tell whether a change came from the source article, the package, the browser session, or the destination editor.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Build and link the package

Follow the tutorial’s sequence to install dependencies, build the project, and link the @paladini/medium-publisher-mcp package into the local environment. Do not substitute a globally installed package without checking its version; mixing a global executable with a locally built package can invoke different route definitions.

Run the project’s browser installation step on the same machine and user account that will perform the import. A browser installed for one operating-system user may not be available to the account running the package. If the project reports a missing executable, repair that prerequisite before troubleshooting article formatting.

Log in interactively and save the session

  1. Start the login operation described in the tutorial.
  2. Complete the Medium sign-in and any verification prompts in the browser window that opens. Do not paste passwords or one-time codes into article fields or terminal logs.
  3. Wait for the tool to confirm that the browser session has been saved locally.
  4. Close the browser only after the session-save step completes, then run a harmless check such as opening the Medium story editor to confirm that the session can be reused.

Keep the saved session private. It can represent an authenticated account, so do not commit it to a repository, attach it to an issue, or copy it to a shared machine. If the session expires, repeat the interactive login rather than weakening account security.

Import the DEV.to article as a Medium draft

  1. Open the project route. Start the publish-devto route using the project’s documented launcher. Confirm that it is using the package and browser session you just prepared.
  2. Provide the public DEV.to URL. Paste the exact source URL, not a preview link or an editor URL. The route reads the article through DEV.to’s API before opening Medium’s import flow.
  3. Choose draft behavior. Select the option that leaves the result as a Medium draft. Do not choose an automated publish action for the first run, even if the tool offers one.
  4. Wait for the editor to finish loading. Let the import and browser navigation settle. A success message, a loaded page, or a visible title is not a formatting audit.
  5. Open the resulting draft in the normal Medium editor. Inspect what the editor actually renders, not only an intermediate extraction, log entry, or structured result from the package.
  6. Keep the DEV.to source open separately. Use a second browser tab or window and compare the source section by section with the Medium draft.

If the route fails before a draft appears, first check the public URL, saved login session, Node.js version, browser installation, and package version. Do not diagnose a missing draft as a code-block conversion failure until the route has successfully opened the editor.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Run a line-by-line formatting check

Read the source and destination in the same order. Start at the title and move downward; do not rely on a quick visual impression of the whole page. The following checks target the places where an apparently successful import can still change meaning.

Title and opening text

  • Confirm that the Medium title has the same wording and meaning as the DEV.to title.
  • Check punctuation, capitalization, numbers, version labels, and unusual characters.
  • Make sure the first paragraph has not been dropped, duplicated, or merged with the subtitle.
  • Verify that a subtitle, if the source uses one, appears in the intended subtitle field rather than as an ordinary paragraph.

A title that is merely similar is not enough for a technical tutorial: a changed version number, command name, or product identifier can mislead readers before they reach the body.

Heading levels and outline

Check each section in the Medium editor, not just its visual size. A line that looks bold may still be a paragraph, while Markdown markers may have been imported as literal characters. DEV’s editor guide documents heading markers from levels 1 through 6 and recommends beginning article sections at level 2 because the article title already supplies level 1.

  • Confirm that every intended section is a real heading block.
  • Check that the hierarchy does not jump unexpectedly, such as a subsection becoming a top-level heading.
  • Look for literal # characters that should have been converted into heading blocks.
  • Ensure that a heading has not been absorbed into the preceding paragraph or the following code block.

Preserve a clear outline for accessibility and navigation. On DEV.to, the same principle applies when you edit the source: use useful heading levels rather than choosing a size only for visual emphasis.

What’s actually slowing this PC down?

Pick the symptom - the matching free tool is one click away.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Fenced code blocks and language labels

Code is the highest-risk part of a technical tutorial because one lost fence can change every line after it. For each example, verify that the complete fenced example remains one code block and that its language label is still present when the source specifies one.

  1. Compare the opening and closing boundaries of every source fence with the corresponding Medium block.
  2. Check indentation, blank lines, braces, quotation marks, angle brackets, and leading spaces.
  3. Confirm that shell commands, output, comments, and explanatory text have not been merged into a single block.
  4. Inspect the content after the first code block carefully. Fence damage often becomes visible only when later prose is still styled as code or later code is rendered as ordinary text.
  5. Use the editor’s code-block control to repair a block rather than inserting formatting characters into ordinary prose.

Do not judge correctness from syntax coloring alone. A color theme can make malformed code look plausible, and a valid-looking block can still omit one line or use the wrong language label.

Lists, links, and paragraph order

Compare the sequence, not just the presence, of content. Check ordered and unordered lists item by item, including nested items and numbering. Verify that links still point to the same destinations and that link text has not been separated from its target.

  • Confirm that list items remain in source order.
  • Check whether a nested list became a flat list or ordinary paragraphs.
  • Open important links to ensure the destination is the intended page, not a truncated or altered URL.
  • Look for paragraphs that were joined together, split at the wrong place, or moved around a list or image.
  • Check emphasis, inline code, and quotation formatting where those distinctions affect a command or technical term.

When a tutorial explains a procedure, a reordered step can produce a different result even if every sentence is present. Compare numbered steps as instructions, not as decorative formatting.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Images, captions, and accessibility details

Check that each image appears once, in the correct location, with the expected crop or dimensions. Verify captions and nearby explanatory text. If the source has an alt description, make sure the imported draft did not discard it or replace it with a filename.

For the DEV.to source, DEV’s editor guidance recommends useful alt descriptions and a clear heading outline. Preserve those descriptions when you maintain the original article; do not treat an image that merely looks correct as accessible by default.

Topics, cover image, and other metadata

Review the Medium draft’s metadata separately from the body:

  • Confirm that topics accurately describe the tutorial and do not add unrelated categories.
  • Check that the cover or hero image is the intended asset and that its crop does not hide essential text.
  • Verify the subtitle and any publication or distribution choices before publishing.
  • Search the draft for private URLs, local file paths, access tokens, email addresses, internal hostnames, and other secret-like values that may have been present in an example or screenshot.

Metadata errors are easy to miss because they may not appear in the body comparison. Make them an explicit gate rather than an afterthought.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Repair only what the comparison identifies

When you find a mismatch, make the smallest edit that restores the source meaning. Examples include converting a literal Markdown heading into a heading block, recreating one damaged code block, moving a list item back into sequence, replacing a wrong image, or deleting a private value that should never have been published.

  1. Record the source location and the observed difference.
  2. Repair that block in the Medium editor without reformatting unrelated sections.
  3. Save the draft and allow the editor to finish its save operation.
  4. Extract or inspect the repaired area again using the project’s documented check or the editor itself.
  5. Compare the repaired block with the DEV.to source one more time.

Stop and switch to manual inspection if the editor’s controls, block model, or import behavior has changed from the tutorial’s description. Also stop if a repair does not match the source after one targeted attempt. Repeated automated edits can compound a small mismatch into a larger one.

Canonical URLs, DEV.to editors, and RSS imports

Canonical handling depends on how the article entered DEV.to and which editor you use. These settings affect the source page you are preserving, so verify them independently of the Medium draft.

Rich + Markdown editor

DEV.to’s Rich + Markdown editor exposes a Canonical URL field in the gear or settings area. Enter the intended original URL there and review it before publishing or updating the source.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Basic Markdown editor

The Basic Markdown editor uses canonical_url in front matter. DEV’s editor guide lists front-matter fields including title, published, tags, canonical_url, cover image, and series. Keep the field’s value equal to the source URL you selected, with no accidental preview or tracking address.

RSS or Atom workflow

DEV.to can import from an RSS or Atom feed. Its guidance says the feed’s HTML is converted to Markdown, the first four feed categories are used as tags, and the feed link is mapped into canonical_url only when the canonical-source setting is enabled. That conversion is a separate path from the browser route used to bring a DEV.to article into Medium, but it explains why a feed-imported source may already differ from the original HTML.

DEV.to allows at most four tags in the documented front-matter model. Check the resulting tags instead of assuming that every category in a feed or every topic in Medium will transfer one-for-one.

Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Manual copying versus browser automation

Neither approach removes the need for a final comparison. The practical difference is where effort and risk appear.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
Workflow consideration Manual copy into a Medium draft Browser automation with publish-devto
Draft control You create and save the draft directly while deciding what to paste. The route can create the draft, but you must select draft behavior and verify that no publish action was triggered.
Heading and code fidelity You can format each block deliberately, but a long tutorial takes more time and manual errors remain possible. Extraction and insertion are repeatable, yet the editor can still flatten headings or damage fences.
Metadata visibility You choose the title, subtitle, topics, images, and links during the copy. Metadata may be populated by the import flow; inspect every field because an apparently complete body does not validate metadata.
Dependence on platform UI You work with the current Medium editor controls yourself. The automation depends on selectors and flows that can break when Medium changes its interface.
Repair and recheck effort Repair happens during the initial composition, but there is still a final proofread. A localized mismatch can be repaired quickly, followed by another extraction or visual check; a broad mismatch may be faster to redo manually.

These are workflow trade-offs, not measured performance results. Choose automation when repeatability matters and you are willing to supervise each draft; choose manual entry when the article is short, highly designed, or already known to use blocks the importer handles poorly.

Common failure modes and practical fixes

The import reports success, but the draft is incomplete

Reopen the source in an unauthenticated window and confirm that the URL returns the complete published article. Then check the saved Medium session and package version. If the public API response is incomplete, repair the source-access problem before editing the draft. If the source is complete but the draft is not, preserve the draft for comparison and manually restore only the missing sections.

Markdown appears as literal text

Convert the affected line into a real Medium heading or list block using the editor controls. Do not leave a visible # marker and assume readers will interpret it correctly. Recheck the surrounding paragraphs because a failed conversion may have changed the block boundary.

Everything after the first code sample is styled as code

Look for a missing closing fence or an extra fence in the source-to-draft comparison. Recreate that one code block, then inspect every subsequent paragraph and block until normal prose resumes. A local repair is safer than reformatting the whole article.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Code is present but changed meaning

Compare characters, not line count. Pay special attention to indentation, punctuation, shell prompts, environment-variable markers, escaped characters, and language labels. Replace the affected block from a trusted source copy, save, and run the check again.

The browser session no longer works

Start the interactive login again and save a fresh session. Do not share the stored session or place it in source control. If repeated login attempts fail, stop the import and use a manual draft while you diagnose the local browser or account issue.

Medium’s controls no longer match the tutorial

Medium interface changes are a known compatibility risk for browser automation. Stop the route before publishing, inspect the draft manually, and consult the project’s current instructions for an updated flow. Do not guess a selector or click sequence that could publish the story or alter account settings.

A private value appears in the draft

Delete the value from the draft and check nearby code, screenshots, links, and metadata for copies. Rotate the credential if it was real, then review the DEV.to source and any other public copies. A formatting check is also a privacy check.

What’s actually slowing this PC down?

Pick the symptom - the matching free tool is one click away.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Final pre-publication gate

Publish only after every item below is true:

  • The Medium story is still the intended draft, not a publicly published copy created by an automated option.
  • The title and opening text match the source’s intended meaning.
  • Headings are real heading blocks with a logical outline.
  • Every fenced code example is complete, correctly bounded, and labeled as intended.
  • Lists, links, paragraphs, inline code, and procedure steps retain their order and meaning.
  • Images, captions, cover art, and alt descriptions are present and appropriate.
  • The subtitle, topics, and other metadata are accurate.
  • No private URL, token, password, internal hostname, or secret-like example remains.
  • You have the rights to republish the article and all included assets.
  • The canonical destination is the intended original URL, not a stale or accidental address.
  • You have considered whether Medium’s current editor differs from the automation flow and have manually checked any affected area.

After this gate, publishing is an editorial choice rather than an assumption that the importer got everything right. Keep the DEV.to article available for one last reference while you publish, because the draft comparison—not the automation status message—is what establishes that this copy is ready.

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.

browser automationDEV.toMediumTechnical Writing

Leave a Reply

Your email address will not be published. Required fields are marked *

Free tools Windows power users keep installed

One-click scans. No signup required.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Recommended PC Tool
Recommended PC Tool
PC Slower Than It Used to Be?Free scan - under a minute
Crashes, No Sound, or Screen Glitches?Free driver scan

Two free Windows tools

One Free Minute Could Fix That PC

Before you go - each of these free tools takes about a minute and tackles what quietly slows a Windows PC down.

Special offer. View Outbyte info, uninstall instructions, EULA, and Privacy Policy.