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="...