Back to Freecodecamp

Challenge 136: Markdown Image Parser

curriculum/challenges/english/blocks/daily-coding-challenges-javascript/6925e2068081f40f549ced1a.md

latest1.9 KB
Original Source

--description--

Given a string of an image in Markdown, return the equivalent HTML string.

A Markdown image has the following format: "![alt text](image_url)". Where:

  • alt text is the description of the image (the alt attribute value).
  • image_url is the source URL of the image (the src attribute value).

Return a string of the HTML img tag with the src set to the image URL and the alt set to the alt text.

For example, given "![Cute cat](cat.png)" return '';

  • Make sure the tag, order of attributes, spacing, and quote usage is the same as above.

Note: The console may not display HTML tags in strings when logging messages — check the browser console to see logs with tags included.

--hints--

parseImage("![Cute cat](cat.png)") should return ''.

js
assert.equal(parseImage("![Cute cat](cat.png)"), '');

parseImage("![Rocket Ship](https://freecodecamp.org/cdn/rocket-ship.jpg)") should return ''.

js
assert.equal(parseImage("![Rocket Ship](https://freecodecamp.org/cdn/rocket-ship.jpg)"), '');

parseImage("![Cute cats!](https://freecodecamp.org/cats.jpeg)") should return ''.

js
assert.equal(parseImage("![Cute cats!](https://freecodecamp.org/cats.jpeg)"), '');

--seed--

--seed-contents--

js
function parseImage(markdown) {

  return markdown;
}

--solutions--

js
function parseImage(markdown) {
  const regex = /!\[(.*?)\]\((.*?)\)/;
  const match = markdown.match(regex);
  if (!match) return "";
  const alt = match[1];
  const src = match[2];
  return ``;
}