[220217] TIL

2022. 2. 17. 22:35ยท ๊ฐœ๋ฐœ/๐Ÿ“ TIL
๋ชฉ์ฐจ
  1. ๐Ÿ‘ฉ๐Ÿปโ€๐Ÿ’ป Today I Learned ๐Ÿ“š
728x90
๋ฐ˜์‘ํ˜•

๐Ÿ‘ฉ๐Ÿปโ€๐Ÿ’ป Today I Learned ๐Ÿ“š

 

 

 

 

โœจ ๋ธ”๋กœ๊ทธ ์ด์ „!

๊ณต๋ถ€ํ•˜๋Š” ๋‚ด์šฉ๋“ค์„ ๊ธฐ๋กํ•ด๋ณด์ž๊ณ  ๋งŒ๋“ค์—ˆ๋˜ ์›Œ๋“œํ”„๋ ˆ์Šค ๋ธ”๋กœ๊ทธ๊ฐ€ ๊ณ„์†ํ•ด์„œ ๋ฒ„๊ทธ๊ฐ€ ๋ฐœ์ƒํ•˜๋ฉฐ ๋ถˆ์•ˆ์ •ํ•˜๋”๋‹ˆ ๊ฒฐ๊ตญ์—๋Š” ๋‚ฎ์‹œ๊ฐ„๋™์•ˆ ์ ‘์†์ด ์•ˆ ๋˜๋Š” ์ƒํ™ฉ์ด ๋ฐœ์ƒ. ์กฐํšŒ์ˆ˜๊ฐ€ ์—„์ฒญ ๋‚ฌ๋‹ค์‹ถ์—ˆ๋”๋‹ˆ ๊ณ„์† ํ”Œ๋Ÿฌ๊ทธ์ธ ๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ•˜๊ณ  ์žˆ์—ˆ๋‚˜๋ณด๋‹ค. ๊ทธ๋ž˜์„œ ์ด ์ค‘์š”ํ•œ ์‹œ๊ธฐ์— ๋‚˜๋Š” ๋ธ”๋กœ๊ทธ ์ด์ „์„ ๊ฒฐ์ •ํ–ˆ๋‹ค. ํ•œ ๋‘ํ•ด ํ•˜๊ณ  ๋ง ๊ฒƒ๋„ ์•„๋‹ˆ๊ณ  ๊ณ„์†ํ•ด์„œ ์ด๋Ÿฐ ์‹์ด๋ฉด ๊ณค๋ž€ํ•˜๋‹ค๋Š” ์ƒ๊ฐ์— ๋น ๋ฅด๊ฒŒ ์ด์ „์„ ๊ฒฐ์ •. ๊ทธ๋ฆฌ๊ณ  ์ด์ „ ์ž‘์—…์— ์ฐฉ์ˆ˜ํ–ˆ๋‹ค! ๋‹ค ๊ฐ€์ ธ์˜ฌ ์ƒ๊ฐ๋„ ์•„๋‹ˆ๊ณ  ์›Œ๋“œํ”„๋ ˆ์Šค ๋ธ”๋กœ๊ทธ๋ฅผ ๋ฐ”๋กœ ํ์‡„ํ•  ์ˆ˜ ์—†๊ธฐ๋•Œ๋ฌธ์— ์ด์ „์„ ์•Œ๋ฆฌ๋Š” ๊ธ€์„ ์ ์–ด๋‘๊ณ  ์—ฌ๊ธฐ์—๋„ ํ•œ๋™์•ˆ์€ ์›Œ๋“œํ”„๋ ˆ์Šค ๋ธ”๋กœ๊ทธ๋ฅผ ์—ฐ๋™์‹œ์ผœ ๋‘˜ ์ƒ๊ฐ์ด๋‹ค. 

 

