jpacsai / Markdown_previewer

👀 freeCodeCamp - Front End Libraries Certificate project

Markdown Previewer 👀

This project is part of the FreeCodeCamp Front End Libraries Certification section

A markdown previewer app with similar functionality to this codepen. The task was to fulfill the user stories to successfully complete the project.

---

---

📑 Table of Contents

• Live link
• Getting started
• How to use
• Licence
• Credits

🔗 Live link

Open the page directly from here

🏁 Getting Started

Installation

The system expected to have the following dependencies installed

• Node.js
• npm
• [ yarn ]
• Git

1. Clone repository
2. Navigate into project folder and then install dependencies with npm install
3. start the server with npm start or yarn start
4. the aplication runs on http://localhost:3000

Service Worker

Service worker is being activated in the production version.

To get a production version either run yarn or npm
yarn build / npm run build

Built With

• create-react-app
• react-redux

Browser compatibility

The site was tested on Google Chrome only

🍴 How to use

1. When the markdown previewer first loads, the default text in the #editor field contains valid markdown that represents one of each of the following elements: a header, a sub header, a link, inline code, a code block, a list item, a blockquote, an image, and bolded text.
2. The default markdown in the editor field is rendered as HTML in the preview element by default.
3. When the user enters GitHub flavored markdown into the editor element, the text is rendered as HTML in the preview element as he/she types

📜 Licence

This project is licensed under the MIT License - see the LICENSE.md file for details

💰 Credits

• for the background gradient I used Ultimate CSS Gradient Generator by ColorZilla