Skip to content

Commit c7ae904

Browse files
committed
update post
1 parent d47d602 commit c7ae904

7 files changed

+89
-10
lines changed

content/posts/project/blog/어떻게 블로그를 구현하였나.md

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,9 @@ tags:
44
- dev
55
- project
66
createdAt: 2025-03-08 17:12:17
7-
modifiedAt: 2025-03-16 13:15:51
7+
modifiedAt: 2025-03-17 14:41:55
88
publish: project/blog
9+
related: ""
910
series: 나의 맞춤 블로그 만들기
1011
---
1112

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
---
2+
tags:
3+
- nextjs
4+
- ssg
5+
- example
6+
createdAt: 2025-03-17 10:00:58
7+
modifiedAt: 2025-03-17 13:17:39
8+
publish: resource/nextjs
9+
related:
10+
- "[[동적 사이트 vs 정적사이트]]"
11+
series: ""
12+
---
13+
14+
# Next.js를 활용해 기본적인 블로그 만들기
Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
---
2+
tags:
3+
- web
4+
createdAt: 2025-03-10 07:39:08
5+
modifiedAt: 2025-03-17 15:03:47
6+
publish: resource/web
7+
related: ""
8+
series: ""
9+
---
10+
11+
# 동적 사이트 vs 정적사이트
12+
13+
복잡하게 생각하지 말고 단순하게 동적 사이트와 정적 사이트를 구분한다면 페이지의 렌더링 **_(화면 렌더링 아님)_** 시기 이다.
14+
15+
정적 사이트는 HTML이 빌드 타임에 미리 생성되고 수정되지 않는다.
16+
하지만 동적 사이트의 경우 클라이언트 측이든 서버 측이든 요청에 따라 HTML 이 생성되게 된다.
17+
18+
> [!caution] 화면 렌더링(브라우저의 렌더링) 과 페이지 렌더링의 차이
19+
> 동적 사이트와 정적사이트에서 표현하는 렌더링은 HTML에 대한 렌더링 이다. 즉 코드를 HTML 로 변환하는 과정을 말한다.
20+
> 화면에 대한 렌더링은 이 완성된 HTML 과 CSS 를 웹브라우져가 화면에 그려 표현해주는것을 뜻한다.
21+
> 참고: [[웹브라우저의 렌더링]]
22+
23+
## CSR,SSR,SSG
24+
25+
CSR(Client Side Rendering) 과 SSR(Server Side Rendering) 의 경우 동적 사이트로 분류될 수 있다. 왜냐하면 HTML 의 렌더링 시기 때문이다.
26+
SSR의 경우 요청에 따라 Javascript 가 담겨있는 HTML을 받아와 해당 javascript 코드를 실행하여 직접 HTML을 생성하여 렌더링 하게 된다. SSR의 경우 요청에 따라 서버 측에서 HTML 을 생성하여 클라이언트로 전송한다.
27+
28+
CSR과 SSR둘 다 요청 이후에 필요에 따라 HTML이 새로 만들어지며 이 때문에 **_동적 사이트_** 방식으로 분류될 수 있다.
29+
30+
SSG의 경우 HTML 을 빌드 타임에 미리 생성하게 되기 때문에 **_정적 사이트_**로 분류될 수 있다.
31+
32+
참고: [[CSR vs SSR vs SSG]]

public/link-map.json

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
{
22
"0.inbox/개인 블로그를 제작하게 된 이유.md": "project/blog/개인 블로그를 제작하게 된 이유",
3-
"0.inbox/어떻게 블로그를 구현하였나.md": "project/blog/어떻게 블로그를 구현하였나",
4-
"0.inbox/Aider.md": "resource/ai/Aider"
3+
"0.inbox/동적 사이트 vs 정적사이트.md": "resource/web/동적 사이트 vs 정적사이트",
4+
"0.inbox/Aider.md": "resource/ai/Aider",
5+
"0.inbox/Next.js를 활용해 기본적인 블로그 만들기.md": "resource/nextjs/Next.js를 활용해 기본적인 블로그 만들기",
6+
"0.inbox/어떻게 블로그를 구현하였나.md": "project/blog/어떻게 블로그를 구현하였나"
57
}

public/meta-data.json

