We will start small with a very simple markdown note app that only displays a text editor on the left and a markdown preview on the right. Then, we will turn it into a full notebook with multiple note support.
A basic note editor
Setting up the project
For this project, we will have a few files ready to get us started:
- First, download simple-notebook project files and extract them in the same folder. Open the index.html file and add a div element with the notebook ID and a nested section element with the main class. You should have the following content inside the file:
<html>
<head>
<title>Notebook</title>
<!-- Icons & Stylesheets -->
<link href="...