NOTE: A newer attempt is being built at https://github.com/dalyIsaac/onenote-markdown.
The aim of this project is to build a web app which can be used to read and write OneNote notebooks as Markdown. The user interface is built using React and Office UI Fabric React. The state is managed using Redux, with Redux-Saga for handling application side effects. localForage is used to store OneNote data such as notebooks, section groups, sections, notes, and contents in IndexedDB.
Currently, the source code is hosted on GitHub. The master branch is built in Visual Studio Team Services using their GitHub integration, and deployed to Azure App Service via continuous integration. Testing occurs using Travis CI, running Jest.
- Signing in with multiple accounts
- Opening and downloading notebooks, section groups, sections, and pages.
- Persisting content across browser sessions
- Editing pages in Markdown
Clone the repo
git clone https://github.com/dalyIsaac/onenote-markdown.git
cd onenote-markdown
yarn
yarn start
yarn build
yarn test
Install the Chrome debugger
/vscode/launch.json
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}"
},
{
"type": "chrome",
"request": "attach",
"name": "Attach to Chrome against localhost",
"port": 9222,
"url": "localhost:3000",
"webRoot": "${workspaceFolder}"
}
]
}
To attach to an existing Chrome instance, ensure that Chrome from the command line as:
Windows
<path to chrome>/chrome.exe --remote-debugging-port=9222
macOS
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222
Linux
google-chrome --remote-debugging-port=9222
{
allNotebooks,
notebookOrder,
onenote,
router,
selectedNav,
totalNotebookLength,
users
}
State slice | Type | Purpose |
---|---|---|
allNotebook |
IStateUserNotebooks[] |
Stores an array of all the notebooks which all the signed in users have access to. |
notebookOrder |
string[] |
Stores an array of the id s of the notebooks in order. |
onenote |
IStateOneNote |
Stores OneNote , SectionGroup , Section , and Page s objects, by their id . |
router |
RouterState |
Controlled by connected-react-router . |
selectedNav |
string[] |
Stores an array of the id s of the onenote objects which are currently selected. |
totalNotebookLength |
number |
Stores the total number of notebooks which are open. This is used for notifying the user of the number of notebooks yet to be loaded. |
users |
IStateUsers |
Stores UserData by their userId , |
Objects which occupy onenote
have their Microsoft Graph structure flattened, or deflated.
For example:
{
"@Odata.context": "https://onenote.com",
"Beethoven": {
"nationality": "German",
"yearBorn": 1770,
"yearDied": 1827,
"concertos": ["Violin Concerto in D Major","Piano Concerto No. 0", "Piano Concerto No. 1", "Piano Concerto No. 2", "Piano Concerto No. 3", "Piano Concerto No. 4", "Piano Concerto No. 5", "Triple Concerto"]
}
}
would be "deflated" into
{
"@Odata.context": "https://onenote.com",
"Beethoven.nationality": "German",
"Beethoven.yearBorn": 1770,
"Beethoven.yearDied": 1827,
"Beethoven.concertos": ["Violin Concerto in D Major","Piano Concerto No. 0", "Piano Concerto No. 1", "Piano Concerto No. 2", "Piano Concerto No. 3", "Piano Concerto No. 4", "Piano Concerto No. 5", "Triple Concerto"]
}