Welcome to the Indigo Ag React Code challenge.
Our goal is to build a minimal Markdown Editor that implements a tiny subset of the commonmark spec. It should only take about 1-2 hours to complete.
The template contains a text input area and an output area into which to render the formatted markdown. Our goal is to build something akin to this.
- When text is entered in the input area it appears in the output area.
- When text is separated by an empty new line, it get's rendered into a new block. By default we use
pfor blocks. - When a line starts with
#and##it is rendered in ah1andh2block respectively. - When a line starts with
---ahrelement is rendered.
We are using React and you are free to use any CSS solution you like and install small helper libraries like lodash, but keep dependencies to an absolute minimum.
Keep the implementation simple, there are no bonus points for implementing more than what is
required, we just want to see your ability to write clean JavaScript code, use React, and reason
about some logic. You can put everything into the App.tsx file.
Please timebox yourself to 1-2 hours and commit regularly.
This is a regular stripped down Create React App project with typescript:
- Run
npm startto start the app in development mode on http://localhost:3000. - Run
npm testto run tests, React Testing Library is already set up.
To submit your solution please create a private repository on GitHub, upload your code, and invite @mrloh as a collaborator.