Lines changed: 29 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -11,15 +11,15 @@
1111
"publish": "project/blog"
1212
},
1313
{
14-
"urlPath": "project/blog/어떻게 블로그를 구현하였나",
15-
"title": "어떻게 블로그를 구현하였나",
14+
"urlPath": "resource/web/동적 사이트 vs 정적사이트",
15+
"title": "동적 사이트 vs 정적사이트",
1616
"summary": "",
1717
"image": "",
18-
"tags": ["blog", "dev", "project"],
19-
"series": "나의 맞춤 블로그 만들기",
20-
"createdAt": "2025-03-08 17:12:17",
21-
"modifiedAt": "2025-03-16 13:15:51",
22-
"publish": "project/blog"
18+
"tags": ["web"],
19+
"series": "",
20+
"createdAt": "2025-03-10 07:39:08",
21+
"modifiedAt": "2025-03-17 15:03:47",
22+
"publish": "resource/web"
2323
},
2424
{
2525
"urlPath": "resource/ai/Aider",
@@ -31,5 +31,27 @@
3131
"createdAt": "2025-03-10 08:21:08",
3232
"modifiedAt": "2025-03-16 13:16:45",
3333
"publish": "resource/ai"
34+
},
35+
{
36+
"urlPath": "resource/nextjs/Next.js를 활용해 기본적인 블로그 만들기",
37+
"title": "Next.js를 활용해 기본적인 블로그 만들기",
38+
"summary": "",
39+
"image": "",
40+
"tags": ["nextjs", "ssg", "example"],
41+
"series": "",
42+
"createdAt": "2025-03-17 10:00:58",
43+
"modifiedAt": "2025-03-17 13:17:39",
44+
"publish": "resource/nextjs"
45+
},
46+
{
47+
"urlPath": "project/blog/어떻게 블로그를 구현하였나",
48+
"title": "어떻게 블로그를 구현하였나",
49+
"summary": "",
50+
"image": "",
51+
"tags": ["blog", "dev", "project"],
52+
"series": "나의 맞춤 블로그 만들기",
53+
"createdAt": "2025-03-08 17:12:17",
54+
"modifiedAt": "2025-03-17 14:41:55",
55+
"publish": "project/blog"
3456
}
3557
]
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"content": "\n# Next.js를 활용해 기본적인 블로그 만들기\n",
3+
"plainContent": ""
4+
}
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"content": "\n# 동적 사이트 vs 정적사이트\n\n복잡하게 생각하지 말고 단순하게 동적 사이트와 정적 사이트를 구분한다면 페이지의 렌더링 **_(화면 렌더링 아님)_** 시기 이다.\n\n정적 사이트는 HTML이 빌드 타임에 미리 생성되고 수정되지 않는다.\n하지만 동적 사이트의 경우 클라이언트 측이든 서버 측이든 요청에 따라 HTML 이 생성되게 된다.\n\n> [!caution] 화면 렌더링(브라우저의 렌더링) 과 페이지 렌더링의 차이\n> 동적 사이트와 정적사이트에서 표현하는 렌더링은 HTML에 대한 렌더링 이다. 즉 코드를 HTML 로 변환하는 과정을 말한다.\n> 화면에 대한 렌더링은 이 완성된 HTML 과 CSS 를 웹브라우져가 화면에 그려 표현해주는것을 뜻한다.\n> 참고: [[웹브라우저의 렌더링]]\n\n## CSR,SSR,SSG\n\nCSR(Client Side Rendering) 과 SSR(Server Side Rendering) 의 경우 동적 사이트로 분류될 수 있다. 왜냐하면 HTML 의 렌더링 시기 때문이다.\nSSR의 경우 요청에 따라 Javascript 가 담겨있는 HTML을 받아와 해당 javascript 코드를 실행하여 직접 HTML을 생성하여 렌더링 하게 된다. SSR의 경우 요청에 따라 서버 측에서 HTML 을 생성하여 클라이언트로 전송한다.\n\nCSR과 SSR둘 다 요청 이후에 필요에 따라 HTML이 새로 만들어지며 이 때문에 **_동적 사이트_** 방식으로 분류될 수 있다.\n\nSSG의 경우 HTML 을 빌드 타임에 미리 생성하게 되기 때문에 **_정적 사이트_**로 분류될 수 있다.\n\n참고: [[CSR vs SSR vs SSG]]\n",
3+
"plainContent": "복잡하게 생각하지 말고 단순하게 동적 사이트와 정적 사이트를 구분한다면 페이지의 렌더링 _(화면 렌더링 아님)_ 시기 이다.\n정적 사이트는 HTML이 빌드 타임에 미리 생성되고 수정되지 않는다.\n하지만 동적 사이트의 경우 클라이언트 측이든 서버 측이든 요청에 따라 HTML 이 생성되게 된다.\n> [!caution] 화면 렌더링(브라우저의 렌더링) 과 페이지 렌더링의 차이\n> 동적 사이트와 정적사이트에서 표현하는 렌더링은 HTML에 대한 렌더링 이다. 즉 코드를 HTML 로 변환하는 과정을 말한다.\n> 화면에 대한 렌더링은 이 완성된 HTML 과 CSS 를 웹브라우져가 화면에 그려 표현해주는것을 뜻한다.\n> 참고: 웹브라우저의 렌더링]]\nCSR(Client Side Rendering) 과 SSR(Server Side Rendering) 의 경우 동적 사이트로 분류될 수 있다. 왜냐하면 HTML 의 렌더링 시기 때문이다.\nSSR의 경우 요청에 따라 Javascript 가 담겨있는 HTML을 받아와 해당 javascript 코드를 실행하여 직접 HTML을 생성하여 렌더링 하게 된다. SSR의 경우 요청에 따라 서버 측에서 HTML 을 생성하여 클라이언트로 전송한다.\nCSR과 SSR둘 다 요청 이후에 필요에 따라 HTML이 새로 만들어지며 이 때문에 _동적 사이트_ 방식으로 분류될 수 있다.\nSSG의 경우 HTML 을 빌드 타임에 미리 생성하게 되기 때문에 _정적 사이트_로 분류될 수 있다.\n참고: [[CSR vs SSR vs SSG"
4+
}

0 commit comments

Comments
 (0)