DEV Community

Cover image for How I  take notes for YouTube videos
Srinjoy Santra
Srinjoy Santra

Posted on

3 1

How I take notes for YouTube videos

YiNote is a free Chrome extension to take notes as you watch through a YouTube video. It has saved me countless hours in going to and fro between two screens to take notes.

Despite being an incredible tool to keep your video notes organised in a single place, I really did not like the way it exports notes in markdown format.

I came across a blog by Nicole van der Hoeven about her YiNote to Roam Research Workflow. This inspired me to build a similar thing for markdown editors.

I wrote this quick dirty NodeJS implementation of it.

"use strict"
const fs = require("fs")
const path = require("path")
const srcPath = "file/Path/"
fs.readFile(path.join(srcPath, "yi-note.json"), (err, data) => {
if (err) throw err
const yin = JSON.parse(data)
const { timestamp, ...rest } = yin.data[1]
yin.data.map(video => {
writeMd(video)
})
})
const writeMd = (video) => {
const urlId = video.meta.url.split("=")[1]
const fileName = video.meta.title
const filePath = path.join(srcPath,`${fileName} ${urlId}.md`)
const [day, time] = new Date(video.createdAt).toISOString().split("T")
const tags = video.meta.keywords.map((tag) => tag.replace(/\s/g, "-"))
if (!fs.existsSync(filePath) && video.tags && video.tags.includes('1')) {
const frontmatter = `---
type: videos
status:
title:
source: ${video.meta.url}
creator: "@ Someone"s
file.cday: ${day}
modifiedOn:
publishedOn:
tags: ${tags}
aliases: []
---`
const title = `# ${fileName}`
const hhmm = time.match(/[^:]+(\:[^:]+)?/g)[0]
const sub = `${day} ${hhmm} | [[+]] [source](${video.meta.url}) | #youtube
by [[@ Someone]]`
const iframe = `
<div class="videoWrapper">
<iframe src="https://www.youtube.com/embed/${urlId}" allow\="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
</iframe>
</div>
${video.meta.description}
`
const subhead = `## Highlights`
let highlights = ''
video.notes.map(note =>
{
const ts = new Date(note.timestamp * 1000).toISOString().substr(11, 8);
highlights += `
- [${ts}](${video.meta.url}&t=${note.timestamp})
- ${note.content}`
}
)
const md = `${frontmatter}\n${title}\n${sub}\n${iframe}\n${subhead}\n${highlights}`
fs.writeFile(filePath, md, function (err) {
if (err) {
return console.log(err)
}
console.log(`The "${fileName}" was saved!`)
})
}
}
view raw yinote2md.js hosted with ❤ by GitHub

I run this script to use the exported json file from YiNote to turn all my video notes into a customised markdown format.

And the end result is this in Obsidian Editor!!
Obsidian yt note

Image of Timescale

🚀 pgai Vectorizer: SQLAlchemy and LiteLLM Make Vector Search Simple

We built pgai Vectorizer to simplify embedding management for AI applications—without needing a separate database or complex infrastructure. Since launch, developers have created over 3,000 vectorizers on Timescale Cloud, with many more self-hosted.

Read full post →

Top comments (0)

Eliminate Context Switching and Maximize Productivity

Pieces.app

Pieces Copilot is your personalized workflow assistant, working alongside your favorite apps. Ask questions about entire repositories, generate contextualized code, save and reuse useful snippets, and streamline your development process.

Learn more