diff --git a/.changeset/brown-moles-juggle.md b/.changeset/brown-moles-juggle.md
new file mode 100644
index 0000000..97d4ac0
--- /dev/null
+++ b/.changeset/brown-moles-juggle.md
@@ -0,0 +1,5 @@
+---
+"notion-to-jsx": patch
+---
+
+Add word break properties to link text
diff --git a/apps/renderer-storybook/src/sample-data/notionBlocks.json b/apps/renderer-storybook/src/sample-data/notionBlocks.json
index 52d94be..1c526f2 100644
--- a/apps/renderer-storybook/src/sample-data/notionBlocks.json
+++ b/apps/renderer-storybook/src/sample-data/notionBlocks.json
@@ -1,13 +1,13 @@
[
{
"object": "block",
- "id": "3e62523e-fb39-402a-8482-b1f652608c04",
+ "id": "1399c6bf-2b17-808a-8dbe-e828b4a00702",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T06:36:00.000Z",
- "last_edited_time": "2024-05-05T08:42:00.000Z",
+ "created_time": "2024-11-09T12:12:00.000Z",
+ "last_edited_time": "2024-11-09T14:18:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -25,7 +25,7 @@
{
"type": "text",
"text": {
- "content": "회사에서 열심히 개발하다 보면 공통으로 요구하는 사항이 있다. 이러한 공통 요구 사항을 커스텀 훅으로 개발한 것 중 뒤로가기와 관련된 커스텀 훅 개발 경험을 공유해본다~!",
+ "content": "얼마 전에 Notion 관련 유틸을 만들면서 npm에 라이브러리를 배포했는데, 수동으로 버전 관리를 하는 것이 번거로웠다. 그래서 이를 해결하기 위해 changeset과 GitHub Action을 도입하게 되었다.\n한글로 된 포스팅이 많지 않아, 이번 기회에 공유하고자 한다.",
"link": null
},
"annotations": {
@@ -36,7 +36,7 @@
"code": false,
"color": "default"
},
- "plain_text": "회사에서 열심히 개발하다 보면 공통으로 요구하는 사항이 있다. 이러한 공통 요구 사항을 커스텀 훅으로 개발한 것 중 뒤로가기와 관련된 커스텀 훅 개발 경험을 공유해본다~!",
+ "plain_text": "얼마 전에 Notion 관련 유틸을 만들면서 npm에 라이브러리를 배포했는데, 수동으로 버전 관리를 하는 것이 번거로웠다. 그래서 이를 해결하기 위해 changeset과 GitHub Action을 도입하게 되었다.\n한글로 된 포스팅이 많지 않아, 이번 기회에 공유하고자 한다.",
"href": null
}
],
@@ -45,13 +45,13 @@
},
{
"object": "block",
- "id": "38dffc8b-ffe7-4aa9-ae67-22a3919aeea4",
+ "id": "1399c6bf-2b17-800f-8043-edb0e4cdfba8",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T06:48:00.000Z",
- "last_edited_time": "2024-05-03T10:24:00.000Z",
+ "created_time": "2024-11-09T12:19:00.000Z",
+ "last_edited_time": "2024-11-09T12:19:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -63,13 +63,13 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
+ "type": "heading_2",
+ "heading_2": {
"rich_text": [
{
"type": "text",
"text": {
- "content": "커스텀 훅마다 JSdoc으로 파일 상단에 간단한 설명을 적었다.",
+ "content": "버전 관리",
"link": null
},
"annotations": {
@@ -80,22 +80,23 @@
"code": false,
"color": "default"
},
- "plain_text": "커스텀 훅마다 JSdoc으로 파일 상단에 간단한 설명을 적었다.",
+ "plain_text": "버전 관리",
"href": null
}
],
+ "is_toggleable": false,
"color": "default"
}
},
{
"object": "block",
- "id": "13c560cb-d734-44e4-b169-f56299bb09e2",
+ "id": "1399c6bf-2b17-80a1-80a9-e690b781bb6c",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T06:40:00.000Z",
- "last_edited_time": "2024-05-03T06:42:00.000Z",
+ "created_time": "2024-11-09T12:19:00.000Z",
+ "last_edited_time": "2024-11-09T12:19:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -107,13 +108,13 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "heading_2",
- "heading_2": {
+ "type": "heading_3",
+ "heading_3": {
"rich_text": [
{
"type": "text",
"text": {
- "content": "useAppointedGoBack",
+ "content": "Semver",
"link": null
},
"annotations": {
@@ -124,7 +125,7 @@
"code": false,
"color": "default"
},
- "plain_text": "useAppointedGoBack",
+ "plain_text": "Semver",
"href": null
}
],
@@ -134,13 +135,13 @@
},
{
"object": "block",
- "id": "1c8143aa-eb07-41e4-88a8-216678f4de13",
+ "id": "1399c6bf-2b17-80ca-a76d-e0c47863d66e",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T06:40:00.000Z",
- "last_edited_time": "2024-05-03T08:00:00.000Z",
+ "created_time": "2024-11-09T12:19:00.000Z",
+ "last_edited_time": "2024-11-09T14:25:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -152,14 +153,13 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "code",
- "code": {
- "caption": [],
+ "type": "paragraph",
+ "paragraph": {
"rich_text": [
{
"type": "text",
"text": {
- "content": "import { useCallback, useEffect } from 'react';\n\nimport { useRouter } from 'next/router';\n\n/**\n * 현재 페이지에서 뒤로가기 시 지정된 url로 뒤로가기합니다.\n *\n * 앱 네이티브 Back은 useEffect로 처리합니다. \n * 웹 헤더의 Back 경우, 해당 버튼 onClick에 goBack를 할당하면 됩니다.\n *\n * @param {string} url\n * @returns {function: void}\n */\n\nconst useAppointedGoBack = (url: string) => {\n const router = useRouter();\n const goBack = useCallback(() => {\n router.back();\n }, [router]);\n\n useEffect(() => {\n router.beforePopState(() => {\n router.replace(url);\n return false;\n });\n\n return () => {\n router.beforePopState(() => true);\n };\n }, [router, url]);\n\n return goBack;\n};\n\nexport default useAppointedGoBack;",
+ "content": "Semver(Semantic Versioning)는 버전 번호를 의미 있게 관리하기 위한 규칙으로, ",
"link": null
},
"annotations": {
@@ -170,40 +170,13 @@
"code": false,
"color": "default"
},
- "plain_text": "import { useCallback, useEffect } from 'react';\n\nimport { useRouter } from 'next/router';\n\n/**\n * 현재 페이지에서 뒤로가기 시 지정된 url로 뒤로가기합니다.\n *\n * 앱 네이티브 Back은 useEffect로 처리합니다. \n * 웹 헤더의 Back 경우, 해당 버튼 onClick에 goBack를 할당하면 됩니다.\n *\n * @param {string} url\n * @returns {function: void}\n */\n\nconst useAppointedGoBack = (url: string) => {\n const router = useRouter();\n const goBack = useCallback(() => {\n router.back();\n }, [router]);\n\n useEffect(() => {\n router.beforePopState(() => {\n router.replace(url);\n return false;\n });\n\n return () => {\n router.beforePopState(() => true);\n };\n }, [router, url]);\n\n return goBack;\n};\n\nexport default useAppointedGoBack;",
+ "plain_text": "Semver(Semantic Versioning)는 버전 번호를 의미 있게 관리하기 위한 규칙으로, ",
"href": null
- }
- ],
- "language": "typescript"
- }
- },
- {
- "object": "block",
- "id": "eb7ee184-5b84-451d-92af-712dad0555da",
- "parent": {
- "type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
- },
- "created_time": "2024-05-03T06:43:00.000Z",
- "last_edited_time": "2024-05-03T10:25:00.000Z",
- "created_by": {
- "object": "user",
- "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
- },
- "last_edited_by": {
- "object": "user",
- "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
- },
- "has_children": false,
- "archived": false,
- "in_trash": false,
- "type": "paragraph",
- "paragraph": {
- "rich_text": [
+ },
{
"type": "text",
"text": {
- "content": "useAppointedGoBack",
+ "content": "주.부.수",
"link": null
},
"annotations": {
@@ -214,13 +187,13 @@
"code": true,
"color": "default"
},
- "plain_text": "useAppointedGoBack",
+ "plain_text": "주.부.수",
"href": null
},
{
"type": "text",
"text": {
- "content": " 은 뒤로가기 시 지정한 곳으로 뒤로 갈 수 있는 커스텀 훅이다.\nPage [A] → Page [B] → Page [C] 처럼 이어지는 플로우에서 예를 들면 Page [C]에서 뒤로가기 시 Page [B]가 아니라 Page [A] 혹은 플로우에 없는 아예 다른 페이지로 이동하고 싶은 요구사항이 종종 있다.\n이러한 요구사항을 해결할 수 있는 커스텀 훅이다.",
+ "content": " 형식으로 표현된다.",
"link": null
},
"annotations": {
@@ -231,7 +204,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 은 뒤로가기 시 지정한 곳으로 뒤로 갈 수 있는 커스텀 훅이다.\nPage [A] → Page [B] → Page [C] 처럼 이어지는 플로우에서 예를 들면 Page [C]에서 뒤로가기 시 Page [B]가 아니라 Page [A] 혹은 플로우에 없는 아예 다른 페이지로 이동하고 싶은 요구사항이 종종 있다.\n이러한 요구사항을 해결할 수 있는 커스텀 훅이다.",
+ "plain_text": " 형식으로 표현된다.",
"href": null
}
],
@@ -240,13 +213,13 @@
},
{
"object": "block",
- "id": "e7001c94-8fdd-474b-9610-764b91e23885",
+ "id": "1399c6bf-2b17-80f8-a064-cec3758f0efb",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T06:56:00.000Z",
- "last_edited_time": "2024-05-03T06:57:00.000Z",
+ "created_time": "2024-11-09T14:25:00.000Z",
+ "last_edited_time": "2024-11-09T14:25:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -264,7 +237,7 @@
{
"type": "text",
"text": {
- "content": "코드를 이해하기 위해선 ",
+ "content": "주요 버전(major)은 호환되지 않는 변경 사항이 있을 때, 부 버전(minor)은 호환되는 새로운 기능이 추가될 때, 수 버전(patch)은 버그 수정 등 하위 호환 가능한 변경이 있을 때 업데이트한다.",
"link": null
},
"annotations": {
@@ -275,30 +248,40 @@
"code": false,
"color": "default"
},
- "plain_text": "코드를 이해하기 위해선 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "goBack",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "goBack",
+ "plain_text": "주요 버전(major)은 호환되지 않는 변경 사항이 있을 때, 부 버전(minor)은 호환되는 새로운 기능이 추가될 때, 수 버전(patch)은 버그 수정 등 하위 호환 가능한 변경이 있을 때 업데이트한다.",
"href": null
- },
+ }
+ ],
+ "color": "default"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8014-a833-c7544380165d",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T14:25:00.000Z",
+ "last_edited_time": "2024-11-09T14:25:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "paragraph",
+ "paragraph": {
+ "rich_text": [
{
"type": "text",
"text": {
- "content": " 함수와 ",
+ "content": "이러한 SemVer 규칙을 사용하면 버전 번호만 보고도 변경의 성격을 쉽게 파악할 수 있어 개발자와 사용자 모두에게 큰 도움이 된다.",
"link": null
},
"annotations": {
@@ -309,13 +292,40 @@
"code": false,
"color": "default"
},
- "plain_text": " 함수와 ",
+ "plain_text": "이러한 SemVer 규칙을 사용하면 버전 번호만 보고도 변경의 성격을 쉽게 파악할 수 있어 개발자와 사용자 모두에게 큰 도움이 된다.",
"href": null
- },
+ }
+ ],
+ "color": "default"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-809f-814b-d8ae3418f622",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T14:51:00.000Z",
+ "last_edited_time": "2024-11-09T14:51:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "paragraph",
+ "paragraph": {
+ "rich_text": [
{
"type": "text",
"text": {
- "content": "useEffect",
+ "content": "모든 라이브러리는 위 규칙으로 관리된다.",
"link": null
},
"annotations": {
@@ -323,16 +333,43 @@
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "useEffect",
+ "plain_text": "모든 라이브러리는 위 규칙으로 관리된다.",
"href": null
- },
+ }
+ ],
+ "color": "default"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-803b-b80d-e5c164eb72ce",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T12:21:00.000Z",
+ "last_edited_time": "2024-11-09T14:17:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "heading_2",
+ "heading_2": {
+ "rich_text": [
{
"type": "text",
"text": {
- "content": " 안에 있는 로직을 이해하면 된다.",
+ "content": "changeset",
"link": null
},
"annotations": {
@@ -343,22 +380,23 @@
"code": false,
"color": "default"
},
- "plain_text": " 안에 있는 로직을 이해하면 된다.",
+ "plain_text": "changeset",
"href": null
}
],
+ "is_toggleable": false,
"color": "default"
}
},
{
"object": "block",
- "id": "fb8a9c72-38ee-4e64-af36-b6a824afd31d",
+ "id": "1399c6bf-2b17-80b9-bad1-dc006f7889a4",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T06:57:00.000Z",
- "last_edited_time": "2024-05-03T06:57:00.000Z",
+ "created_time": "2024-11-09T12:24:00.000Z",
+ "last_edited_time": "2024-11-09T12:24:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -370,13 +408,13 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
+ "type": "quote",
+ "quote": {
"rich_text": [
{
"type": "text",
"text": {
- "content": "goBack",
+ "content": "A tool to manage versioning and changelogs with a focus on multi-package repositories",
"link": null
},
"annotations": {
@@ -384,10 +422,10 @@
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "goBack",
+ "plain_text": "A tool to manage versioning and changelogs with a focus on multi-package repositories",
"href": null
}
],
@@ -396,13 +434,38 @@
},
{
"object": "block",
- "id": "33c3bbd2-b875-46d4-9090-9894efbfc032",
+ "id": "1399c6bf-2b17-801b-a2b1-cc5d6a5b626a",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T12:25:00.000Z",
+ "last_edited_time": "2025-04-13T13:59:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "553d6fc6-e170-4227-8810-0540e2142f82"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "link_preview",
+ "link_preview": {
+ "url": "https://github.com/changesets/changesets"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8087-a9fd-d2c032d4b326",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T06:57:00.000Z",
- "last_edited_time": "2024-05-03T07:55:00.000Z",
+ "created_time": "2024-11-09T12:25:00.000Z",
+ "last_edited_time": "2024-11-09T14:17:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -414,14 +477,13 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "code",
- "code": {
- "caption": [],
+ "type": "paragraph",
+ "paragraph": {
"rich_text": [
{
"type": "text",
"text": {
- "content": " const goBack = useCallback(() => {\n router.back();\n }, [router]);",
+ "content": "changeset은 코드 변경 사항을 기록하고, 이를 기반으로 패키지의 버전을 효율적으로 관리할 수 있게 해주는 도구이다. 보통 라이브러리나 모노레포(monorepo) 환경에서 많이 사용되며, 여러 패키지의 변경 사항을 관리하거나 여러 개발자가 협업하는 상황에서 특히 유용하다.",
"link": null
},
"annotations": {
@@ -432,22 +494,22 @@
"code": false,
"color": "default"
},
- "plain_text": " const goBack = useCallback(() => {\n router.back();\n }, [router]);",
+ "plain_text": "changeset은 코드 변경 사항을 기록하고, 이를 기반으로 패키지의 버전을 효율적으로 관리할 수 있게 해주는 도구이다. 보통 라이브러리나 모노레포(monorepo) 환경에서 많이 사용되며, 여러 패키지의 변경 사항을 관리하거나 여러 개발자가 협업하는 상황에서 특히 유용하다.",
"href": null
}
],
- "language": "typescript"
+ "color": "default"
}
},
{
"object": "block",
- "id": "36a9a980-8a9b-41c6-b62b-909e16051269",
+ "id": "1399c6bf-2b17-801a-86e5-c0ce6809930e",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T06:57:00.000Z",
- "last_edited_time": "2024-05-03T10:25:00.000Z",
+ "created_time": "2024-11-09T12:27:00.000Z",
+ "last_edited_time": "2024-11-09T14:17:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -465,7 +527,7 @@
{
"type": "text",
"text": {
- "content": "간단한 함수다. ",
+ "content": "changeset의 장점 중 하나는 ",
"link": null
},
"annotations": {
@@ -476,30 +538,30 @@
"code": false,
"color": "default"
},
- "plain_text": "간단한 함수다. ",
+ "plain_text": "changeset의 장점 중 하나는 ",
"href": null
},
{
"type": "text",
"text": {
- "content": "goBack",
+ "content": "다중 패키지 관리",
"link": null
},
"annotations": {
- "bold": false,
+ "bold": true,
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "goBack",
+ "plain_text": "다중 패키지 관리",
"href": null
},
{
"type": "text",
"text": {
- "content": " 함수를 실행하면 기본적인 뒤로가기를 수행한다.\n기본 동작이라 ",
+ "content": "를 쉽게 할 수 있다는 점이다.\n모노레포에서는 여러 패키지가 하나의 저장소에 포함되어 있어 각 패키지의 변경 사항을 관리하는 것이 까다로울 수 있는데, changeset은 이를 간단하게 만들어 준다.\n또한 ",
"link": null
},
"annotations": {
@@ -510,30 +572,30 @@
"code": false,
"color": "default"
},
- "plain_text": " 함수를 실행하면 기본적인 뒤로가기를 수행한다.\n기본 동작이라 ",
+ "plain_text": "를 쉽게 할 수 있다는 점이다.\n모노레포에서는 여러 패키지가 하나의 저장소에 포함되어 있어 각 패키지의 변경 사항을 관리하는 것이 까다로울 수 있는데, changeset은 이를 간단하게 만들어 준다.\n또한 ",
"href": null
},
{
"type": "text",
"text": {
- "content": "useAppointedGoBack",
+ "content": "GitHub와의 통합",
"link": null
},
"annotations": {
- "bold": false,
+ "bold": true,
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "useAppointedGoBack",
+ "plain_text": "GitHub와의 통합",
"href": null
},
{
"type": "text",
"text": {
- "content": " 를 사용하는 페이지에서 ",
+ "content": "을 통해 CI/CD 파이프라인에서 자동으로 버전 관리 및 배포 과정을 수행할 수 있어, 개발자들이 수동으로 버전을 관리하는 번거로움을 줄여준다.",
"link": null
},
"annotations": {
@@ -544,13 +606,40 @@
"code": false,
"color": "default"
},
- "plain_text": " 를 사용하는 페이지에서 ",
+ "plain_text": "을 통해 CI/CD 파이프라인에서 자동으로 버전 관리 및 배포 과정을 수행할 수 있어, 개발자들이 수동으로 버전을 관리하는 번거로움을 줄여준다.",
"href": null
- },
+ }
+ ],
+ "color": "default"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-804e-8710-ec7dcfe2cf9a",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T12:31:00.000Z",
+ "last_edited_time": "2024-11-09T14:52:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "heading_3",
+ "heading_3": {
+ "rich_text": [
{
"type": "text",
"text": {
- "content": "goBack",
+ "content": "사용 방법",
"link": null
},
"annotations": {
@@ -558,16 +647,44 @@
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "goBack",
+ "plain_text": "사용 방법",
"href": null
- },
+ }
+ ],
+ "is_toggleable": false,
+ "color": "default"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-809f-8ef9-c9c1c29d210e",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T12:31:00.000Z",
+ "last_edited_time": "2024-11-09T14:26:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "paragraph",
+ "paragraph": {
+ "rich_text": [
{
"type": "text",
"text": {
- "content": " 를 따로 사용하지 않아도 무방하지만, 응집성을 이유로 넣어놨다. (뒤로가기 수행은 페이지 내에서 처리하고 지정된 페이지로 이동은 이 훅에서 처리하면 헷갈릴 수도..)",
+ "content": "changeset을 프로젝트에 설정하는 과정은 비교적 간단하다. 다음 단계들을 통해 changeset을 설정할 수 있다. (pnpm 기준으로 설명한다! npm, yarn과 별다른 차이는 없다)",
"link": null
},
"annotations": {
@@ -578,7 +695,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 를 따로 사용하지 않아도 무방하지만, 응집성을 이유로 넣어놨다. (뒤로가기 수행은 페이지 내에서 처리하고 지정된 페이지로 이동은 이 훅에서 처리하면 헷갈릴 수도..)",
+ "plain_text": "changeset을 프로젝트에 설정하는 과정은 비교적 간단하다. 다음 단계들을 통해 changeset을 설정할 수 있다. (pnpm 기준으로 설명한다! npm, yarn과 별다른 차이는 없다)",
"href": null
}
],
@@ -587,13 +704,13 @@
},
{
"object": "block",
- "id": "9343e494-b73a-4648-9f57-108d55ed8054",
+ "id": "1399c6bf-2b17-804a-860d-e1a5331bb050",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T10:08:00.000Z",
- "last_edited_time": "2024-05-03T10:08:00.000Z",
+ "created_time": "2024-11-09T14:36:00.000Z",
+ "last_edited_time": "2024-11-09T14:37:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -611,24 +728,24 @@
{
"type": "text",
"text": {
- "content": "useEffect",
+ "content": "1. changeset 설치",
"link": null
},
"annotations": {
- "bold": false,
+ "bold": true,
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "useEffect",
+ "plain_text": "1. changeset 설치",
"href": null
},
{
"type": "text",
"text": {
- "content": " 내부",
+ "content": ": 먼저 프로젝트에 changeset을 설치해야 한다. pnpm을 사용해 changeset을 설치할 수 있다.",
"link": null
},
"annotations": {
@@ -639,7 +756,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 내부",
+ "plain_text": ": 먼저 프로젝트에 changeset을 설치해야 한다. pnpm을 사용해 changeset을 설치할 수 있다.",
"href": null
}
],
@@ -648,13 +765,13 @@
},
{
"object": "block",
- "id": "717cd1d9-9014-45c7-9833-e84c140ed10f",
+ "id": "1399c6bf-2b17-80ca-aea1-d35271303ad9",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T07:56:00.000Z",
- "last_edited_time": "2024-05-03T07:56:00.000Z",
+ "created_time": "2024-11-09T12:32:00.000Z",
+ "last_edited_time": "2024-11-09T14:36:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -673,7 +790,7 @@
{
"type": "text",
"text": {
- "content": " useEffect(() => {\n router.beforePopState(() => {\n router.replace(url);\n return false;\n });\n\n return () => {\n router.beforePopState(() => true);\n };\n }, [router, url]);",
+ "content": "pnpm add -D @changesets/cli",
"link": null
},
"annotations": {
@@ -684,22 +801,22 @@
"code": false,
"color": "default"
},
- "plain_text": " useEffect(() => {\n router.beforePopState(() => {\n router.replace(url);\n return false;\n });\n\n return () => {\n router.beforePopState(() => true);\n };\n }, [router, url]);",
+ "plain_text": "pnpm add -D @changesets/cli",
"href": null
}
],
- "language": "typescript"
+ "language": "bash"
}
},
{
"object": "block",
- "id": "101e2d59-de7a-47dd-ba0a-d1cf1e81dbf1",
+ "id": "1399c6bf-2b17-8027-bd7e-f25e9a6e4080",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T07:56:00.000Z",
- "last_edited_time": "2024-05-03T10:26:00.000Z",
+ "created_time": "2024-11-09T12:32:00.000Z",
+ "last_edited_time": "2024-11-09T14:36:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -717,41 +834,7 @@
{
"type": "text",
"text": {
- "content": "먼저 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "먼저 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "beforePopState",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "beforePopState",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 를 알아야 하는데 뒤로가기를 클릭하면 아래와 같은 기능이 수행된다.",
+ "content": "설치 후, changeset을 초기화한다.",
"link": null
},
"annotations": {
@@ -762,7 +845,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 를 알아야 하는데 뒤로가기를 클릭하면 아래와 같은 기능이 수행된다.",
+ "plain_text": "설치 후, changeset을 초기화한다.",
"href": null
}
],
@@ -771,13 +854,13 @@
},
{
"object": "block",
- "id": "299e6121-3265-42be-a727-5a32a859011d",
+ "id": "1399c6bf-2b17-8056-99ca-fd9b260ac977",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T07:58:00.000Z",
- "last_edited_time": "2024-05-03T10:27:00.000Z",
+ "created_time": "2024-11-09T12:32:00.000Z",
+ "last_edited_time": "2024-11-09T14:52:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -789,149 +872,14 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
- "rich_text": [
- {
- "type": "text",
- "text": {
- "content": "뒤로가기 버튼 클릭 → 브라우저 주소 변경 (히스토리는 하나 줄었음) → ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "뒤로가기 버튼 클릭 → 브라우저 주소 변경 (히스토리는 하나 줄었음) → ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "router.beforePopState",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "router.beforePopState",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 실행 → ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 실행 → ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "router.beforePopState",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "router.beforePopState",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 함수가 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 함수가 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "false",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "false",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 를 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 를 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "return",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "return",
- "href": null
- },
+ "type": "code",
+ "code": {
+ "caption": [],
+ "rich_text": [
{
"type": "text",
"text": {
- "content": " 하면 주소만 변경되고 실제로 화면을 이동하지 않음",
+ "content": "pnpm changeset init",
"link": null
},
"annotations": {
@@ -942,22 +890,22 @@
"code": false,
"color": "default"
},
- "plain_text": " 하면 주소만 변경되고 실제로 화면을 이동하지 않음",
+ "plain_text": "pnpm changeset init",
"href": null
}
],
- "color": "default"
+ "language": "bash"
}
},
{
"object": "block",
- "id": "1aae50e1-0ae3-40ba-8d04-b4f5744d7e1b",
+ "id": "1399c6bf-2b17-8000-8e40-e79d2340a134",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T07:58:00.000Z",
- "last_edited_time": "2024-05-03T10:28:00.000Z",
+ "created_time": "2024-11-09T12:32:00.000Z",
+ "last_edited_time": "2024-11-09T14:37:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -975,41 +923,7 @@
{
"type": "text",
"text": {
- "content": "위 특성을 활용하여 Page [A] → Page [B] → Page [C] 인 케이스에서 Page [C]에서 뒤로가기 시 Page [A]로 이동하고 싶다면 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "위 특성을 활용하여 Page [A] → Page [B] → Page [C] 인 케이스에서 Page [C]에서 뒤로가기 시 Page [A]로 이동하고 싶다면 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "url",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "url",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 에 Page [A]를 할당하고 뒤로가기 버튼 클릭 시 ",
+ "content": "이 명령을 실행하면 프로젝트 루트에 ",
"link": null
},
"annotations": {
@@ -1020,13 +934,13 @@
"code": false,
"color": "default"
},
- "plain_text": " 에 Page [A]를 할당하고 뒤로가기 버튼 클릭 시 ",
+ "plain_text": "이 명령을 실행하면 프로젝트 루트에 ",
"href": null
},
{
"type": "text",
"text": {
- "content": "goBack",
+ "content": ".changeset",
"link": null
},
"annotations": {
@@ -1037,13 +951,13 @@
"code": true,
"color": "default"
},
- "plain_text": "goBack",
+ "plain_text": ".changeset",
"href": null
},
{
"type": "text",
"text": {
- "content": " 함수를 실행하도록 해주면 된다.",
+ "content": " 폴더가 생성되고, 기본적인 설정 파일들이 만들어진다.",
"link": null
},
"annotations": {
@@ -1054,7 +968,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 함수를 실행하도록 해주면 된다.",
+ "plain_text": " 폴더가 생성되고, 기본적인 설정 파일들이 만들어진다.",
"href": null
}
],
@@ -1063,13 +977,13 @@
},
{
"object": "block",
- "id": "f33298b6-0e5b-4ed8-a0cf-9e0a9da634a0",
+ "id": "1399c6bf-2b17-808e-84f1-cb33cc23b310",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:05:00.000Z",
- "last_edited_time": "2024-05-03T08:07:00.000Z",
+ "created_time": "2024-11-09T14:37:00.000Z",
+ "last_edited_time": "2024-11-09T14:37:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1087,41 +1001,24 @@
{
"type": "text",
"text": {
- "content": "그럼 Page [A] → Page [B] → Page [C] 인 케이스에서 Page [C]에서 뒤로가기 시 Page [B]로 주소가 이동되고 ",
+ "content": "2. 변경 사항 기록하기",
"link": null
},
"annotations": {
- "bold": false,
+ "bold": true,
"italic": false,
"strikethrough": false,
"underline": false,
"code": false,
"color": "default"
},
- "plain_text": "그럼 Page [A] → Page [B] → Page [C] 인 케이스에서 Page [C]에서 뒤로가기 시 Page [B]로 주소가 이동되고 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "router.beforePopState",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "router.beforePopState",
+ "plain_text": "2. 변경 사항 기록하기",
"href": null
},
{
"type": "text",
"text": {
- "content": " 의 callback이 실행되면서 Page [B]가 Page [A]로 replace된다.",
+ "content": ": 새로운 기능 추가나 버그 수정 등의 변경 사항이 있을 때, changeset을 통해 변경 사항을 기록한다.",
"link": null
},
"annotations": {
@@ -1132,7 +1029,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 의 callback이 실행되면서 Page [B]가 Page [A]로 replace된다.",
+ "plain_text": ": 새로운 기능 추가나 버그 수정 등의 변경 사항이 있을 때, changeset을 통해 변경 사항을 기록한다.",
"href": null
}
],
@@ -1141,13 +1038,13 @@
},
{
"object": "block",
- "id": "7f089d80-20c8-47d9-a27e-6fab2f616946",
+ "id": "1399c6bf-2b17-80d4-8d4d-ddb29064bae6",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T07:12:00.000Z",
- "last_edited_time": "2024-05-03T07:12:00.000Z",
+ "created_time": "2024-11-09T12:32:00.000Z",
+ "last_edited_time": "2024-11-09T14:37:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1159,13 +1056,14 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "heading_3",
- "heading_3": {
+ "type": "code",
+ "code": {
+ "caption": [],
"rich_text": [
{
"type": "text",
"text": {
- "content": "replace를 사용한 이유",
+ "content": "pnpm changeset",
"link": null
},
"annotations": {
@@ -1176,23 +1074,22 @@
"code": false,
"color": "default"
},
- "plain_text": "replace를 사용한 이유",
+ "plain_text": "pnpm changeset",
"href": null
}
],
- "is_toggleable": false,
- "color": "default"
+ "language": "bash"
}
},
{
"object": "block",
- "id": "27c18c99-045d-45b3-9cd0-748d5d6158be",
+ "id": "1399c6bf-2b17-8011-ad66-e8416bec259c",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T07:09:00.000Z",
- "last_edited_time": "2024-05-03T10:29:00.000Z",
+ "created_time": "2024-11-09T12:32:00.000Z",
+ "last_edited_time": "2024-11-09T14:37:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1210,7 +1107,7 @@
{
"type": "text",
"text": {
- "content": "결과적으로 Page [A] → Page [B] → Page [C] 인 케이스에서 Page [C]에서 뒤로가기 시 Page [A]로 이동하면 히스토리는 Page [A] → Page [A]가 된다. 지정된 페이지로 이동하긴 했지만, 히스토리가 약간 이상해 보일 수도 있다.",
+ "content": "이 명령을 실행하면 아래 사진과 같이 변경의 유형(major, minor, patch)과 변경된 패키지에 대해 설명을 입력하는 인터페이스가 나타난다. 이를 통해 변경 사항을 문서화할 수 있다.",
"link": null
},
"annotations": {
@@ -1221,7 +1118,7 @@
"code": false,
"color": "default"
},
- "plain_text": "결과적으로 Page [A] → Page [B] → Page [C] 인 케이스에서 Page [C]에서 뒤로가기 시 Page [A]로 이동하면 히스토리는 Page [A] → Page [A]가 된다. 지정된 페이지로 이동하긴 했지만, 히스토리가 약간 이상해 보일 수도 있다.",
+ "plain_text": "이 명령을 실행하면 아래 사진과 같이 변경의 유형(major, minor, patch)과 변경된 패키지에 대해 설명을 입력하는 인터페이스가 나타난다. 이를 통해 변경 사항을 문서화할 수 있다.",
"href": null
}
],
@@ -1230,13 +1127,118 @@
},
{
"object": "block",
- "id": "b039fa83-cfda-42ea-ad9c-eb0a43ab5056",
+ "id": "1399c6bf-2b17-80c7-a4f7-f91da99aeca1",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T12:36:00.000Z",
+ "last_edited_time": "2024-11-09T14:37:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2Fb9b51852-66bc-4b72-98ca-a28928ac3fc0%2Fimage.png?table=block&id=1399c6bf-2b17-80c7-a4f7-f91da99aeca1&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.677Z"
+ },
+ "format": {
+ "block_width": 393,
+ "block_height": 116,
+ "block_aspect_ratio": 3.3879310344827585
+ }
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8091-b9fb-fb10f21b4526",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T12:36:00.000Z",
+ "last_edited_time": "2024-11-09T14:37:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2Fd5010257-2bcb-49a3-ba8a-c7560b5d1060%2Fimage.png?table=block&id=1399c6bf-2b17-8091-b9fb-fb10f21b4526&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.700Z"
+ },
+ "format": {
+ "block_width": 874,
+ "block_height": 263,
+ "block_aspect_ratio": 3.32319391634981
+ }
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8044-8dfd-dfbbe359d987",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T12:38:00.000Z",
+ "last_edited_time": "2024-11-09T14:37:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2F8df2da0b-0c0a-46ce-9747-014f1a334fcd%2Fimage.png?table=block&id=1399c6bf-2b17-8044-8dfd-dfbbe359d987&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.674Z"
+ },
+ "format": {
+ "block_width": 577,
+ "block_height": 198,
+ "block_aspect_ratio": 2.914141414141414
+ }
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8010-88e7-cac491e155d5",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T07:09:00.000Z",
- "last_edited_time": "2024-05-03T10:29:00.000Z",
+ "created_time": "2024-11-09T12:38:00.000Z",
+ "last_edited_time": "2024-11-09T14:54:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1254,7 +1256,7 @@
{
"type": "text",
"text": {
- "content": "구현은 여러 가지 방법이 있겠지만 일단 이렇게 로직을 짠 이유는 요구사항이 그렇기 때문이다.",
+ "content": "변경사항이 임의의 파일명을 가진 md에 기록되었다.",
"link": null
},
"annotations": {
@@ -1265,7 +1267,7 @@
"code": false,
"color": "default"
},
- "plain_text": "구현은 여러 가지 방법이 있겠지만 일단 이렇게 로직을 짠 이유는 요구사항이 그렇기 때문이다.",
+ "plain_text": "변경사항이 임의의 파일명을 가진 md에 기록되었다.",
"href": null
}
],
@@ -1274,13 +1276,13 @@
},
{
"object": "block",
- "id": "51b70424-b10b-4a22-97da-3855c51328cd",
+ "id": "1399c6bf-2b17-8005-9fe9-e2f4c5a52160",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T07:27:00.000Z",
- "last_edited_time": "2024-05-03T10:30:00.000Z",
+ "created_time": "2024-11-09T12:32:00.000Z",
+ "last_edited_time": "2024-11-09T14:54:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1298,24 +1300,7 @@
{
"type": "text",
"text": {
- "content": "기획자가 사용자에게 기대하는 플로우는 Page [A] → Page [B] → Page [C] → Page [A] 인데 Page [B] 또는 Page [C] 에서 뒤로가기를 할 수 있어서 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "기획자가 사용자에게 기대하는 플로우는 Page [A] → Page [B] → Page [C] → Page [A] 인데 Page [B] 또는 Page [C] 에서 뒤로가기를 할 수 있어서 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "Page [B] 또는 Page [C] 에서 뒤로가기 할 때 원래 이동해야 할 페이지로 이동해주세요 ",
+ "content": "3. 버전 업데이트 및 변경 로그 생성",
"link": null
},
"annotations": {
@@ -1326,13 +1311,13 @@
"code": false,
"color": "default"
},
- "plain_text": "Page [B] 또는 Page [C] 에서 뒤로가기 할 때 원래 이동해야 할 페이지로 이동해주세요 ",
+ "plain_text": "3. 버전 업데이트 및 변경 로그 생성",
"href": null
},
{
"type": "text",
"text": {
- "content": "라는 요구사항이 발생한 것이다.",
+ "content": ": 모든 변경 사항이 기록되면, changeset은 이를 기반으로 버전을 업데이트하고 변경 로그를 생성한다. 로컬에서 수동으로 실행할 경우 다음 명령을 사용한다.",
"link": null
},
"annotations": {
@@ -1343,7 +1328,7 @@
"code": false,
"color": "default"
},
- "plain_text": "라는 요구사항이 발생한 것이다.",
+ "plain_text": ": 모든 변경 사항이 기록되면, changeset은 이를 기반으로 버전을 업데이트하고 변경 로그를 생성한다. 로컬에서 수동으로 실행할 경우 다음 명령을 사용한다.",
"href": null
}
],
@@ -1352,13 +1337,13 @@
},
{
"object": "block",
- "id": "dd8a3cd0-d1fb-4899-9b50-5325f3cd16f2",
+ "id": "1399c6bf-2b17-80c9-b951-c965738ca15f",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:10:00.000Z",
- "last_edited_time": "2024-05-03T10:30:00.000Z",
+ "created_time": "2024-11-09T12:32:00.000Z",
+ "last_edited_time": "2024-11-09T14:41:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1370,30 +1355,14 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "callout",
- "callout": {
- "rich_text": [
- {
- "type": "text",
- "text": {
- "content": "왜 이런 요구사항이 발생할까?\n\n",
- "link": null
- },
- "annotations": {
- "bold": true,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "왜 이런 요구사항이 발생할까?\n\n",
- "href": null
- },
+ "type": "code",
+ "code": {
+ "caption": [],
+ "rich_text": [
{
"type": "text",
"text": {
- "content": "예를 들어 신용 올리기의 경우, [신용 메인 → 신용 올리기 인트로 → 신용 올리기 로딩(요청 중) → 신용 올리기 결과 → 신용 메인]으로 플로우가 이루어진다.\n\n신용 올리기는 일주일에 한 번만 할 수 있는 룰이 있는데, 뒤로 가기 했을 때 신용 올리기 로딩(요청 중)으로 이동 가능하다면 계속 신용 올리기 요청을 할 수 있어서 뒤로 가기 시 신용 올리기 로딩으로 가는 것을 막아야 한다.",
+ "content": "pnpm changeset version",
"link": null
},
"annotations": {
@@ -1404,26 +1373,57 @@
"code": false,
"color": "default"
},
- "plain_text": "예를 들어 신용 올리기의 경우, [신용 메인 → 신용 올리기 인트로 → 신용 올리기 로딩(요청 중) → 신용 올리기 결과 → 신용 메인]으로 플로우가 이루어진다.\n\n신용 올리기는 일주일에 한 번만 할 수 있는 룰이 있는데, 뒤로 가기 했을 때 신용 올리기 로딩(요청 중)으로 이동 가능하다면 계속 신용 올리기 요청을 할 수 있어서 뒤로 가기 시 신용 올리기 로딩으로 가는 것을 막아야 한다.",
+ "plain_text": "pnpm changeset version",
"href": null
}
],
- "icon": {
- "type": "emoji",
- "emoji": "❓"
+ "language": "bash"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-806d-8581-ff3f4505e61c",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T12:43:00.000Z",
+ "last_edited_time": "2024-11-09T14:41:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2F466b6f64-7855-437b-9c8f-d60626376894%2F%25E1%2584%2589%25E1%2585%25B3%25E1%2584%258F%25E1%2585%25B3%25E1%2584%2585%25E1%2585%25B5%25E1%2586%25AB%25E1%2584%2589%25E1%2585%25A3%25E1%2586%25BA_2024-11-09_%25E1%2584%258B%25E1%2585%25A9%25E1%2584%2592%25E1%2585%25AE_9.40.41.png?table=block&id=1399c6bf-2b17-806d-8581-ff3f4505e61c&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.648Z"
},
- "color": "gray_background"
+ "format": {
+ "block_width": 823,
+ "block_height": 220,
+ "block_aspect_ratio": 3.7409090909090907
+ }
}
},
{
"object": "block",
- "id": "135e7a1d-851e-4079-a811-a6fa5a6291bb",
+ "id": "1399c6bf-2b17-80bc-92fd-de420f1cac1d",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:10:00.000Z",
- "last_edited_time": "2024-05-03T10:30:00.000Z",
+ "created_time": "2024-11-09T12:43:00.000Z",
+ "last_edited_time": "2024-11-09T14:41:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1435,39 +1435,30 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
- "rich_text": [
- {
- "type": "text",
- "text": {
- "content": "replace를 사용하면 현재 위치한 곳을 말 그대로 대체해버리기 때문에 replace를 활용해서 다시 돌아가면 안 되는 페이지를 다른 페이지로 대체할 수 있었다.",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "replace를 사용하면 현재 위치한 곳을 말 그대로 대체해버리기 때문에 replace를 활용해서 다시 돌아가면 안 되는 페이지를 다른 페이지로 대체할 수 있었다.",
- "href": null
- }
- ],
- "color": "default"
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2F4184da3f-63c2-447b-bdce-c9b6f35dd996%2Fimage.png?table=block&id=1399c6bf-2b17-80bc-92fd-de420f1cac1d&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.675Z"
+ },
+ "format": {
+ "block_width": 750,
+ "block_height": 203,
+ "block_aspect_ratio": 3.6945812807881775
+ }
}
},
{
"object": "block",
- "id": "20b69b05-4171-4131-8a5e-8ed7303bd160",
+ "id": "1399c6bf-2b17-8053-b1d4-d467335f75b3",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:19:00.000Z",
- "last_edited_time": "2024-05-03T10:31:00.000Z",
+ "created_time": "2024-11-09T12:45:00.000Z",
+ "last_edited_time": "2024-11-09T14:54:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1485,7 +1476,41 @@
{
"type": "text",
"text": {
- "content": "추가로 히스토리가 Page [A] → Page [A]가 되었으니 문제가 되지 않나요? 라고 생각할 수 있다.\n이는 기능을 개발할 때 인지하고 있는 부분이고 위치 시킬 Page [A]가 되는 페이지는 해당 페이지에서 웹뷰를 종료한다거나 다른 방식의 뒤로가기를 수행하는 페이지로만 이동할 수 있게끔 기획자랑 협의가 되어있는 상태라 문제가 되지 않았다.",
+ "content": "위 커맨드를 입력하니 기존 md이 사라지고, CHANGELOG.md에 변경 사항이 버전과 함께 기록되고 ",
+ "link": null
+ },
+ "annotations": {
+ "bold": false,
+ "italic": false,
+ "strikethrough": false,
+ "underline": false,
+ "code": false,
+ "color": "default"
+ },
+ "plain_text": "위 커맨드를 입력하니 기존 md이 사라지고, CHANGELOG.md에 변경 사항이 버전과 함께 기록되고 ",
+ "href": null
+ },
+ {
+ "type": "text",
+ "text": {
+ "content": "package.json",
+ "link": null
+ },
+ "annotations": {
+ "bold": false,
+ "italic": false,
+ "strikethrough": false,
+ "underline": false,
+ "code": true,
+ "color": "default"
+ },
+ "plain_text": "package.json",
+ "href": null
+ },
+ {
+ "type": "text",
+ "text": {
+ "content": " 에 버전도 자동으로 올라갔다. ",
"link": null
},
"annotations": {
@@ -1496,7 +1521,7 @@
"code": false,
"color": "default"
},
- "plain_text": "추가로 히스토리가 Page [A] → Page [A]가 되었으니 문제가 되지 않나요? 라고 생각할 수 있다.\n이는 기능을 개발할 때 인지하고 있는 부분이고 위치 시킬 Page [A]가 되는 페이지는 해당 페이지에서 웹뷰를 종료한다거나 다른 방식의 뒤로가기를 수행하는 페이지로만 이동할 수 있게끔 기획자랑 협의가 되어있는 상태라 문제가 되지 않았다.",
+ "plain_text": " 에 버전도 자동으로 올라갔다. ",
"href": null
}
],
@@ -1505,13 +1530,13 @@
},
{
"object": "block",
- "id": "74a317b0-19c2-46c5-a4d4-3ec201799d2b",
+ "id": "1399c6bf-2b17-8091-9f47-e417987855d8",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T06:54:00.000Z",
- "last_edited_time": "2024-05-03T06:54:00.000Z",
+ "created_time": "2024-11-09T12:32:00.000Z",
+ "last_edited_time": "2024-11-09T14:41:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1523,13 +1548,30 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "heading_3",
- "heading_3": {
+ "type": "paragraph",
+ "paragraph": {
"rich_text": [
{
"type": "text",
"text": {
- "content": "사용 예시",
+ "content": "4. 배포",
+ "link": null
+ },
+ "annotations": {
+ "bold": true,
+ "italic": false,
+ "strikethrough": false,
+ "underline": false,
+ "code": false,
+ "color": "default"
+ },
+ "plain_text": "4. 배포",
+ "href": null
+ },
+ {
+ "type": "text",
+ "text": {
+ "content": ": changeset을 사용해 변경 사항을 기록하고 버전을 업데이트한 후, 다음 명령으로 배포할 수 있다.",
"link": null
},
"annotations": {
@@ -1540,23 +1582,22 @@
"code": false,
"color": "default"
},
- "plain_text": "사용 예시",
+ "plain_text": ": changeset을 사용해 변경 사항을 기록하고 버전을 업데이트한 후, 다음 명령으로 배포할 수 있다.",
"href": null
}
],
- "is_toggleable": false,
"color": "default"
}
},
{
"object": "block",
- "id": "da04e14b-3c51-4a6d-9a3b-61c6c502384a",
+ "id": "1399c6bf-2b17-805c-9f68-f7561f392b7d",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:37:00.000Z",
- "last_edited_time": "2024-05-03T10:13:00.000Z",
+ "created_time": "2024-11-09T12:49:00.000Z",
+ "last_edited_time": "2024-11-09T14:40:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1575,7 +1616,7 @@
{
"type": "text",
"text": {
- "content": "const Component = () => {\n const goBack = useAppointedGoBack('이동을 원하는 페이지 URL');\n\n ...\n \n return (\n \n )\n}",
+ "content": "pnpm changeset publish",
"link": null
},
"annotations": {
@@ -1586,22 +1627,22 @@
"code": false,
"color": "default"
},
- "plain_text": "const Component = () => {\n const goBack = useAppointedGoBack('이동을 원하는 페이지 URL');\n\n ...\n \n return (\n \n )\n}",
+ "plain_text": "pnpm changeset publish",
"href": null
}
],
- "language": "typescript"
+ "language": "bash"
}
},
{
"object": "block",
- "id": "6261ef24-b92b-49d1-a04d-22b89767739f",
+ "id": "1399c6bf-2b17-802e-a76a-d41ef36376ec",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T06:44:00.000Z",
- "last_edited_time": "2024-05-03T06:44:00.000Z",
+ "created_time": "2024-11-09T12:52:00.000Z",
+ "last_edited_time": "2024-11-09T14:41:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1613,13 +1654,13 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "heading_2",
- "heading_2": {
+ "type": "paragraph",
+ "paragraph": {
"rich_text": [
{
"type": "text",
"text": {
- "content": "useScrollRestoration",
+ "content": "이 명령을 실행하면 새로운 버전이 npm에 자동으로 배포된다.",
"link": null
},
"annotations": {
@@ -1630,23 +1671,22 @@
"code": false,
"color": "default"
},
- "plain_text": "useScrollRestoration",
+ "plain_text": "이 명령을 실행하면 새로운 버전이 npm에 자동으로 배포된다.",
"href": null
}
],
- "is_toggleable": false,
"color": "default"
}
},
{
"object": "block",
- "id": "af81971a-6bd1-4169-87f0-16a88931342f",
+ "id": "1399c6bf-2b17-8066-b1d0-d3157ebd8d68",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T06:43:00.000Z",
- "last_edited_time": "2024-05-03T06:48:00.000Z",
+ "created_time": "2024-11-09T12:32:00.000Z",
+ "last_edited_time": "2024-11-09T14:17:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1658,14 +1698,13 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "code",
- "code": {
- "caption": [],
+ "type": "paragraph",
+ "paragraph": {
"rich_text": [
{
"type": "text",
"text": {
- "content": "import { useEffect, useState } from 'react';\n\nimport { useRouter } from 'next/router';\n\nimport Loading from '@/components/Loading';\n\nimport useIsomorphicLayoutEffect from '@/hooks/useIsomorphicLayoutEffect';\n\ninterface Props {\n key: string;\n isLoading?: boolean;\n}\n\n/**\n * 현재 페이지에 대한 스크롤 기록이 있을 경우, 해당 위치로 이동합니다.\n *\n * route 변경이 시작될 때, 세션 스토리지에 스크롤 값을 저장합니다.\n *\n * * Loading 상태를 표기하고 싶을 경우\n * 1. param { isLoading }에 Loading State를 넣어줍니다.\n * 2. 해당 훅의 return 값인 ScrollRestorationLoading, isScrollLoading로 컴포넌트에서 Loading 상태를 표기합니다.\n * ex) src/features/credit/main/Normal/index.tsx\n *\n * * Loading 상태가 필요 없을 경우\n *\n * 1. param { isLoading }에 아무 값도 넣지 않으며,\n * 해당 훅의 return 값인 ScrollRestorationLoading, isScrollLoading를 컴포넌트에서 사용하지 않습니다.\n *\n * @param {key} string - 고유한 string\n * @param {boolean} isLoading - fetching 등에 대한 loading 값\n *\n * @returns {Component, boolean}\n */\n \nconst useScrollRestoration = ({ key = '', isLoading = false }: Props) => {\n const router = useRouter();\n const [scrollY, setScrollY] = useState(0);\n const [isScrollLoading, setIsScrollLoading] = useState(true);\n\n useEffect(() => {\n if (!key) return undefined;\n\n /**\n * route 변경이 시작될 때, session 스토리지에 현재 위치를 저장합니다.\n */\n const routeChangeStartHandler = () => {\n sessionStorage.setItem(\n `__next_scroll_${key}`,\n JSON.stringify({\n x: window.pageXOffset,\n y: window.pageYOffset,\n }),\n );\n };\n router.events.on('routeChangeStart', routeChangeStartHandler);\n return () => {\n router.events.off('routeChangeStart', routeChangeStartHandler);\n };\n }, [key, router.events]);\n\n useIsomorphicLayoutEffect(() => {\n if (!key || isLoading || !router.isReady) return;\n\n window.history.scrollRestoration = 'manual';\n const scroll = sessionStorage.getItem(`__next_scroll_${key}`);\n if (scroll) {\n const { y } = JSON.parse(scroll);\n setScrollY(y || 0);\n\n sessionStorage.removeItem(`__next_scroll_${key}`);\n }\n setIsScrollLoading(false);\n }, [isLoading, key, router.isReady]);\n\n useIsomorphicLayoutEffect(() => {\n if (isScrollLoading) return;\n window.scrollTo(0, scrollY);\n }, [isScrollLoading, scrollY]);\n\n const ScrollRestorationLoading = () => {\n if (isLoading || isScrollLoading) {\n return ;\n }\n\n return (\n \n );\n };\n return { ScrollRestorationLoading, isScrollLoading };\n};\n\nexport default useScrollRestoration;\n",
+ "content": "이렇게 changeset을 설정하면, 프로젝트 내의 모든 변경 사항을 체계적으로 관리하고, 자동으로 버전 및 변경 로그를 생성할 수 있어 협업과 유지보수가 훨씬 수월해진다.",
"link": null
},
"annotations": {
@@ -1676,22 +1715,22 @@
"code": false,
"color": "default"
},
- "plain_text": "import { useEffect, useState } from 'react';\n\nimport { useRouter } from 'next/router';\n\nimport Loading from '@/components/Loading';\n\nimport useIsomorphicLayoutEffect from '@/hooks/useIsomorphicLayoutEffect';\n\ninterface Props {\n key: string;\n isLoading?: boolean;\n}\n\n/**\n * 현재 페이지에 대한 스크롤 기록이 있을 경우, 해당 위치로 이동합니다.\n *\n * route 변경이 시작될 때, 세션 스토리지에 스크롤 값을 저장합니다.\n *\n * * Loading 상태를 표기하고 싶을 경우\n * 1. param { isLoading }에 Loading State를 넣어줍니다.\n * 2. 해당 훅의 return 값인 ScrollRestorationLoading, isScrollLoading로 컴포넌트에서 Loading 상태를 표기합니다.\n * ex) src/features/credit/main/Normal/index.tsx\n *\n * * Loading 상태가 필요 없을 경우\n *\n * 1. param { isLoading }에 아무 값도 넣지 않으며,\n * 해당 훅의 return 값인 ScrollRestorationLoading, isScrollLoading를 컴포넌트에서 사용하지 않습니다.\n *\n * @param {key} string - 고유한 string\n * @param {boolean} isLoading - fetching 등에 대한 loading 값\n *\n * @returns {Component, boolean}\n */\n \nconst useScrollRestoration = ({ key = '', isLoading = false }: Props) => {\n const router = useRouter();\n const [scrollY, setScrollY] = useState(0);\n const [isScrollLoading, setIsScrollLoading] = useState(true);\n\n useEffect(() => {\n if (!key) return undefined;\n\n /**\n * route 변경이 시작될 때, session 스토리지에 현재 위치를 저장합니다.\n */\n const routeChangeStartHandler = () => {\n sessionStorage.setItem(\n `__next_scroll_${key}`,\n JSON.stringify({\n x: window.pageXOffset,\n y: window.pageYOffset,\n }),\n );\n };\n router.events.on('routeChangeStart', routeChangeStartHandler);\n return () => {\n router.events.off('routeChangeStart', routeChangeStartHandler);\n };\n }, [key, router.events]);\n\n useIsomorphicLayoutEffect(() => {\n if (!key || isLoading || !router.isReady) return;\n\n window.history.scrollRestoration = 'manual';\n const scroll = sessionStorage.getItem(`__next_scroll_${key}`);\n if (scroll) {\n const { y } = JSON.parse(scroll);\n setScrollY(y || 0);\n\n sessionStorage.removeItem(`__next_scroll_${key}`);\n }\n setIsScrollLoading(false);\n }, [isLoading, key, router.isReady]);\n\n useIsomorphicLayoutEffect(() => {\n if (isScrollLoading) return;\n window.scrollTo(0, scrollY);\n }, [isScrollLoading, scrollY]);\n\n const ScrollRestorationLoading = () => {\n if (isLoading || isScrollLoading) {\n return ;\n }\n\n return (\n \n );\n };\n return { ScrollRestorationLoading, isScrollLoading };\n};\n\nexport default useScrollRestoration;\n",
+ "plain_text": "이렇게 changeset을 설정하면, 프로젝트 내의 모든 변경 사항을 체계적으로 관리하고, 자동으로 버전 및 변경 로그를 생성할 수 있어 협업과 유지보수가 훨씬 수월해진다.",
"href": null
}
],
- "language": "typescript"
+ "color": "default"
}
},
{
"object": "block",
- "id": "8a23dd44-e122-4931-9727-f2f537b5559e",
+ "id": "1399c6bf-2b17-80bb-9591-f980f64e21a9",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:46:00.000Z",
- "last_edited_time": "2024-05-03T08:47:00.000Z",
+ "created_time": "2024-11-09T12:52:00.000Z",
+ "last_edited_time": "2024-11-09T14:55:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1709,24 +1748,7 @@
{
"type": "text",
"text": {
- "content": "useScrollRestoration",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "useScrollRestoration",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 은 뒤로가기 시 스크롤을 복원해주는 커스텀 훅이다.",
+ "content": "여기까지 다 좋은데 패키지의 기능을 추가 및 수정하고 커밋 후, changeset를 통해 배포를 하면 CHANGELOG에 변경사항이 생겨서 또 커밋을 해야 한다. 그리고 아래와 같이 생각보다 입력해야 할 커맨드 양이 꽤 있다.",
"link": null
},
"annotations": {
@@ -1737,7 +1759,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 은 뒤로가기 시 스크롤을 복원해주는 커스텀 훅이다.",
+ "plain_text": "여기까지 다 좋은데 패키지의 기능을 추가 및 수정하고 커밋 후, changeset를 통해 배포를 하면 CHANGELOG에 변경사항이 생겨서 또 커밋을 해야 한다. 그리고 아래와 같이 생각보다 입력해야 할 커맨드 양이 꽤 있다.",
"href": null
}
],
@@ -1746,13 +1768,13 @@
},
{
"object": "block",
- "id": "e0859ff6-75d3-46ea-afd8-89fec8f63934",
+ "id": "1399c6bf-2b17-802f-9222-cf25e0e6980e",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:39:00.000Z",
- "last_edited_time": "2024-05-03T08:48:00.000Z",
+ "created_time": "2024-11-09T12:54:00.000Z",
+ "last_edited_time": "2024-11-09T13:02:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1771,7 +1793,7 @@
{
"type": "text",
"text": {
- "content": "// next.config.js\nmodule.exports = {\n experimental: {\n scrollRestoration: true\n }\n}",
+ "content": "git commit -m \"기능 추가 블라블라~\"\npnpm changeset\n---\npnpm changeset version\npnpm changeset publish\ngit commit -m \"version: x.x.x\"\ngit push origin 브랜치\n---",
"link": null
},
"annotations": {
@@ -1782,22 +1804,22 @@
"code": false,
"color": "default"
},
- "plain_text": "// next.config.js\nmodule.exports = {\n experimental: {\n scrollRestoration: true\n }\n}",
+ "plain_text": "git commit -m \"기능 추가 블라블라~\"\npnpm changeset\n---\npnpm changeset version\npnpm changeset publish\ngit commit -m \"version: x.x.x\"\ngit push origin 브랜치\n---",
"href": null
}
],
- "language": "typescript"
+ "language": "bash"
}
},
{
"object": "block",
- "id": "703661cb-4acc-4ba8-8927-6437f87257e1",
+ "id": "1399c6bf-2b17-8050-8487-f1f897f2cee9",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:48:00.000Z",
- "last_edited_time": "2024-05-03T10:31:00.000Z",
+ "created_time": "2024-11-09T13:00:00.000Z",
+ "last_edited_time": "2024-11-09T13:02:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1815,7 +1837,7 @@
{
"type": "text",
"text": {
- "content": "위와 같이 NextJS에서 ",
+ "content": "다행히 changeset에서 github action workflow를 만들어 놓아서 ",
"link": null
},
"annotations": {
@@ -1826,13 +1848,13 @@
"code": false,
"color": "default"
},
- "plain_text": "위와 같이 NextJS에서 ",
+ "plain_text": "다행히 changeset에서 github action workflow를 만들어 놓아서 ",
"href": null
},
{
"type": "text",
"text": {
- "content": "experimental",
+ "content": "---",
"link": null
},
"annotations": {
@@ -1843,49 +1865,13 @@
"code": true,
"color": "default"
},
- "plain_text": "experimental",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 로 스크롤 복원을 제공해주긴 하지만, 이 훅을 개발할 때는 회사 프로젝트가 13 미만 버전이기도 했고 13.x.x 버전에서도 잘 작동하지 않는다는 Issue를 본 거 같아서 (",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 로 스크롤 복원을 제공해주긴 하지만, 이 훅을 개발할 때는 회사 프로젝트가 13 미만 버전이기도 했고 13.x.x 버전에서도 잘 작동하지 않는다는 Issue를 본 거 같아서 (",
+ "plain_text": "---",
"href": null
},
{
"type": "text",
"text": {
- "content": "13.x.x대에서 잘 안되다 해결되었다는 트윗",
- "link": {
- "url": "https://twitter.com/felixmokross/status/1654215560677277701?lang=en"
- }
- },
- "annotations": {
- "bold": true,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "13.x.x대에서 잘 안되다 해결되었다는 트윗",
- "href": "https://twitter.com/felixmokross/status/1654215560677277701?lang=en"
- },
- {
- "type": "text",
- "text": {
- "content": ") 직접 구현했고 현재도 잘 작동한다.",
+ "content": " 로 시작해서 끝나는 커맨드들을 workflow과 pull request를 통해 자동화할 수 있다.",
"link": null
},
"annotations": {
@@ -1896,7 +1882,7 @@
"code": false,
"color": "default"
},
- "plain_text": ") 직접 구현했고 현재도 잘 작동한다.",
+ "plain_text": " 로 시작해서 끝나는 커맨드들을 workflow과 pull request를 통해 자동화할 수 있다.",
"href": null
}
],
@@ -1905,13 +1891,13 @@
},
{
"object": "block",
- "id": "fa6645db-54af-4de4-90aa-5720dca63481",
+ "id": "1399c6bf-2b17-80f7-b1be-f4055f09f308",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:54:00.000Z",
- "last_edited_time": "2024-05-03T10:17:00.000Z",
+ "created_time": "2024-11-09T13:05:00.000Z",
+ "last_edited_time": "2024-11-09T14:17:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -1923,47 +1909,13 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
+ "type": "heading_2",
+ "heading_2": {
"rich_text": [
{
"type": "text",
"text": {
- "content": "그리고 직접 만든 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "그리고 직접 만든 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "useScrollRestoration",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "useScrollRestoration",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 은 Loading 컴포넌트가 노출되는 화면에서도 Loading이 끝나고 스크롤을 복원해주는 기능도 있다.",
+ "content": "changeset과 GitHub Action의 통합",
"link": null
},
"annotations": {
@@ -1974,22 +1926,23 @@
"code": false,
"color": "default"
},
- "plain_text": " 은 Loading 컴포넌트가 노출되는 화면에서도 Loading이 끝나고 스크롤을 복원해주는 기능도 있다.",
+ "plain_text": "changeset과 GitHub Action의 통합",
"href": null
}
],
+ "is_toggleable": false,
"color": "default"
}
},
{
"object": "block",
- "id": "931d7e1f-9ca1-4cab-a734-158c73dafac8",
+ "id": "1399c6bf-2b17-80d2-ad8a-db83ca61f064",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:53:00.000Z",
- "last_edited_time": "2024-05-03T08:56:00.000Z",
+ "created_time": "2024-11-09T13:06:00.000Z",
+ "last_edited_time": "2024-11-09T13:06:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -2001,47 +1954,13 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
+ "type": "heading_3",
+ "heading_3": {
"rich_text": [
{
"type": "text",
"text": {
- "content": "우선 route 변경이 시작될 때, 세션 스토리지에 스크롤 값을 저장하고 돌아올 때 해당 값으로 이동해서 스크롤 복원을 수행한다. 이는 NextJS의 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "우선 route 변경이 시작될 때, 세션 스토리지에 스크롤 값을 저장하고 돌아올 때 해당 값으로 이동해서 스크롤 복원을 수행한다. 이는 NextJS의 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "scrollRestoration",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "scrollRestoration",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 기능 구현과 비슷할 것이다.",
+ "content": "Github Action",
"link": null
},
"annotations": {
@@ -2052,22 +1971,23 @@
"code": false,
"color": "default"
},
- "plain_text": " 기능 구현과 비슷할 것이다.",
+ "plain_text": "Github Action",
"href": null
}
],
+ "is_toggleable": false,
"color": "default"
}
},
{
"object": "block",
- "id": "9fcea528-2867-4b69-bf38-0d4511d6b1d3",
+ "id": "1399c6bf-2b17-80f9-a393-f95f78ad4e2e",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:18:00.000Z",
- "last_edited_time": "2024-05-03T10:17:00.000Z",
+ "created_time": "2024-11-09T13:06:00.000Z",
+ "last_edited_time": "2024-11-09T13:06:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -2085,24 +2005,7 @@
{
"type": "text",
"text": {
- "content": "useScrollRestoration",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "useScrollRestoration",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 은 Loading 상태를 표기하고 싶을 경우, Loading 상태를 표기하고 싶지 않은 경우로 나누어서 설명하겠다.",
+ "content": "GitHub Action은 GitHub 저장소에서 빌드, 테스트, 배포 같은 작업을 자동화할 수 있는 도구이다. 이를 통해 개발자는 반복적인 작업을 자동으로 처리하고, CI/CD 파이프라인을 쉽게 구성할 수 있다.\n(GitHub Action은 짧게만 설명하고 넘어간다..)",
"link": null
},
"annotations": {
@@ -2113,7 +2016,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 은 Loading 상태를 표기하고 싶을 경우, Loading 상태를 표기하고 싶지 않은 경우로 나누어서 설명하겠다.",
+ "plain_text": "GitHub Action은 GitHub 저장소에서 빌드, 테스트, 배포 같은 작업을 자동화할 수 있는 도구이다. 이를 통해 개발자는 반복적인 작업을 자동으로 처리하고, CI/CD 파이프라인을 쉽게 구성할 수 있다.\n(GitHub Action은 짧게만 설명하고 넘어간다..)",
"href": null
}
],
@@ -2122,13 +2025,13 @@
},
{
"object": "block",
- "id": "f931e535-6701-4666-a28e-99d69bef119f",
+ "id": "1399c6bf-2b17-8009-95e0-caea31667a78",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:19:00.000Z",
- "last_edited_time": "2024-05-03T09:19:00.000Z",
+ "created_time": "2024-11-09T13:08:00.000Z",
+ "last_edited_time": "2024-11-09T13:11:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -2146,7 +2049,7 @@
{
"type": "text",
"text": {
- "content": "Loading 상태를 표기하고 싶지 않은 경우",
+ "content": "npm 토큰 발급",
"link": null
},
"annotations": {
@@ -2157,7 +2060,7 @@
"code": false,
"color": "default"
},
- "plain_text": "Loading 상태를 표기하고 싶지 않은 경우",
+ "plain_text": "npm 토큰 발급",
"href": null
}
],
@@ -2167,13 +2070,13 @@
},
{
"object": "block",
- "id": "91020d1c-32ce-4264-ae47-1db3585e3ac1",
+ "id": "1399c6bf-2b17-806e-aeb5-c24fabf16aee",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:56:00.000Z",
- "last_edited_time": "2024-05-03T10:32:00.000Z",
+ "created_time": "2024-11-09T13:12:00.000Z",
+ "last_edited_time": "2024-11-09T13:12:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -2182,42 +2085,143 @@
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
},
- "has_children": false,
+ "has_children": true,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
- "rich_text": [
- {
- "type": "text",
- "text": {
- "content": "이 경우는 일반적인 스크롤 복원과 같다.",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "이 경우는 일반적인 스크롤 복원과 같다.",
- "href": null
- }
- ],
- "color": "default"
- }
+ "type": "column_list",
+ "column_list": {},
+ "children": [
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8095-b39d-cb5eccc69c45",
+ "parent": {
+ "type": "block_id",
+ "block_id": "1399c6bf-2b17-806e-aeb5-c24fabf16aee"
+ },
+ "created_time": "2024-11-09T13:12:00.000Z",
+ "last_edited_time": "2024-11-09T13:34:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": true,
+ "archived": false,
+ "in_trash": false,
+ "type": "column",
+ "column": {},
+ "children": [
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-80b4-947e-dcf7bc4c2906",
+ "parent": {
+ "type": "block_id",
+ "block_id": "1399c6bf-2b17-8095-b39d-cb5eccc69c45"
+ },
+ "created_time": "2024-11-09T13:08:00.000Z",
+ "last_edited_time": "2024-11-09T13:12:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2Fb299fd76-3951-4b29-a4c1-015eeb7ca9b8%2Fimage.png?table=block&id=1399c6bf-2b17-80b4-947e-dcf7bc4c2906&cache=v2",
+ "expiry_time": "2025-04-13T15:03:22.727Z"
+ },
+ "format": {
+ "block_width": 261,
+ "block_height": 330,
+ "block_aspect_ratio": 0.7909090909090909
+ }
+ }
+ }
+ ]
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8045-90d7-e0f8a3747d6d",
+ "parent": {
+ "type": "block_id",
+ "block_id": "1399c6bf-2b17-806e-aeb5-c24fabf16aee"
+ },
+ "created_time": "2024-11-09T13:12:00.000Z",
+ "last_edited_time": "2024-11-09T14:28:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": true,
+ "archived": false,
+ "in_trash": false,
+ "type": "column",
+ "column": {},
+ "children": [
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-80a6-bb59-c9531614b273",
+ "parent": {
+ "type": "block_id",
+ "block_id": "1399c6bf-2b17-8045-90d7-e0f8a3747d6d"
+ },
+ "created_time": "2024-11-09T13:09:00.000Z",
+ "last_edited_time": "2024-11-09T13:13:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2Fc0552328-c359-4c1e-8acd-99b6cbeb69b5%2Fimage.png?table=block&id=1399c6bf-2b17-80a6-bb59-c9531614b273&cache=v2",
+ "expiry_time": "2025-04-13T15:03:25.220Z"
+ },
+ "format": {
+ "block_width": 552,
+ "block_height": 278,
+ "block_aspect_ratio": 1.985611510791367
+ }
+ }
+ }
+ ]
+ }
+ ]
},
{
"object": "block",
- "id": "1b1c0632-c2ed-42db-80ba-30f97f0ec8bf",
+ "id": "1399c6bf-2b17-8096-8bcd-ec4084dce1ea",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:19:00.000Z",
- "last_edited_time": "2024-05-03T09:20:00.000Z",
+ "created_time": "2024-11-09T13:11:00.000Z",
+ "last_edited_time": "2024-11-09T14:22:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -2229,14 +2233,13 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "code",
- "code": {
- "caption": [],
+ "type": "paragraph",
+ "paragraph": {
"rich_text": [
{
"type": "text",
"text": {
- "content": " useEffect(() => {\n if (!key) return undefined;\n\n /**\n * route 변경이 시작될 때, session 스토리지에 현재 위치를 저장합니다.\n */\n const routeChangeStartHandler = () => {\n sessionStorage.setItem(\n `__next_scroll_${key}`,\n JSON.stringify({\n x: window.pageXOffset,\n y: window.pageYOffset,\n }),\n );\n };\n router.events.on('routeChangeStart', routeChangeStartHandler);\n return () => {\n router.events.off('routeChangeStart', routeChangeStartHandler);\n };\n }, [key, router.events]);",
+ "content": "우선 npm 토큰을 발급받아야 한다. 위 사진처럼 Access Tokens를 클릭해서 Generate New Token → Classic Token를 클릭하자!",
"link": null
},
"annotations": {
@@ -2247,22 +2250,22 @@
"code": false,
"color": "default"
},
- "plain_text": " useEffect(() => {\n if (!key) return undefined;\n\n /**\n * route 변경이 시작될 때, session 스토리지에 현재 위치를 저장합니다.\n */\n const routeChangeStartHandler = () => {\n sessionStorage.setItem(\n `__next_scroll_${key}`,\n JSON.stringify({\n x: window.pageXOffset,\n y: window.pageYOffset,\n }),\n );\n };\n router.events.on('routeChangeStart', routeChangeStartHandler);\n return () => {\n router.events.off('routeChangeStart', routeChangeStartHandler);\n };\n }, [key, router.events]);",
+ "plain_text": "우선 npm 토큰을 발급받아야 한다. 위 사진처럼 Access Tokens를 클릭해서 Generate New Token → Classic Token를 클릭하자!",
"href": null
}
],
- "language": "typescript"
+ "color": "default"
}
},
{
"object": "block",
- "id": "1a28be21-393b-47a4-bdcd-1241630ad894",
+ "id": "1399c6bf-2b17-80d7-8c95-e827c6a980d3",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:20:00.000Z",
- "last_edited_time": "2024-05-03T10:18:00.000Z",
+ "created_time": "2024-11-09T13:10:00.000Z",
+ "last_edited_time": "2024-11-09T13:14:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -2274,107 +2277,30 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
- "rich_text": [
- {
- "type": "text",
- "text": {
- "content": "Page [A]에서 route가 변경될 때, 세션 스토리지에 스크롤 위치인 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "Page [A]에서 route가 변경될 때, 세션 스토리지에 스크롤 위치인 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "window.pageXOffset, window.pageYOffset",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "window.pageXOffset, window.pageYOffset",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 를 저장한다. key는 고유한 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 를 저장한다. key는 고유한 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "string",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "string",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 이고 key가 없다면 훅은 작동하지 않는다.",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 이고 key가 없다면 훅은 작동하지 않는다.",
- "href": null
- }
- ],
- "color": "default"
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2F64a778fc-5ca5-4687-a4b8-fd0a3cc3b1fb%2Fimage.png?table=block&id=1399c6bf-2b17-80d7-8c95-e827c6a980d3&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.648Z"
+ },
+ "format": {
+ "block_width": 796,
+ "block_height": 867,
+ "block_aspect_ratio": 0.9181084198385236
+ }
}
},
{
"object": "block",
- "id": "342f72cc-2180-4fd1-97bb-f13a8a590e42",
+ "id": "1399c6bf-2b17-80ec-9eef-d1a2a5d87824",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:23:00.000Z",
- "last_edited_time": "2024-05-03T09:24:00.000Z",
+ "created_time": "2024-11-09T13:10:00.000Z",
+ "last_edited_time": "2024-11-09T13:15:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -2386,40 +2312,30 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "code",
- "code": {
+ "type": "image",
+ "image": {
"caption": [],
- "rich_text": [
- {
- "type": "text",
- "text": {
- "content": " const router = useRouter();\n const [scrollY, setScrollY] = useState(0);\n const [isScrollLoading, setIsScrollLoading] = useState(true);\n \n ...\n \n useIsomorphicLayoutEffect(() => {\n if (!key || isLoading || !router.isReady) return;\n\n window.history.scrollRestoration = 'manual';\n const scroll = sessionStorage.getItem(`__next_scroll_${key}`);\n if (scroll) {\n const { y } = JSON.parse(scroll);\n setScrollY(y || 0);\n\n sessionStorage.removeItem(`__next_scroll_${key}`);\n }\n setIsScrollLoading(false);\n }, [isLoading, key, router.isReady]);\n\n useIsomorphicLayoutEffect(() => {\n if (isScrollLoading) return;\n window.scrollTo(0, scrollY);\n }, [isScrollLoading, scrollY]);",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " const router = useRouter();\n const [scrollY, setScrollY] = useState(0);\n const [isScrollLoading, setIsScrollLoading] = useState(true);\n \n ...\n \n useIsomorphicLayoutEffect(() => {\n if (!key || isLoading || !router.isReady) return;\n\n window.history.scrollRestoration = 'manual';\n const scroll = sessionStorage.getItem(`__next_scroll_${key}`);\n if (scroll) {\n const { y } = JSON.parse(scroll);\n setScrollY(y || 0);\n\n sessionStorage.removeItem(`__next_scroll_${key}`);\n }\n setIsScrollLoading(false);\n }, [isLoading, key, router.isReady]);\n\n useIsomorphicLayoutEffect(() => {\n if (isScrollLoading) return;\n window.scrollTo(0, scrollY);\n }, [isScrollLoading, scrollY]);",
- "href": null
- }
- ],
- "language": "typescript"
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2F9f949340-e845-4122-be6c-3cde0f3a1c73%2Fimage.png?table=block&id=1399c6bf-2b17-80ec-9eef-d1a2a5d87824&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.675Z"
+ },
+ "format": {
+ "block_width": 569,
+ "block_height": 258,
+ "block_aspect_ratio": 2.205426356589147
+ }
}
},
{
"object": "block",
- "id": "8f7f4835-a822-473b-ac89-46b02c7bb720",
+ "id": "1399c6bf-2b17-80f8-b152-e20d48aa66fe",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:24:00.000Z",
- "last_edited_time": "2024-05-03T09:43:00.000Z",
+ "created_time": "2024-11-09T13:14:00.000Z",
+ "last_edited_time": "2024-11-09T14:57:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -2437,7 +2353,7 @@
{
"type": "text",
"text": {
- "content": "스크롤 복원은 ",
+ "content": "type를 Automation으로 선택해 토큰을 발급받고 복사하자.\n(잃어버리면 안 된다.. 위 테스트용 토큰은 발급받자마자 지웠다.) ",
"link": null
},
"annotations": {
@@ -2448,109 +2364,7 @@
"code": false,
"color": "default"
},
- "plain_text": "스크롤 복원은 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "useLayoutEffect",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "useLayoutEffect",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 로 수행한다. ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 로 수행한다. ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "useEffect",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "useEffect",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 는 paint 작업 이후 비동기로 작동하기 때문에 사용자가 보기에 페이지가 뜬 후, 스크롤이 이동되는 것처럼 보일 수 있다. 이는 유저 경험을 떨어뜨리기에 paint 이전에 동기적으로 수행하는 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 는 paint 작업 이후 비동기로 작동하기 때문에 사용자가 보기에 페이지가 뜬 후, 스크롤이 이동되는 것처럼 보일 수 있다. 이는 유저 경험을 떨어뜨리기에 paint 이전에 동기적으로 수행하는 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "useLayoutEffect",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "useLayoutEffect",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 를 사용했다.",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 를 사용했다.",
+ "plain_text": "type를 Automation으로 선택해 토큰을 발급받고 복사하자.\n(잃어버리면 안 된다.. 위 테스트용 토큰은 발급받자마자 지웠다.) ",
"href": null
}
],
@@ -2559,13 +2373,13 @@
},
{
"object": "block",
- "id": "860fcca9-0132-4aeb-8c11-2dae4b8d17fe",
+ "id": "1399c6bf-2b17-800a-97c2-eee554e14912",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:43:00.000Z",
- "last_edited_time": "2024-05-03T09:43:00.000Z",
+ "created_time": "2024-11-09T13:15:00.000Z",
+ "last_edited_time": "2024-11-09T14:22:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -2583,7 +2397,7 @@
{
"type": "text",
"text": {
- "content": "추가로 NextJS warning을 제거하기 위해 ",
+ "content": "그리고 github로 이동해서 발급받은 토큰을 원하는 Repository에 설정해준다.",
"link": null
},
"annotations": {
@@ -2594,41 +2408,7 @@
"code": false,
"color": "default"
},
- "plain_text": "추가로 NextJS warning을 제거하기 위해 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "useIsomorphicLayoutEffect",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "useIsomorphicLayoutEffect",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 를 사용하였다.",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 를 사용하였다.",
+ "plain_text": "그리고 github로 이동해서 발급받은 토큰을 원하는 Repository에 설정해준다.",
"href": null
}
],
@@ -2637,13 +2417,13 @@
},
{
"object": "block",
- "id": "021651b4-2708-4cae-bd00-908c69300080",
+ "id": "1399c6bf-2b17-80f5-82dc-c5704598364c",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:25:00.000Z",
- "last_edited_time": "2024-05-03T10:33:00.000Z",
+ "created_time": "2024-11-09T13:18:00.000Z",
+ "last_edited_time": "2024-11-09T13:18:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -2655,107 +2435,30 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
- "rich_text": [
- {
- "type": "text",
- "text": {
- "content": "코드 상단에 있는 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "코드 상단에 있는 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "useIsomorphicLayoutEffect",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "useIsomorphicLayoutEffect",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 부터 보면 조건문이 있는데, key가 없거나 router가 준비가 안 되었을 때 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 부터 보면 조건문이 있는데, key가 없거나 router가 준비가 안 되었을 때 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "return",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "return",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 한다.",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 한다.",
- "href": null
- }
- ],
- "color": "default"
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2F448ca753-8fcf-459e-9f91-faf741c27f6e%2Fimage.png?table=block&id=1399c6bf-2b17-80f5-82dc-c5704598364c&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.661Z"
+ },
+ "format": {
+ "block_width": 1147,
+ "block_height": 718,
+ "block_aspect_ratio": 1.5974930362116992
+ }
}
},
{
"object": "block",
- "id": "1ca59f3a-c09c-45c7-98f8-fca17a9d5755",
+ "id": "1399c6bf-2b17-8098-8d68-d353fe671e0c",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:28:00.000Z",
- "last_edited_time": "2024-05-03T10:33:00.000Z",
+ "created_time": "2024-11-09T13:18:00.000Z",
+ "last_edited_time": "2024-11-09T13:35:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -2773,7 +2476,7 @@
{
"type": "text",
"text": {
- "content": "isLoading",
+ "content": "위 사진에서 New repository secret를 눌러 아래와 같이 설정하고 추가한다.\nName: ",
"link": null
},
"annotations": {
@@ -2781,16 +2484,16 @@
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "isLoading",
+ "plain_text": "위 사진에서 New repository secret를 눌러 아래와 같이 설정하고 추가한다.\nName: ",
"href": null
},
{
"type": "text",
"text": {
- "content": " 은 Loading 상태를 표기하고 싶을 때 필요하고 기본값은 ",
+ "content": "NPM_TOKEN",
"link": null
},
"annotations": {
@@ -2798,16 +2501,16 @@
"italic": false,
"strikethrough": false,
"underline": false,
- "code": false,
+ "code": true,
"color": "default"
},
- "plain_text": " 은 Loading 상태를 표기하고 싶을 때 필요하고 기본값은 ",
+ "plain_text": "NPM_TOKEN",
"href": null
},
{
"type": "text",
"text": {
- "content": "false",
+ "content": ", Secret: ",
"link": null
},
"annotations": {
@@ -2815,16 +2518,16 @@
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "false",
+ "plain_text": ", Secret: ",
"href": null
},
{
"type": "text",
"text": {
- "content": " 기 때문에 여기서는 무시해도 된다.",
+ "content": "발급 받은 토큰",
"link": null
},
"annotations": {
@@ -2832,10 +2535,10 @@
"italic": false,
"strikethrough": false,
"underline": false,
- "code": false,
+ "code": true,
"color": "default"
},
- "plain_text": " 기 때문에 여기서는 무시해도 된다.",
+ "plain_text": "발급 받은 토큰",
"href": null
}
],
@@ -2844,13 +2547,13 @@
},
{
"object": "block",
- "id": "0b0eb373-ad31-4209-b294-c3345ed306da",
+ "id": "1399c6bf-2b17-80d9-84fe-ed1cae23d610",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:27:00.000Z",
- "last_edited_time": "2024-05-03T10:33:00.000Z",
+ "created_time": "2024-11-09T13:18:00.000Z",
+ "last_edited_time": "2024-11-09T14:57:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -2862,141 +2565,30 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
- "rich_text": [
- {
- "type": "text",
- "text": {
- "content": "스크롤을 수동으로 복원하기 위해 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": "스크롤을 수동으로 복원하기 위해 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "scrollRestoration",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "scrollRestoration",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 에 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 에 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "manual",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "manual",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 를 할당하고 세션 스토리지에서 값을 가져와 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 를 할당하고 세션 스토리지에서 값을 가져와 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "state",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "state",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 에 저장하고 세션 스토리지에 있는 값을 삭제한다. (x값은 아직 쓸 일이 없어 사용은 안 한다.)",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 에 저장하고 세션 스토리지에 있는 값을 삭제한다. (x값은 아직 쓸 일이 없어 사용은 안 한다.)",
- "href": null
- }
- ],
- "color": "default"
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2F0430f6ee-fbb5-404d-9013-52739b74e097%2Fimage.png?table=block&id=1399c6bf-2b17-80d9-84fe-ed1cae23d610&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.785Z"
+ },
+ "format": {
+ "block_width": 786,
+ "block_height": 311,
+ "block_aspect_ratio": 2.527331189710611
+ }
}
},
{
"object": "block",
- "id": "7233bbe7-5e63-429d-a1ed-82c74df3566e",
+ "id": "1399c6bf-2b17-803b-9937-fe5881ea84ef",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:30:00.000Z",
- "last_edited_time": "2024-05-03T09:31:00.000Z",
+ "created_time": "2024-11-09T13:20:00.000Z",
+ "last_edited_time": "2024-11-09T14:23:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3014,7 +2606,7 @@
{
"type": "text",
"text": {
- "content": "다음으로 ",
+ "content": "Workflow permission에 위와 같은 권한이 없으면 PR 생성이 안되니 위 설정도 확인해 보자!",
"link": null
},
"annotations": {
@@ -3025,30 +2617,40 @@
"code": false,
"color": "default"
},
- "plain_text": "다음으로 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "isScrollLoading",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "isScrollLoading",
+ "plain_text": "Workflow permission에 위와 같은 권한이 없으면 PR 생성이 안되니 위 설정도 확인해 보자!",
"href": null
- },
+ }
+ ],
+ "color": "default"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8063-ad06-def65eeeaef8",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T13:21:00.000Z",
+ "last_edited_time": "2024-11-09T14:58:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "paragraph",
+ "paragraph": {
+ "rich_text": [
{
"type": "text",
"text": {
- "content": " 값을 ",
+ "content": "다음으로 배포를 자동화하기 위한 Github Action을 설정한다.\n아래는 GitHub Action 설정 파일(",
"link": null
},
"annotations": {
@@ -3059,13 +2661,13 @@
"code": false,
"color": "default"
},
- "plain_text": " 값을 ",
+ "plain_text": "다음으로 배포를 자동화하기 위한 Github Action을 설정한다.\n아래는 GitHub Action 설정 파일(",
"href": null
},
{
"type": "text",
"text": {
- "content": "false",
+ "content": ".github/workflows/release.yml",
"link": null
},
"annotations": {
@@ -3076,13 +2678,13 @@
"code": true,
"color": "default"
},
- "plain_text": "false",
+ "plain_text": ".github/workflows/release.yml",
"href": null
},
{
"type": "text",
"text": {
- "content": " 로 변경한다. 바로 ",
+ "content": ")의 예시이다.\n(각 라인의 설명도 함께 추가하였다.)",
"link": null
},
"annotations": {
@@ -3093,13 +2695,40 @@
"code": false,
"color": "default"
},
- "plain_text": " 로 변경한다. 바로 ",
+ "plain_text": ")의 예시이다.\n(각 라인의 설명도 함께 추가하였다.)",
"href": null
- },
+ }
+ ],
+ "color": "default"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-801d-8f17-ca9e3a2abb1c",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T13:27:00.000Z",
+ "last_edited_time": "2024-11-09T13:27:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "paragraph",
+ "paragraph": {
+ "rich_text": [
{
"type": "text",
"text": {
- "content": "window.scrollTo(0, scrollY);",
+ "content": "release.yml",
"link": null
},
"annotations": {
@@ -3110,13 +2739,41 @@
"code": true,
"color": "default"
},
- "plain_text": "window.scrollTo(0, scrollY);",
+ "plain_text": "release.yml",
"href": null
- },
+ }
+ ],
+ "color": "default"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-808d-bbc7-fa5ac9b952f7",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T13:22:00.000Z",
+ "last_edited_time": "2024-11-09T14:17:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "code",
+ "code": {
+ "caption": [],
+ "rich_text": [
{
"type": "text",
"text": {
- "content": " 를 사용해 이동해도 되지만, Loading 상태를 표기하고 싶을 때 필요한 로직이라 따로 상태를 나누어 처리했다.",
+ "content": "name: Release\n# 워크플로우 이름 설정. 배포 관련 작업을 수행함\n\non:\n push:\n branches:\n - main\n# main 브랜치에 푸시될 때마다 이 워크플로우가 실행됨\n\nconcurrency: ${{ github.workflow }}-${{ github.ref }}\n# 동시에 여러 워크플로우가 실행되지 않도록 방지\n\njobs:\n release:\n name: Release\n runs-on: ubuntu-latest\n # 배포 작업을 위한 실행 환경을 ubuntu-latest로 설정\n\n steps:\n - name: Checkout Repo\n uses: actions/checkout@v3\n # 저장소를 체크아웃하여 GitHub Actions가 코드를 사용할 수 있도록 함\n\n - name: Setup Node.js 20.x\n uses: actions/setup-node@v3\n with:\n node-version: 20.x\n # Node.js 20.x 버전을 설정하여 Node 환경 준비\n\n - name: Install pnpm\n uses: pnpm/action-setup@v2\n with:\n version: 9\n # pnpm 버전 9 설치\n # pnpm이 아니라 다른 package manager를 사용한다면 바꿔주면 된다\n\t\t\t\t\n - name: Install Dependencies\n run: pnpm install --frozen-lockfile\n # 프로젝트의 모든 의존성을 설치. lockfile을 변경하지 않음\n\n - name: Build packages\n run: pnpm build\n # 패키지를 빌드함\n\n - name: Creating .npmrc\n run: |\n cat << EOF > \"$HOME/.npmrc\"\n //registry.npmjs.org/:_authToken=$NPM_TOKEN\n EOF\n env:\n NPM_TOKEN: ${{ secrets.NPM_TOKEN }}\n # npm 인증 토큰을 포함한 .npmrc 파일 생성\n\n - name: Create Release Pull Request or Publish to npm\n id: changesets\n uses: changesets/action@v1\n with:\n version: pnpm packages-version\n publish: pnpm release\n env:\n GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}\n NPM_TOKEN: ${{ secrets.NPM_TOKEN }}\n # changeset을 사용해 릴리즈 Pull Request를 생성하거나 npm에 배포",
"link": null
},
"annotations": {
@@ -3127,22 +2784,22 @@
"code": false,
"color": "default"
},
- "plain_text": " 를 사용해 이동해도 되지만, Loading 상태를 표기하고 싶을 때 필요한 로직이라 따로 상태를 나누어 처리했다.",
+ "plain_text": "name: Release\n# 워크플로우 이름 설정. 배포 관련 작업을 수행함\n\non:\n push:\n branches:\n - main\n# main 브랜치에 푸시될 때마다 이 워크플로우가 실행됨\n\nconcurrency: ${{ github.workflow }}-${{ github.ref }}\n# 동시에 여러 워크플로우가 실행되지 않도록 방지\n\njobs:\n release:\n name: Release\n runs-on: ubuntu-latest\n # 배포 작업을 위한 실행 환경을 ubuntu-latest로 설정\n\n steps:\n - name: Checkout Repo\n uses: actions/checkout@v3\n # 저장소를 체크아웃하여 GitHub Actions가 코드를 사용할 수 있도록 함\n\n - name: Setup Node.js 20.x\n uses: actions/setup-node@v3\n with:\n node-version: 20.x\n # Node.js 20.x 버전을 설정하여 Node 환경 준비\n\n - name: Install pnpm\n uses: pnpm/action-setup@v2\n with:\n version: 9\n # pnpm 버전 9 설치\n # pnpm이 아니라 다른 package manager를 사용한다면 바꿔주면 된다\n\t\t\t\t\n - name: Install Dependencies\n run: pnpm install --frozen-lockfile\n # 프로젝트의 모든 의존성을 설치. lockfile을 변경하지 않음\n\n - name: Build packages\n run: pnpm build\n # 패키지를 빌드함\n\n - name: Creating .npmrc\n run: |\n cat << EOF > \"$HOME/.npmrc\"\n //registry.npmjs.org/:_authToken=$NPM_TOKEN\n EOF\n env:\n NPM_TOKEN: ${{ secrets.NPM_TOKEN }}\n # npm 인증 토큰을 포함한 .npmrc 파일 생성\n\n - name: Create Release Pull Request or Publish to npm\n id: changesets\n uses: changesets/action@v1\n with:\n version: pnpm packages-version\n publish: pnpm release\n env:\n GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}\n NPM_TOKEN: ${{ secrets.NPM_TOKEN }}\n # changeset을 사용해 릴리즈 Pull Request를 생성하거나 npm에 배포",
"href": null
}
],
- "color": "default"
+ "language": "yaml"
}
},
{
"object": "block",
- "id": "3227bf0c-ec05-46af-a91f-28c3d71a897d",
+ "id": "1399c6bf-2b17-80dd-bb34-f48ac10e8213",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:32:00.000Z",
- "last_edited_time": "2024-05-03T10:34:00.000Z",
+ "created_time": "2024-11-09T13:24:00.000Z",
+ "last_edited_time": "2024-11-09T14:58:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3160,7 +2817,7 @@
{
"type": "text",
"text": {
- "content": "코드의 두 번째 ",
+ "content": "위 yml파일의 마지막 step에서 아래와 같이 ",
"link": null
},
"annotations": {
@@ -3171,13 +2828,13 @@
"code": false,
"color": "default"
},
- "plain_text": "코드의 두 번째 ",
+ "plain_text": "위 yml파일의 마지막 step에서 아래와 같이 ",
"href": null
},
{
"type": "text",
"text": {
- "content": "useIsomorphicLayoutEffect",
+ "content": "version, publish",
"link": null
},
"annotations": {
@@ -3188,13 +2845,13 @@
"code": true,
"color": "default"
},
- "plain_text": "useIsomorphicLayoutEffect",
+ "plain_text": "version, publish",
"href": null
},
{
"type": "text",
"text": {
- "content": " 에서는 스크롤 값을 가져왔고 ",
+ "content": " 설정을 해주는데, 이건 나의 ",
"link": null
},
"annotations": {
@@ -3205,13 +2862,13 @@
"code": false,
"color": "default"
},
- "plain_text": " 에서는 스크롤 값을 가져왔고 ",
+ "plain_text": " 설정을 해주는데, 이건 나의 ",
"href": null
},
{
"type": "text",
"text": {
- "content": "state",
+ "content": "package.json",
"link": null
},
"annotations": {
@@ -3222,13 +2879,13 @@
"code": true,
"color": "default"
},
- "plain_text": "state",
+ "plain_text": "package.json",
"href": null
},
{
"type": "text",
"text": {
- "content": " 에 저장된 해당 위치로 스크롤 이동한다.",
+ "content": " script에 추가해 준 changeset 관련 명령어다.",
"link": null
},
"annotations": {
@@ -3239,7 +2896,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 에 저장된 해당 위치로 스크롤 이동한다.",
+ "plain_text": " script에 추가해 준 changeset 관련 명령어다.",
"href": null
}
],
@@ -3248,13 +2905,13 @@
},
{
"object": "block",
- "id": "298f3b5f-39b8-4860-bd1f-aee774b511ba",
+ "id": "1399c6bf-2b17-807c-805a-d47bca5455b1",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:36:00.000Z",
- "last_edited_time": "2024-05-03T09:37:00.000Z",
+ "created_time": "2024-11-09T13:25:00.000Z",
+ "last_edited_time": "2024-11-09T13:25:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3263,42 +2920,189 @@
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
},
- "has_children": false,
+ "has_children": true,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
- "rich_text": [
- {
- "type": "text",
- "text": {
- "content": "사용 예시",
- "link": null
- },
- "annotations": {
- "bold": true,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
+ "type": "column_list",
+ "column_list": {},
+ "children": [
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-809f-92ec-fb29d4981cc7",
+ "parent": {
+ "type": "block_id",
+ "block_id": "1399c6bf-2b17-807c-805a-d47bca5455b1"
+ },
+ "created_time": "2024-11-09T13:25:00.000Z",
+ "last_edited_time": "2024-11-09T14:29:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": true,
+ "archived": false,
+ "in_trash": false,
+ "type": "column",
+ "column": {},
+ "children": [
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-80dd-817a-d0b56736ef74",
+ "parent": {
+ "type": "block_id",
+ "block_id": "1399c6bf-2b17-809f-92ec-fb29d4981cc7"
+ },
+ "created_time": "2024-11-09T13:24:00.000Z",
+ "last_edited_time": "2024-11-09T13:25:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "code",
+ "code": {
+ "caption": [],
+ "rich_text": [
+ {
+ "type": "text",
+ "text": {
+ "content": "version: pnpm packages-version\npublish: pnpm release",
+ "link": null
+ },
+ "annotations": {
+ "bold": false,
+ "italic": false,
+ "strikethrough": false,
+ "underline": false,
+ "code": false,
+ "color": "default"
+ },
+ "plain_text": "version: pnpm packages-version\npublish: pnpm release",
+ "href": null
+ }
+ ],
+ "language": "yaml"
+ }
},
- "plain_text": "사용 예시",
- "href": null
- }
- ],
- "color": "default"
- }
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-80ed-972c-f8f93605eb20",
+ "parent": {
+ "type": "block_id",
+ "block_id": "1399c6bf-2b17-809f-92ec-fb29d4981cc7"
+ },
+ "created_time": "2024-11-09T13:25:00.000Z",
+ "last_edited_time": "2024-11-09T13:25:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "paragraph",
+ "paragraph": {
+ "rich_text": [],
+ "color": "default"
+ }
+ }
+ ]
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8010-8b83-d3c9286dbce9",
+ "parent": {
+ "type": "block_id",
+ "block_id": "1399c6bf-2b17-807c-805a-d47bca5455b1"
+ },
+ "created_time": "2024-11-09T13:25:00.000Z",
+ "last_edited_time": "2024-11-09T14:29:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": true,
+ "archived": false,
+ "in_trash": false,
+ "type": "column",
+ "column": {},
+ "children": [
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-807a-b7bf-ea370c778400",
+ "parent": {
+ "type": "block_id",
+ "block_id": "1399c6bf-2b17-8010-8b83-d3c9286dbce9"
+ },
+ "created_time": "2024-11-09T13:25:00.000Z",
+ "last_edited_time": "2024-11-09T13:25:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "code",
+ "code": {
+ "caption": [],
+ "rich_text": [
+ {
+ "type": "text",
+ "text": {
+ "content": " \"scripts\": {\n\t\t...\n \"packages-version\": \"changeset version\",\n \"release\": \"changeset publish\"\n },",
+ "link": null
+ },
+ "annotations": {
+ "bold": false,
+ "italic": false,
+ "strikethrough": false,
+ "underline": false,
+ "code": false,
+ "color": "default"
+ },
+ "plain_text": " \"scripts\": {\n\t\t...\n \"packages-version\": \"changeset version\",\n \"release\": \"changeset publish\"\n },",
+ "href": null
+ }
+ ],
+ "language": "json"
+ }
+ }
+ ]
+ }
+ ]
},
{
"object": "block",
- "id": "5eefac86-6731-4a49-a794-992a9aea2dbd",
+ "id": "1399c6bf-2b17-8033-a1ed-c62b187f2f44",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:36:00.000Z",
- "last_edited_time": "2024-05-03T09:56:00.000Z",
+ "created_time": "2024-11-09T13:31:00.000Z",
+ "last_edited_time": "2024-11-09T13:31:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3310,14 +3114,13 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "code",
- "code": {
- "caption": [],
+ "type": "heading_3",
+ "heading_3": {
"rich_text": [
{
"type": "text",
"text": {
- "content": "const NormalCredit = () => {\n\t...\n\t\n useScrollRestoration({\n key: '고유한 key string',\n });\n \n ...\n};",
+ "content": "직접 해보기",
"link": null
},
"annotations": {
@@ -3328,22 +3131,23 @@
"code": false,
"color": "default"
},
- "plain_text": "const NormalCredit = () => {\n\t...\n\t\n useScrollRestoration({\n key: '고유한 key string',\n });\n \n ...\n};",
+ "plain_text": "직접 해보기",
"href": null
}
],
- "language": "typescript"
+ "is_toggleable": false,
+ "color": "default"
}
},
{
"object": "block",
- "id": "49ef46ed-0937-49c3-bae3-43b793b59d5e",
+ "id": "1399c6bf-2b17-805e-bcb8-d4fa46a424d8",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:22:00.000Z",
- "last_edited_time": "2024-05-03T10:34:00.000Z",
+ "created_time": "2024-11-09T13:31:00.000Z",
+ "last_edited_time": "2024-11-09T14:58:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3355,13 +3159,13 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "heading_3",
- "heading_3": {
+ "type": "paragraph",
+ "paragraph": {
"rich_text": [
{
"type": "text",
"text": {
- "content": "Loading 상태를 표기하고 싶을 경우",
+ "content": "자! 이제 세팅은 다 끝났다. 그럼 위 github action은 어떻게 작동할까? 직접 해보자!",
"link": null
},
"annotations": {
@@ -3372,23 +3176,22 @@
"code": false,
"color": "default"
},
- "plain_text": "Loading 상태를 표기하고 싶을 경우",
+ "plain_text": "자! 이제 세팅은 다 끝났다. 그럼 위 github action은 어떻게 작동할까? 직접 해보자!",
"href": null
}
],
- "is_toggleable": false,
"color": "default"
}
},
{
"object": "block",
- "id": "d32a2f1c-75cd-4660-994c-227a2e33635a",
+ "id": "1399c6bf-2b17-802a-b0d0-d398c9e15753",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:22:00.000Z",
- "last_edited_time": "2024-05-03T10:34:00.000Z",
+ "created_time": "2024-11-09T13:43:00.000Z",
+ "last_edited_time": "2024-11-09T13:44:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3400,13 +3203,14 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
+ "type": "code",
+ "code": {
+ "caption": [],
"rich_text": [
{
"type": "text",
"text": {
- "content": "예를 들어, Page [A]는 페이지가 마운트 될 때 API 요청을 하고 그동안 Loading 컴포넌트를 보여준다. 다른 페이지로 이동했다가 Page [A]로 이동할 때도 다시 API 요청을 하고 Loading 컴포넌트를 보여준다.",
+ "content": "gaa\ngcmsg \"build: github action 자동화 Test\"\npnpm changeset\ngcmsg \"chore: 임시 md 추가\"\nggp",
"link": null
},
"annotations": {
@@ -3417,22 +3221,22 @@
"code": false,
"color": "default"
},
- "plain_text": "예를 들어, Page [A]는 페이지가 마운트 될 때 API 요청을 하고 그동안 Loading 컴포넌트를 보여준다. 다른 페이지로 이동했다가 Page [A]로 이동할 때도 다시 API 요청을 하고 Loading 컴포넌트를 보여준다.",
+ "plain_text": "gaa\ngcmsg \"build: github action 자동화 Test\"\npnpm changeset\ngcmsg \"chore: 임시 md 추가\"\nggp",
"href": null
}
],
- "color": "default"
+ "language": "bash"
}
},
{
"object": "block",
- "id": "98c23240-b761-44ab-80ad-0be63ad2f015",
+ "id": "1399c6bf-2b17-80e8-a4d9-e81d1f54210e",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:35:00.000Z",
- "last_edited_time": "2024-05-03T09:36:00.000Z",
+ "created_time": "2024-11-09T13:44:00.000Z",
+ "last_edited_time": "2024-11-09T13:45:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3450,7 +3254,43 @@
{
"type": "text",
"text": {
- "content": "이 페이지에서 로딩이 완료된 후 스크롤 복원을 하려면 위에 설명한 로직이나 NextJS에서 제공하는 기능으로는 스크롤 복원을 할 수 없다.",
+ "content": "위 커맨드는 ",
+ "link": null
+ },
+ "annotations": {
+ "bold": false,
+ "italic": false,
+ "strikethrough": false,
+ "underline": false,
+ "code": false,
+ "color": "default"
+ },
+ "plain_text": "위 커맨드는 ",
+ "href": null
+ },
+ {
+ "type": "text",
+ "text": {
+ "content": "git alias",
+ "link": {
+ "url": "https://www.hansschnedlitz.com/git-aliases/"
+ }
+ },
+ "annotations": {
+ "bold": false,
+ "italic": false,
+ "strikethrough": false,
+ "underline": false,
+ "code": false,
+ "color": "default"
+ },
+ "plain_text": "git alias",
+ "href": "https://www.hansschnedlitz.com/git-aliases/"
+ },
+ {
+ "type": "text",
+ "text": {
+ "content": "를 사용한 커맨드다! (그냥 add, commit, push다)",
"link": null
},
"annotations": {
@@ -3461,7 +3301,7 @@
"code": false,
"color": "default"
},
- "plain_text": "이 페이지에서 로딩이 완료된 후 스크롤 복원을 하려면 위에 설명한 로직이나 NextJS에서 제공하는 기능으로는 스크롤 복원을 할 수 없다.",
+ "plain_text": "를 사용한 커맨드다! (그냥 add, commit, push다)",
"href": null
}
],
@@ -3470,13 +3310,13 @@
},
{
"object": "block",
- "id": "6d1ae9f8-eee9-4cc8-94c6-1a117b823aa6",
+ "id": "1399c6bf-2b17-806b-9544-d67837652d4a",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:36:00.000Z",
- "last_edited_time": "2024-05-03T10:34:00.000Z",
+ "created_time": "2024-11-09T13:46:00.000Z",
+ "last_edited_time": "2024-11-09T13:50:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3494,7 +3334,7 @@
{
"type": "text",
"text": {
- "content": "위 요구사항을 만족하기 위해 몇 가지 로직을 추가했다.",
+ "content": "push를 하면 workflow 실행되면서 PR이 생성된다.",
"link": null
},
"annotations": {
@@ -3505,7 +3345,7 @@
"code": false,
"color": "default"
},
- "plain_text": "위 요구사항을 만족하기 위해 몇 가지 로직을 추가했다.",
+ "plain_text": "push를 하면 workflow 실행되면서 PR이 생성된다.",
"href": null
}
],
@@ -3514,13 +3354,13 @@
},
{
"object": "block",
- "id": "5e95bb98-9644-4aac-8b53-e43c38e4584c",
+ "id": "1399c6bf-2b17-801f-bf40-d08216c807fc",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:38:00.000Z",
- "last_edited_time": "2024-05-03T09:38:00.000Z",
+ "created_time": "2024-11-09T13:44:00.000Z",
+ "last_edited_time": "2024-11-09T14:30:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3532,14 +3372,118 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "code",
- "code": {
+ "type": "image",
+ "image": {
"caption": [],
- "rich_text": [
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2F14e3f710-f1a2-4fc0-aefc-d33dc74e6dcb%2Fimage.png?table=block&id=1399c6bf-2b17-801f-bf40-d08216c807fc&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.788Z"
+ },
+ "format": {
+ "block_width": 1301,
+ "block_height": 91,
+ "block_aspect_ratio": 14.296703296703297
+ }
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8078-a648-eb26e62f9478",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T13:49:00.000Z",
+ "last_edited_time": "2024-11-09T13:49:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2Fdefe3fdd-7f31-40bb-a1a1-121b33d72edc%2Fimage.png?table=block&id=1399c6bf-2b17-8078-a648-eb26e62f9478&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.785Z"
+ },
+ "format": {
+ "block_width": 706,
+ "block_height": 686,
+ "block_aspect_ratio": 1.0291545189504374
+ }
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-802d-9a06-c6ae7beed5cc",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T13:47:00.000Z",
+ "last_edited_time": "2024-11-09T13:47:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2F0ef32fb5-9f44-4635-b15d-098dde53e05f%2Fimage.png?table=block&id=1399c6bf-2b17-802d-9a06-c6ae7beed5cc&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.785Z"
+ },
+ "format": {
+ "block_width": 1297,
+ "block_height": 869,
+ "block_aspect_ratio": 1.4925201380897584
+ }
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8058-8473-d44e16e61bfe",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T13:58:00.000Z",
+ "last_edited_time": "2024-11-09T13:59:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "image",
+ "image": {
+ "caption": [
{
"type": "text",
"text": {
- "content": "const useScrollRestoration = ({ key = '', isLoading = false }: Props)",
+ "content": "자동으로 생성된 file changed",
"link": null
},
"annotations": {
@@ -3550,22 +3494,31 @@
"code": false,
"color": "default"
},
- "plain_text": "const useScrollRestoration = ({ key = '', isLoading = false }: Props)",
+ "plain_text": "자동으로 생성된 file changed",
"href": null
}
],
- "language": "typescript"
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2F31f50215-e6b1-4360-ad40-a562c68ceab0%2Fimage.png?table=block&id=1399c6bf-2b17-8058-8473-d44e16e61bfe&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.781Z"
+ },
+ "format": {
+ "block_width": 934,
+ "block_height": 858,
+ "block_aspect_ratio": 1.0885780885780887
+ }
}
},
{
"object": "block",
- "id": "b284ff39-ffec-409c-8f13-819d1eaa18ae",
+ "id": "1399c6bf-2b17-80bc-b9c4-c16a52e5d2cc",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:38:00.000Z",
- "last_edited_time": "2024-05-03T09:39:00.000Z",
+ "created_time": "2024-11-09T13:47:00.000Z",
+ "last_edited_time": "2024-11-09T14:59:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3583,58 +3536,7 @@
{
"type": "text",
"text": {
- "content": "useScrollRestoration",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "useScrollRestoration",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 의 Props에 ",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 의 Props에 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "isLoading",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "isLoading",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": " 를 할당할 수 있는데 이는 API 요청 중을 의미하는 값이다.",
+ "content": "github-actions 봇이 자동으로 PR을 생성했고 위와 같이 내용도 친절하게 적어준다.\n마지막으로 해당 PR를 머지하면 아래와 같이 다시 workflow가 실행되며 npm에 배포된다.",
"link": null
},
"annotations": {
@@ -3645,7 +3547,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 를 할당할 수 있는데 이는 API 요청 중을 의미하는 값이다.",
+ "plain_text": "github-actions 봇이 자동으로 PR을 생성했고 위와 같이 내용도 친절하게 적어준다.\n마지막으로 해당 PR를 머지하면 아래와 같이 다시 workflow가 실행되며 npm에 배포된다.",
"href": null
}
],
@@ -3654,13 +3556,48 @@
},
{
"object": "block",
- "id": "dade61ad-a19b-47df-a457-5f911b75f6e0",
+ "id": "1399c6bf-2b17-80f0-9f6c-f3c73a34c74b",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T13:51:00.000Z",
+ "last_edited_time": "2024-11-09T13:51:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "image",
+ "image": {
+ "caption": [],
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2Ffbd25f7c-0d0f-40ee-ae3f-1bb1d670425d%2Fimage.png?table=block&id=1399c6bf-2b17-80f0-9f6c-f3c73a34c74b&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.785Z"
+ },
+ "format": {
+ "block_width": 1169,
+ "block_height": 78,
+ "block_aspect_ratio": 14.987179487179487
+ }
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8094-8705-e5d0f3b5c544",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:39:00.000Z",
- "last_edited_time": "2024-05-03T09:40:00.000Z",
+ "created_time": "2024-11-09T13:50:00.000Z",
+ "last_edited_time": "2024-11-09T13:50:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3672,14 +3609,48 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "code",
- "code": {
+ "type": "image",
+ "image": {
"caption": [],
- "rich_text": [
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2F9abfa5eb-f3cd-43ba-9adc-e7706b2fed8c%2Fimage.png?table=block&id=1399c6bf-2b17-8094-8705-e5d0f3b5c544&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.795Z"
+ },
+ "format": {
+ "block_width": 881,
+ "block_height": 521,
+ "block_aspect_ratio": 1.690978886756238
+ }
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8002-8790-c152d40836f4",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T14:03:00.000Z",
+ "last_edited_time": "2024-11-09T14:31:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "image",
+ "image": {
+ "caption": [
{
"type": "text",
"text": {
- "content": "useIsomorphicLayoutEffect(() => {\n if (!key || isLoading || !router.isReady) return;\n \n ...\n \n}, [isLoading, key, router.isReady]);",
+ "content": "npm에 배포된 결과",
"link": null
},
"annotations": {
@@ -3690,22 +3661,31 @@
"code": false,
"color": "default"
},
- "plain_text": "useIsomorphicLayoutEffect(() => {\n if (!key || isLoading || !router.isReady) return;\n \n ...\n \n}, [isLoading, key, router.isReady]);",
+ "plain_text": "npm에 배포된 결과",
"href": null
}
],
- "language": "typescript"
+ "type": "file",
+ "file": {
+ "url": "https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd7314a5-d906-43b0-81e7-42eff82c02a3%2F88661d90-5e2f-4239-ab05-5ffead8d3638%2Fimage.png?table=block&id=1399c6bf-2b17-8002-8790-c152d40836f4&cache=v2",
+ "expiry_time": "2025-04-13T15:03:20.791Z"
+ },
+ "format": {
+ "block_width": 790,
+ "block_height": 318,
+ "block_aspect_ratio": 2.4842767295597485
+ }
}
},
{
"object": "block",
- "id": "3546332f-c1c3-496b-972a-1eaa7f151391",
+ "id": "1399c6bf-2b17-809b-84e7-d56ffac89fa2",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:37:00.000Z",
- "last_edited_time": "2024-05-03T10:35:00.000Z",
+ "created_time": "2024-11-09T13:51:00.000Z",
+ "last_edited_time": "2024-11-09T14:09:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3723,7 +3703,7 @@
{
"type": "text",
"text": {
- "content": "아까 본 첫 번째 ",
+ "content": "위 실행 결과를 보면 알겠지만 같은 ",
"link": null
},
"annotations": {
@@ -3734,13 +3714,13 @@
"code": false,
"color": "default"
},
- "plain_text": "아까 본 첫 번째 ",
+ "plain_text": "위 실행 결과를 보면 알겠지만 같은 ",
"href": null
},
{
"type": "text",
"text": {
- "content": "useIsomorphicLayoutEffect",
+ "content": "Create Release Pull Request or Publish to npm",
"link": null
},
"annotations": {
@@ -3751,13 +3731,13 @@
"code": true,
"color": "default"
},
- "plain_text": "useIsomorphicLayoutEffect",
+ "plain_text": "Create Release Pull Request or Publish to npm",
"href": null
},
{
"type": "text",
"text": {
- "content": " 에서 ",
+ "content": " action이 수행되는데 어떤 경우는 PR이 생성되고 어떤 경우는 npm에 배포되며 release tag가 생성된다.",
"link": null
},
"annotations": {
@@ -3768,30 +3748,40 @@
"code": false,
"color": "default"
},
- "plain_text": " 에서 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "isLoading",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "isLoading",
+ "plain_text": " action이 수행되는데 어떤 경우는 PR이 생성되고 어떤 경우는 npm에 배포되며 release tag가 생성된다.",
"href": null
- },
+ }
+ ],
+ "color": "default"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-804f-93d3-ee85c673a46c",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T13:53:00.000Z",
+ "last_edited_time": "2024-11-09T13:55:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "paragraph",
+ "paragraph": {
+ "rich_text": [
{
"type": "text",
"text": {
- "content": " 이 ",
+ "content": "그 이유는 ",
"link": null
},
"annotations": {
@@ -3802,13 +3792,13 @@
"code": false,
"color": "default"
},
- "plain_text": " 이 ",
+ "plain_text": "그 이유는 ",
"href": null
},
{
"type": "text",
"text": {
- "content": "true",
+ "content": "changesets/action@v1",
"link": null
},
"annotations": {
@@ -3819,13 +3809,13 @@
"code": true,
"color": "default"
},
- "plain_text": "true",
+ "plain_text": "changesets/action@v1",
"href": null
},
{
"type": "text",
"text": {
- "content": " 일 때 (API 요청 중)는 스크롤 복원을 수행하지 않고 API 요청이 끝난 후 스크롤을 복원한다.",
+ "content": " 의 내부 코드를 보면 알 수 있다.",
"link": null
},
"annotations": {
@@ -3836,7 +3826,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 일 때 (API 요청 중)는 스크롤 복원을 수행하지 않고 API 요청이 끝난 후 스크롤을 복원한다.",
+ "plain_text": " 의 내부 코드를 보면 알 수 있다.",
"href": null
}
],
@@ -3845,13 +3835,13 @@
},
{
"object": "block",
- "id": "35e369b7-0c1c-4135-9867-5a84221f327b",
+ "id": "1399c6bf-2b17-802e-be34-f6048cccddaa",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:47:00.000Z",
- "last_edited_time": "2024-05-03T09:50:00.000Z",
+ "created_time": "2024-11-09T13:55:00.000Z",
+ "last_edited_time": "2024-11-09T13:55:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3863,15 +3853,16 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "code",
- "code": {
- "caption": [],
+ "type": "paragraph",
+ "paragraph": {
"rich_text": [
{
- "type": "text",
- "text": {
- "content": " const ScrollRestorationLoading = () => {\n if (isLoading || isScrollLoading) {\n return ;\n }\n\n return (\n \n );\n };",
- "link": null
+ "type": "mention",
+ "mention": {
+ "type": "link_preview",
+ "link_preview": {
+ "url": "https://github.com/changesets/action/blob/main/src/index.ts"
+ }
},
"annotations": {
"bold": false,
@@ -3881,22 +3872,22 @@
"code": false,
"color": "default"
},
- "plain_text": " const ScrollRestorationLoading = () => {\n if (isLoading || isScrollLoading) {\n return ;\n }\n\n return (\n \n );\n };",
- "href": null
+ "plain_text": "https://github.com/changesets/action/blob/main/src/index.ts",
+ "href": "https://github.com/changesets/action/blob/main/src/index.ts"
}
],
- "language": "typescript"
+ "color": "default"
}
},
{
"object": "block",
- "id": "ba3d6855-381b-4d33-8f71-ee8fb56fc1d8",
+ "id": "1399c6bf-2b17-8088-afdc-f1bcd78dea89",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:47:00.000Z",
- "last_edited_time": "2024-05-03T10:35:00.000Z",
+ "created_time": "2024-11-09T14:01:00.000Z",
+ "last_edited_time": "2024-11-09T14:18:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -3914,7 +3905,7 @@
{
"type": "text",
"text": {
- "content": "API가 요청 중이거나, 스크롤 복원 로직이 아직 끝나지 않았을 경우는 ",
+ "content": "간단하게 설명하면 동작을 결정하는 기준은 ",
"link": null
},
"annotations": {
@@ -3925,64 +3916,30 @@
"code": false,
"color": "default"
},
- "plain_text": "API가 요청 중이거나, 스크롤 복원 로직이 아직 끝나지 않았을 경우는 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "Loading",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "Loading",
+ "plain_text": "간단하게 설명하면 동작을 결정하는 기준은 ",
"href": null
},
{
"type": "text",
"text": {
- "content": " 컴포넌트를 보여준다.\nAPI 요청이 끝났고, 스크롤 복원 로직(기존 스크롤 위치를 ",
+ "content": "changeset 상태",
"link": null
},
"annotations": {
- "bold": false,
+ "bold": true,
"italic": false,
"strikethrough": false,
"underline": false,
"code": false,
"color": "default"
},
- "plain_text": " 컴포넌트를 보여준다.\nAPI 요청이 끝났고, 스크롤 복원 로직(기존 스크롤 위치를 ",
- "href": null
- },
- {
- "type": "text",
- "text": {
- "content": "state",
- "link": null
- },
- "annotations": {
- "bold": false,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": true,
- "color": "default"
- },
- "plain_text": "state",
+ "plain_text": "changeset 상태",
"href": null
},
{
"type": "text",
"text": {
- "content": " 에 저장)도 끝났다면 기존 스크롤 위치만큼 해당하는 빈 ",
+ "content": "와 ",
"link": null
},
"annotations": {
@@ -3993,30 +3950,30 @@
"code": false,
"color": "default"
},
- "plain_text": " 에 저장)도 끝났다면 기존 스크롤 위치만큼 해당하는 빈 ",
+ "plain_text": "와 ",
"href": null
},
{
"type": "text",
"text": {
- "content": "div",
+ "content": "트리거된 변경 사항",
"link": null
},
"annotations": {
- "bold": false,
+ "bold": true,
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "div",
+ "plain_text": "트리거된 변경 사항",
"href": null
},
{
"type": "text",
"text": {
- "content": " 를 render 한다.\n이는 viewport 100%에 해당하는 ",
+ "content": "에 따라 달라진다.",
"link": null
},
"annotations": {
@@ -4027,30 +3984,57 @@
"code": false,
"color": "default"
},
- "plain_text": " 를 render 한다.\n이는 viewport 100%에 해당하는 ",
+ "plain_text": "에 따라 달라진다.",
"href": null
- },
+ }
+ ],
+ "color": "default"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-8080-820e-f5de1a6a8602",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T14:02:00.000Z",
+ "last_edited_time": "2024-11-09T14:18:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "bulleted_list_item",
+ "bulleted_list_item": {
+ "rich_text": [
{
"type": "text",
"text": {
- "content": "Loading",
+ "content": "PR 생성",
"link": null
},
"annotations": {
- "bold": false,
+ "bold": true,
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "Loading",
+ "plain_text": "PR 생성",
"href": null
},
{
"type": "text",
"text": {
- "content": " 컴포넌트가 렌더된 상태에서 스크롤을 복원할 경우, 최대 높이가 100vh가 되어 스크롤 값이 100vh보다 클 때 원하는 높이만큼 스크롤 이동할 수 없기 때문이다.",
+ "content": ": changeset 파일이 새롭게 추가되고, 아직 버전 업데이트 및 Release 승인이 이루어지지 않은 경우",
"link": null
},
"annotations": {
@@ -4061,7 +4045,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 컴포넌트가 렌더된 상태에서 스크롤을 복원할 경우, 최대 높이가 100vh가 되어 스크롤 값이 100vh보다 클 때 원하는 높이만큼 스크롤 이동할 수 없기 때문이다.",
+ "plain_text": ": changeset 파일이 새롭게 추가되고, 아직 버전 업데이트 및 Release 승인이 이루어지지 않은 경우",
"href": null
}
],
@@ -4070,13 +4054,13 @@
},
{
"object": "block",
- "id": "e9e6e58e-95a8-434b-8683-b00da413425b",
+ "id": "1399c6bf-2b17-80c9-abd8-cedb55b305a8",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:54:00.000Z",
- "last_edited_time": "2024-05-03T10:21:00.000Z",
+ "created_time": "2024-11-09T14:02:00.000Z",
+ "last_edited_time": "2024-11-09T14:02:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -4088,30 +4072,30 @@
"has_children": false,
"archived": false,
"in_trash": false,
- "type": "paragraph",
- "paragraph": {
+ "type": "bulleted_list_item",
+ "bulleted_list_item": {
"rich_text": [
{
"type": "text",
"text": {
- "content": "위 ",
+ "content": "npm 배포",
"link": null
},
"annotations": {
- "bold": false,
+ "bold": true,
"italic": false,
"strikethrough": false,
"underline": false,
"code": false,
"color": "default"
},
- "plain_text": "위 ",
+ "plain_text": "npm 배포",
"href": null
},
{
"type": "text",
"text": {
- "content": "ScrollRestorationLoading",
+ "content": ": Release PR이 ",
"link": null
},
"annotations": {
@@ -4119,16 +4103,16 @@
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "ScrollRestorationLoading",
+ "plain_text": ": Release PR이 ",
"href": null
},
{
"type": "text",
"text": {
- "content": " 컴포넌트를 Page [A]에서 Loading 상태를 표기할 때 컴포넌트로 사용하면 요구 사항을 만족할 수 있다.",
+ "content": "main",
"link": null
},
"annotations": {
@@ -4136,88 +4120,16 @@
"italic": false,
"strikethrough": false,
"underline": false,
- "code": false,
- "color": "default"
- },
- "plain_text": " 컴포넌트를 Page [A]에서 Loading 상태를 표기할 때 컴포넌트로 사용하면 요구 사항을 만족할 수 있다.",
- "href": null
- }
- ],
- "color": "default"
- }
- },
- {
- "object": "block",
- "id": "9c4eebc9-66f3-431f-b6f9-811163f52865",
- "parent": {
- "type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
- },
- "created_time": "2024-05-03T08:53:00.000Z",
- "last_edited_time": "2024-05-03T09:56:00.000Z",
- "created_by": {
- "object": "user",
- "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
- },
- "last_edited_by": {
- "object": "user",
- "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
- },
- "has_children": false,
- "archived": false,
- "in_trash": false,
- "type": "paragraph",
- "paragraph": {
- "rich_text": [
- {
- "type": "text",
- "text": {
- "content": "사용 예시",
- "link": null
- },
- "annotations": {
- "bold": true,
- "italic": false,
- "strikethrough": false,
- "underline": false,
- "code": false,
+ "code": true,
"color": "default"
},
- "plain_text": "사용 예시",
+ "plain_text": "main",
"href": null
- }
- ],
- "color": "default"
- }
- },
- {
- "object": "block",
- "id": "ff6ec9d4-b3ad-4bdd-af05-b8ebf8f6848c",
- "parent": {
- "type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
- },
- "created_time": "2024-05-03T09:56:00.000Z",
- "last_edited_time": "2024-05-03T10:22:00.000Z",
- "created_by": {
- "object": "user",
- "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
- },
- "last_edited_by": {
- "object": "user",
- "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
- },
- "has_children": false,
- "archived": false,
- "in_trash": false,
- "type": "code",
- "code": {
- "caption": [],
- "rich_text": [
+ },
{
"type": "text",
"text": {
- "content": "const NormalCredit = () => {\n ...\n const { isLoading } = useQuery(...); // 이 Query는 마운트 될 때마다 API를 요청해요~\n const { ScrollRestorationLoading, isScrollLoading } = useScrollRestoration({\n key: '고유한 key string',\n isLoading\n });\n \n ...\n \n if(isScrollLoading) return \n return (\n\t ...\n )\n};",
+ "content": " 브랜치에 병합되어 모든 준비가 완료된 경우",
"link": null
},
"annotations": {
@@ -4228,22 +4140,22 @@
"code": false,
"color": "default"
},
- "plain_text": "const NormalCredit = () => {\n ...\n const { isLoading } = useQuery(...); // 이 Query는 마운트 될 때마다 API를 요청해요~\n const { ScrollRestorationLoading, isScrollLoading } = useScrollRestoration({\n key: '고유한 key string',\n isLoading\n });\n \n ...\n \n if(isScrollLoading) return \n return (\n\t ...\n )\n};",
+ "plain_text": " 브랜치에 병합되어 모든 준비가 완료된 경우",
"href": null
}
],
- "language": "typescript"
+ "color": "default"
}
},
{
"object": "block",
- "id": "d151dd37-fc3f-4d04-94b6-0ae2622717c9",
+ "id": "1399c6bf-2b17-8063-b113-c8837af2eb4d",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:39:00.000Z",
- "last_edited_time": "2024-05-03T08:39:00.000Z",
+ "created_time": "2024-11-09T14:08:00.000Z",
+ "last_edited_time": "2024-11-09T14:08:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -4282,13 +4194,13 @@
},
{
"object": "block",
- "id": "c8e121e4-c958-4830-8a6a-72fbe92b1862",
+ "id": "1399c6bf-2b17-80a3-8600-f228fd325105",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T08:39:00.000Z",
- "last_edited_time": "2024-05-03T10:37:00.000Z",
+ "created_time": "2024-11-09T14:08:00.000Z",
+ "last_edited_time": "2024-11-09T15:00:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -4306,7 +4218,7 @@
{
"type": "text",
"text": {
- "content": "useAppointedGoBack",
+ "content": "이로써 changeset과 github action을 활용해 버전 관리를 자동화하는 방법을 모두 설명했다.\n추가, 수정할 내용만 커밋하고 changeset를 활용해 버전의 ",
"link": null
},
"annotations": {
@@ -4314,16 +4226,16 @@
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "useAppointedGoBack",
+ "plain_text": "이로써 changeset과 github action을 활용해 버전 관리를 자동화하는 방법을 모두 설명했다.\n추가, 수정할 내용만 커밋하고 changeset를 활용해 버전의 ",
"href": null
},
{
"type": "text",
"text": {
- "content": " , ",
+ "content": "주.부.수",
"link": null
},
"annotations": {
@@ -4331,16 +4243,16 @@
"italic": false,
"strikethrough": false,
"underline": false,
- "code": false,
+ "code": true,
"color": "default"
},
- "plain_text": " , ",
+ "plain_text": "주.부.수",
"href": null
},
{
"type": "text",
"text": {
- "content": "useScrollRestoration",
+ "content": " 를 선택하고 push하면 PR 생성과 npm 배포, release tag까지 자동으로 수행해 준다. 버전 관리는 특히 여러 사람과 협업할 때 매우 중요한데 PR를 통해 다른 사람들이 편하게 확인할 수 있어 더욱 큰 장점이 된다!",
"link": null
},
"annotations": {
@@ -4348,16 +4260,43 @@
"italic": false,
"strikethrough": false,
"underline": false,
- "code": true,
+ "code": false,
"color": "default"
},
- "plain_text": "useScrollRestoration",
+ "plain_text": " 를 선택하고 push하면 PR 생성과 npm 배포, release tag까지 자동으로 수행해 준다. 버전 관리는 특히 여러 사람과 협업할 때 매우 중요한데 PR를 통해 다른 사람들이 편하게 확인할 수 있어 더욱 큰 장점이 된다!",
"href": null
- },
+ }
+ ],
+ "color": "default"
+ }
+ },
+ {
+ "object": "block",
+ "id": "1399c6bf-2b17-809c-b5e8-d61242eb2e67",
+ "parent": {
+ "type": "page_id",
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
+ },
+ "created_time": "2024-11-09T14:12:00.000Z",
+ "last_edited_time": "2024-11-09T15:01:00.000Z",
+ "created_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "last_edited_by": {
+ "object": "user",
+ "id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
+ },
+ "has_children": false,
+ "archived": false,
+ "in_trash": false,
+ "type": "paragraph",
+ "paragraph": {
+ "rich_text": [
{
"type": "text",
"text": {
- "content": " 이외에도 다른 훅도 많은데 생각보다 내용이 길어서 2개만 소개해봤다.\n코드를 왜 이렇게 짰는지, 나조차 기억이 안 났는데 정리하며 예전에 했던 생각들과 왜 이렇게 해야 했는지 리마인드할 수 있어서 좋았다.\n또 소개해볼 만한 커스텀 훅이 있으면 나중에 작성해보겠다~!",
+ "content": "주제에 대한 설명을 여기까지 하고, 이번에 글또 10기를 시작하며 처음 쓰는 글인데 거의 5개월 만의 글이라 익숙지 않았지만 AI를 활용해서 자료 찾기와 글쓰기가 조금 더 빨라졌다! 글또 10기 파이팅~",
"link": null
},
"annotations": {
@@ -4368,7 +4307,7 @@
"code": false,
"color": "default"
},
- "plain_text": " 이외에도 다른 훅도 많은데 생각보다 내용이 길어서 2개만 소개해봤다.\n코드를 왜 이렇게 짰는지, 나조차 기억이 안 났는데 정리하며 예전에 했던 생각들과 왜 이렇게 해야 했는지 리마인드할 수 있어서 좋았다.\n또 소개해볼 만한 커스텀 훅이 있으면 나중에 작성해보겠다~!",
+ "plain_text": "주제에 대한 설명을 여기까지 하고, 이번에 글또 10기를 시작하며 처음 쓰는 글인데 거의 5개월 만의 글이라 익숙지 않았지만 AI를 활용해서 자료 찾기와 글쓰기가 조금 더 빨라졌다! 글또 10기 파이팅~",
"href": null
}
],
@@ -4377,13 +4316,13 @@
},
{
"object": "block",
- "id": "1d17cbc9-32f3-449a-bb4c-de71f70ac7e4",
+ "id": "1399c6bf-2b17-8093-847e-e279e67c38a6",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:44:00.000Z",
- "last_edited_time": "2024-05-03T09:44:00.000Z",
+ "created_time": "2024-11-09T12:20:00.000Z",
+ "last_edited_time": "2024-11-09T12:20:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -4422,13 +4361,13 @@
},
{
"object": "block",
- "id": "1072eaee-8a96-480a-948a-95f7f1584c01",
+ "id": "1399c6bf-2b17-8069-8579-fbaf0f9dd001",
"parent": {
"type": "page_id",
- "page_id": "53d5749d-64fc-49af-acb6-05a35a573cdd"
+ "page_id": "1399c6bf-2b17-80f4-bfcf-e81ca24d2c5d"
},
- "created_time": "2024-05-03T09:44:00.000Z",
- "last_edited_time": "2024-05-03T09:44:00.000Z",
+ "created_time": "2024-11-09T12:20:00.000Z",
+ "last_edited_time": "2024-11-09T12:20:00.000Z",
"created_by": {
"object": "user",
"id": "5146391e-8b65-47f2-83b6-2bfe81194f32"
@@ -4443,7 +4382,7 @@
"type": "bookmark",
"bookmark": {
"caption": [],
- "url": "https://nextjs.org/docs/pages/api-reference/functions/use-router#routerbeforepopstate"
+ "url": "https://semver.org/lang/ko/"
}
}
]
diff --git a/packages/notion-to-jsx/src/components/Renderer/components/RichText/styles.css.ts b/packages/notion-to-jsx/src/components/Renderer/components/RichText/styles.css.ts
index 3708886..db1585a 100644
--- a/packages/notion-to-jsx/src/components/Renderer/components/RichText/styles.css.ts
+++ b/packages/notion-to-jsx/src/components/Renderer/components/RichText/styles.css.ts
@@ -90,4 +90,6 @@ export const richText = recipe({
export const link = style({
color: 'inherit',
textDecoration: 'underline',
+ wordBreak: 'break-word',
+ overflowWrap: 'break-word',
});