+์ถ”๊ฐ€) ๋„๋ฉ”์ธ ๊ด€๋ฆฌ์ž์™€ ์ด์•ผ๊ธฐ๋ฅผ ํ–ˆ๋Š”๋ฐ, ๋ธ”๋กœ๊ทธ์— ์žˆ๋Š” ๊ธ€ ์ž์ฒด๋ฅผ ์‚ด๋ฆด ์ˆ˜๊ฐ€ ์—†๋‹ค๊ณ ํ•œ๋‹ค. ์•„๋‹ˆ ๋ฌด์Šจ ์ด๋Ÿฐ ์–ด์ฒ˜๊ตฌ๋‹ˆ์—†๋Š” ๊ฒฝ์šฐ๊ฐ€...ํ•ญํ•ด99๋ฅผ ํ•˜๋ฉด์„œ ์ ์—ˆ๋˜ ๋ชจ๋“  ๋‚ด์šฉ๋“ค์ด ์‚ฌ๋ผ์ง„๋‹ค. ๊ทธ๋™์•ˆ ์ฝ”๋”ฉํ…Œ์ŠคํŠธํ•˜๋ฉด์„œ ์ž‘์„ฑํ•ด๊ฐ”๋˜ ๋ชจ๋“ ๊ฒŒ ์‚ฌ๋ผ์ง„๋‹ค ๐Ÿ˜ญ ๋‹ค๊ธ‰ํ•˜๊ฒŒ ํ”Œ๋Ÿฌ๊ทธ์ธ ์ด์Šˆ์™€ ๋„๋ฉ”์ธ์ด์Šˆ ๊ด€๋ จ ์ด๋ฉ”์ผ ๋ฐ›์€๊ฒŒ ์žˆ๋Š”๊ฐ€ ์ฐพ์•„๋ดค๋Š”๋ฐ ์—†๋‹ค ์•„๋ฌด๊ฒƒ๋„!! ์•„ ์ง„์งœ ๋„ˆ๋ฌด ํ™”๊ฐ€ ๋‚œ๋‹ค. ๋‚ด ํ”ผ๊ฐ™์€ ํฌ์ŠคํŠธ๋“ค ๐Ÿ˜ญ

 

 

โœจ Next.js๋ฅผ ์‚ด์ง ๊ณต๋ถ€ํ•ด๋ณด๋‹ค. 

๊ณผ์ œ ์ „ํ˜•์„ ์ง„ํ–‰ํ•˜๋ฉด์„œ next.js๋ฅผ ์“ฐ๊ฒŒ ๋˜์—ˆ๋Š”๋ฐ, ๋‹จ์ˆœํ•˜๊ฒŒ nextjs๋Š” react.js๋ž‘ ๋‹ค๋ฅผ๊ฑฐ ์—†์ง€ ๋ผ๊ณ  ์ƒ๊ฐํ•˜๋ฉฐ ์‹œ์ž‘ํ–ˆ๋Š”๋ฐ, ์›ฌ๊ฑธ ํž˜๋“ค์—ˆ๋‹ค. ํŽ˜์ด์ง€๋ฅผ ๋‚˜๋ˆ„๊ณ  ์ปดํฌ๋„ŒํŠธ๋ฅผ ๋‚˜๋ˆ„๋Š” ๋ถ€๋ถ„์€ ๋ฆฌ์•กํŠธ์™€ ํฌ๊ฒŒ ๋‹ค๋ฅด์ง€ ์•Š์•„์„œ ์–ด๋ ต์ง€ ์•Š์•˜๋‹ค. ๋‹ค๋งŒ SSR.

