日付ありTable(Markdown)を自動作成

記事概要

Markdownで記事を書く場合、Tableを使いたいことがある。何かを日付で管理してドキュメントとして残しておきたい場合、わざわざ日付を入れるのが面倒。それを解消するスクリプトを作成。

スクリプト

※1 2023/12/03 コメントを参考に、曜日の色の変え方を変更。
※2 コメント欄にもっとすっきりしたコピペしやすいコードあり。

// 日付リストを取得
const getDateRange = (startDate, endDate) => {
  const dateList = []
  let currentDate = new Date(startDate)
  while (currentDate <= endDate) {
    dateList.push(new Date(currentDate))
    currentDate.setDate(currentDate.getDate() + 1)
  }
  return dateList
}

// 日付リストからMarkdownのTableを作成
const getTableMarkDown = (dateList) => {
	const HEADER = '| 日付 | 記事タイトル | リンク１ | リンク２ |\n| -------- | -------- | -------- | -------- |\n'
	const tableMarkDown = dateList.reduce((result, val, idx) => {
		const mm              = val.getMonth() + 1
		const dd              = val.getDate()
		const mmdd            = mm.toString().padStart(2,'0') + '/' + String(dd).toString().padStart(2,'0')
		const dayOfWeek       = val.getDay()
		const daysOfWeek      = ['日', '月', '火', '水', '木', '金', '土']
		const daysOfWeekColor = ['red', 'black', 'black', 'black', 'black', 'black', 'blue']
		const currentDay      = daysOfWeek[dayOfWeek]
		const currentDayColor = daysOfWeekColor[dayOfWeek]
		result += `| ${mmdd} <font color='${currentDayColor}'>(${currentDay})</font>`
		result += '| - | - | - |\n'
		return result
	}, HEADER)
	return tableMarkDown
}

const startDate     = new Date('2023-12-01')
const endDate       = new Date('2023-12-31')
const dateList      = getDateRange(startDate, endDate)
const tableMarkDown = getTableMarkDown(dateList)

console.log(tableMarkDown)

使い方

ブラウザの開発者ツールを開き、コンソールに上記スクリプトを貼り付けると、以下のような文字列がコンソールに出力される。それをコピペ。

| 日付 | 記事タイトル | リンク１ | リンク２ |
| -------- | -------- | -------- | -------- |
| 12/01 <font color='black'>(金)</font>| - | - | - |
| 12/02 <font color='blue'>(土)</font>| - | - | - |
| 12/03 <font color='red'>(日)</font>| - | - | - |
| 12/04 <font color='black'>(月)</font>| - | - | - |
| 12/05 <font color='black'>(火)</font>| - | - | - |
| 12/06 <font color='black'>(水)</font>| - | - | - |
| 12/07 <font color='black'>(木)</font>| - | - | - |
| 12/08 <font color='black'>(金)</font>| - | - | - |
| 12/09 <font color='blue'>(土)</font>| - | - | - |
| 12/10 <font color='red'>(日)</font>| - | - | - |
| 12/11 <font color='black'>(月)</font>| - | - | - |
| 12/12 <font color='black'>(火)</font>| - | - | - |
| 12/13 <font color='black'>(水)</font>| - | - | - |
| 12/14 <font color='black'>(木)</font>| - | - | - |
| 12/15 <font color='black'>(金)</font>| - | - | - |
| 12/16 <font color='blue'>(土)</font>| - | - | - |
| 12/17 <font color='red'>(日)</font>| - | - | - |
| 12/18 <font color='black'>(月)</font>| - | - | - |
| 12/19 <font color='black'>(火)</font>| - | - | - |
| 12/20 <font color='black'>(水)</font>| - | - | - |
| 12/21 <font color='black'>(木)</font>| - | - | - |
| 12/22 <font color='black'>(金)</font>| - | - | - |
| 12/23 <font color='blue'>(土)</font>| - | - | - |
| 12/24 <font color='red'>(日)</font>| - | - | - |
| 12/25 <font color='black'>(月)</font>| - | - | - |
| 12/26 <font color='black'>(火)</font>| - | - | - |
| 12/27 <font color='black'>(水)</font>| - | - | - |
| 12/28 <font color='black'>(木)</font>| - | - | - |
| 12/29 <font color='black'>(金)</font>| - | - | - |
| 12/30 <font color='blue'>(土)</font>| - | - | - |
| 12/31 <font color='red'>(日)</font>| - | - | - |

⇓貼り付けた結果！

日付	記事タイトル	リンク１	リンク２
12/01 (金)	-	-	-
12/02 (土)	-	-	-
12/03 (日)	-	-	-
12/04 (月)	-	-	-
12/05 (火)	-	-	-
12/06 (水)	-	-	-
12/07 (木)	-	-	-
12/08 (金)	-	-	-
12/09 (土)	-	-	-
12/10 (日)	-	-	-
12/11 (月)	-	-	-
12/12 (火)	-	-	-
12/13 (水)	-	-	-
12/14 (木)	-	-	-
12/15 (金)	-	-	-
12/16 (土)	-	-	-
12/17 (日)	-	-	-
12/18 (月)	-	-	-
12/19 (火)	-	-	-
12/20 (水)	-	-	-
12/21 (木)	-	-	-
12/22 (金)	-	-	-
12/23 (土)	-	-	-
12/24 (日)	-	-	-
12/25 (月)	-	-	-
12/26 (火)	-	-	-
12/27 (水)	-	-	-
12/28 (木)	-	-	-
12/29 (金)	-	-	-
12/30 (土)	-	-	-
12/31 (日)	-	-	-

最後に

開発者ツールのコンソールはテキストエディタだ！