getServerSideProps(SSR) ์ด๋ถ€๋ถ„์„ ์ž‘์„ฑํ•  ๋•Œ ์™„์ „ ๊ฝ‰! ๋ง‰ํ˜”๋‹ค. getServerSideProps๋Š” ๋Ÿฐํƒ€์ž„์— ์‹คํ–‰๋˜๋Š” Next.js์˜ SSR ๋ฉ”์†Œ๋“œ์ด๋‹ค. ์„œ๋ฒ„ ์ธก์— ๋ฒˆ๋“ค๋ง๋˜๋ฉฐ, Viewport ๋‚ด์— getServerSideProps๋ฅผ ๊ฐ€์ง„ ํŽ˜์ด์ง€ ์ปดํฌ๋„ŒํŠธ์— ๋Œ€ํ•œ Link๊ฐ€ ์žˆ์„ ๊ฒฝ์šฐ, CSS์™€ JS๋ฅผ prefetch ํ•˜๊ณ , ๋งํฌ ํด๋ฆญ ์‹œ getServerSideProps๋ฅผ ์‹คํ–‰ํ•˜์—ฌ json ๋ฐ์ดํ„ฐ๋ฅผ ๋ฐ›์•„์˜จ๋‹ค. ์ด๋Ÿฐ ์„ค๋ช…์„ ์ดํ•ด๋ฅผ ๋ชปํ•ด์„œ ์ œ๋Œ€๋กœ ๊ตฌํ˜„ํ•ด๋‚ด์ง€ ๋ชป ํ–ˆ๋‹ค. ์ด๋ถ€๋ถ„์—์„œ ์ง„์งœ ํญ๋ง.... ํญ๋ง์ด๋ผ๋Š”๊ฑธ ์•Œ์•˜์œผ๋‹ˆ ์ด์ œ ๊ณต๋ถ€ํ•˜๋ฉด ๋œ๋‹ค!! ๐Ÿ˜ญ ๊ทธ๋ž˜๋„ ์•„์‰ฌ์šด ๋งˆ์Œ์ด ๋„ˆ๋ฌด ํฌ๋‹ค. ๐Ÿ˜ญ๐Ÿ˜ญ

 

 

 

๐Ÿ“ƒ ๋‚ด์ผ ํ•  ์ผ

โ–ธ๋ฉด์ ‘ ๊ณต๋ถ€ (ํ† ์š”์ผ ๋ฉด์ ‘์ค€๋น„!)

โ–ธํ”„๋กœ์ ํŠธ - ๋ ˆํผ๋Ÿฐ์Šค ์ •๋ฆฌ (ํ† ์š”์ผ ์˜ค์ „ ํšŒ์˜์ค€๋น„!)

โ–ธ๋ฆฌ์•กํŠธ ๋„ค์ดํ‹ฐ๋ธŒ ๊ฐ•์˜ ๋“ค์–ด์•ผํ•จ!! ๐Ÿ˜ต

 

 

 

 

 

728x90

'๊ฐœ๋ฐœ > ๐Ÿ“ TIL' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€

[220223] Happy B Day - TIL  (0) 2022.02.24
[220221] TIL  (0) 2022.02.22
[220220] TIL  (0) 2022.02.21
[220218] TIL  (0) 2022.02.19
๊ฐœ๋ฐœ์ž๊ฐ€ ๋˜๊ธฐ๋กœ ๊ฒฐ์‹ฌํ•œ ์ด์œ   (0) 2022.02.18
  1. ๐Ÿ‘ฉ๐Ÿปโ€๐Ÿ’ป Today I Learned ๐Ÿ“š
'๊ฐœ๋ฐœ/๐Ÿ“ TIL' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€
  • [220221] TIL
  • [220220] TIL
  • [220218] TIL
  • ๊ฐœ๋ฐœ์ž๊ฐ€ ๋˜๊ธฐ๋กœ ๊ฒฐ์‹ฌํ•œ ์ด์œ 
๋ฐ(Ming) ๐Ÿˆโ€โฌ›
๋ฐ(Ming) ๐Ÿˆโ€โฌ›
๐Ÿ‘ฉ๐Ÿปโ€๐Ÿ’ป Frontend Developer
๋ฐ(Ming) ๐Ÿˆโ€โฌ›
Ming devlog
๋ฐ(Ming) ๐Ÿˆโ€โฌ›
์ „์ฒด
์˜ค๋Š˜
์–ด์ œ

๊ณต์ง€์‚ฌํ•ญ

  • About Ming ๐Ÿฐ
  • ๋ถ„๋ฅ˜ ์ „์ฒด๋ณด๊ธฐ (261)
    • ๊ฐœ๋ฐœ (255)
      • ๐Ÿ“ TIL (58)
      • โŒ ์˜ค๋ฅ˜ ๋…ธํŠธ (23)
      • React (23)
      • Next.js (11)
      • React-Native (6)
      • JavaScript (10)
      • Flutter (19)
      • Database (1)
      • ๐Ÿ’ฌ ์ฝ”๋”ฉํ…Œ์ŠคํŠธ (21)
      • ๐Ÿ“š English (9)
      • Etc... (25)
      • โ›ต ํ•ญํ•ด99 (49)
    • ๐Ÿ’ป Dev (6)
      • ๐Ÿ“ TIL (4)
      • ๐Ÿ’ฌ Algorithm (1)
      • Etc... (1)

์ธ๊ธฐ ๊ธ€

ํƒœ๊ทธ

  • nextjs
  • ์ฝ”๋”ฉํ…Œ์ŠคํŠธ
  • ํ”Œ๋Ÿฌํ„ฐ
  • Firebase
  • ์ฝ”๋”ฉ๊ณต๋ถ€
  • ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ
  • ์ฝ”ํ…Œ
  • react-native
  • ์ŠคํŒŒ๋ฅดํƒ€์ฝ”๋”ฉํด๋Ÿฝ
  • ์˜์–ด๊ณต๋ถ€
  • ๋ฆฌ์•กํŠธ
  • ๊ฐœ๋ฐœ์žํšŒ๊ณ 
  • flutter
  • leetcode
  • ReactNative
  • react
  • ์ฝ”ํ…Œ๊ณต๋ถ€
  • ๋ถ€ํŠธ์บ ํ”„
  • ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ
  • ๊ฐœ๋ฐœ์ž์ผ๊ธฐ
  • ์ด์ฝ”๋…ธ๋ฏธ์ŠคํŠธ
  • ๋ฆฌ์•กํŠธ๋„ค์ดํ‹ฐ๋ธŒ
  • Git
  • TIL
  • ํ”„๋กœ๊ทธ๋ž˜๋จธ์Šค
  • ํ•ญํ•ด99
  • ์•Œ๊ณ ๋ฆฌ์ฆ˜
  • twid
  • todaywhatidid
  • github

์ตœ๊ทผ ๋Œ“๊ธ€

์ตœ๊ทผ ๊ธ€

250x250
hELLO ยท Designed By ์ •์ƒ์šฐ.v4.2.1
๋ฐ(Ming) ๐Ÿˆโ€โฌ›
[220217] TIL
์ƒ๋‹จ์œผ๋กœ

ํ‹ฐ์Šคํ† ๋ฆฌํˆด๋ฐ”

๊ฐœ์ธ์ •๋ณด

  • ํ‹ฐ์Šคํ† ๋ฆฌ ํ™ˆ
  • ํฌ๋Ÿผ
  • ๋กœ๊ทธ์ธ

๋‹จ์ถ•ํ‚ค

๋‚ด ๋ธ”๋กœ๊ทธ

๋‚ด ๋ธ”๋กœ๊ทธ - ๊ด€๋ฆฌ์ž ํ™ˆ ์ „ํ™˜
Q
Q
์ƒˆ ๊ธ€ ์“ฐ๊ธฐ
W
W

๋ธ”๋กœ๊ทธ ๊ฒŒ์‹œ๊ธ€

๊ธ€ ์ˆ˜์ • (๊ถŒํ•œ ์žˆ๋Š” ๊ฒฝ์šฐ)
E
E
๋Œ“๊ธ€ ์˜์—ญ์œผ๋กœ ์ด๋™
C
C

๋ชจ๋“  ์˜์—ญ

์ด ํŽ˜์ด์ง€์˜ URL ๋ณต์‚ฌ
S
S
๋งจ ์œ„๋กœ ์ด๋™
T
T
ํ‹ฐ์Šคํ† ๋ฆฌ ํ™ˆ ์ด๋™
H
H
๋‹จ์ถ•ํ‚ค ์•ˆ๋‚ด
Shift + /
โ‡ง + /

* ๋‹จ์ถ•ํ‚ค๋Š” ํ•œ๊ธ€/์˜๋ฌธ ๋Œ€์†Œ๋ฌธ์ž๋กœ ์ด์šฉ ๊ฐ€๋Šฅํ•˜๋ฉฐ, ํ‹ฐ์Šคํ† ๋ฆฌ ๊ธฐ๋ณธ ๋„๋ฉ”์ธ์—์„œ๋งŒ ๋™์ž‘ํ•ฉ๋‹ˆ๋‹ค.