TIL 3

์†œ์ฃผ๋จนยท2022๋…„ 8์›” 7์ผ
0

TIL

๋ชฉ๋ก ๋ณด๊ธฐ
3/6
post-custom-banner

๐Ÿ“ขNotice

  • ๊ตฌ์–ด์ฒด๋กœ ์ž‘์„ฑ๋˜์–ด ์žˆ์–ด ์•Œ์•„๋ณด๊ธฐ ํž˜๋“ค ์ˆ˜ ์žˆ์Œ
  • ๋ฐ€๋ ค์žˆ๋˜ TIL์„ ์ •๋ฆฌํ•ด๋†“์€ ๊ฒƒ
  • ์–ธ์ œ ๋ฐฐ์› ๋Š”์ง€ ๋‚ ์งœ๊ฐ€ ๊ธฐ์–ต ์•ˆ๋‚จ (์•„๋งˆ๋„ 7์›” 27์ผ)



๐Ÿ“Œ ๋ฆฌ๋•์Šค

๐Ÿ“– ์„ค์น˜

  • ๋ฆฌ๋•์Šค์™€ ๋ฆฌ์•กํŠธ์šฉ ๋ฆฌ๋•์Šค ์„ค์น˜
yarn add redux react-redux

๐Ÿ“– ํด๋” ๋ถ„๋ฐฐ

  • storeConfig๋ผ๋Š” ์Šคํ† ์–ด ์„ค์ •ํŒŒ์ผ์šฉ jsํ•˜๋‚˜์™€ ๋ชจ๋“ˆ ๋ชจ์•„๋‘˜ modulesํด๋”์•ˆ์— ๋ชจ๋“ˆ.js ๋งŒ๋“ค๊ธฐ
  • ๊นก ๋ฆฌ๋•์Šค ๊ธฐ์ค€ ์“ธ๋งŒํ•œ ๋ฏธ๋“ค์›จ์–ด ๋ฐ›์„ ์ˆ˜ ์žˆ๋Š”๋ฐ ๊ทธ ์ค‘ ์ž์ฃผ์“ฐ๋Š” redux-thunk์žˆ์Œ

๐Ÿ“Œ ๋ฐฐํฌํ•˜๊ธฐ

๐Ÿ“– AWS S3

  • yarn buildํ•ด์„œ build๋œ ํŒŒ์ผ ์˜ฌ๋ ค์•ผ๋จ => ์˜ฌ๋ฆฌ๊ธฐ์ „์— ๊ถŒํ•œ์˜ ์ •์ฑ… ์ƒ์„ฑํ•˜๊ธฐ

๐Ÿ“– ๋‹ค๋ฅธ ๋ฐฐํฌ๋ฐฉ๋ฒ•

  • firebase ๋“ฑ๋“ฑ..

๐Ÿ“Œ ์ œ์–ด/๋น„์ œ์–ด ์ปดํฌ๋„ŒํŠธ

๐Ÿ“– ์ œ์–ด ์ปดํฌ๋„ŒํŠธ

  • ์ œ์–ด ์ปดํฌ๋„ŒํŠธ๋Š” React์— ์˜ํ•ด ๊ฐ’์ด ์ œ์–ด๋˜๋Š” ์ปดํฌ๋„ŒํŠธ
  • ์˜ˆ์‹œ
    (input์ž…๋ ฅ์‹œ onchange ์ด๋ฒคํŠธ ๋ฐœ์ƒ โ‡’ ์ด๋ฒคํŠธ ๋ฐœ์ƒ๋งˆ๋‹ค state์— ์ €์žฅ โ‡’ ์ด๋ฅผ ๋ฐ”ํƒ•์œผ๋กœ input์— ๋‹ค์‹œ ๊ฐ’์„ ์ž…๋ ฅํ•ด์ฃผ๋Š” state๊ธฐ์ค€์œผ๋กœ ๊ฐ’ ๊ด€๋ฆฌ(์–‘๋ฐฉํ–ฅ ๋ฐ”์ธ๋”ฉ ๋ฐฉ์‹) โ‡’
    ์ปดํฌ๋„ŒํŠธ์˜ ๋ฆฌ๋ Œ๋”๋ง ์กฐ๊ฑด(์ƒํƒœ ๋ณ€๊ฒฝ(state))์— ๋”ฐ๋ผ ๊ณ„์† ๋ฆฌ๋ Œ๋”๋ง ๋ฐœ์ƒ)

๐Ÿ“– ๋น„์ œ์–ด ์ปดํฌ๋„ŒํŠธ

  • ๋น„์ œ์–ด ์ปดํฌ๋„ŒํŠธ๋Š” React์— ์˜ํ•ด ๊ฐ’์ด ์ œ์–ด๋˜์ง€ ์•Š๋Š” ์ปดํฌ๋„ŒํŠธ
  • ์˜ˆ์‹œ
    (useRef๋กœ input์„ ์ฐธ์กฐ๋งŒ ํ•ด๋‘๊ณ  ๋ณ„๋„ ์ด๋ฒคํŠธ ๋ฐœ์ƒ ์‹œ ๊ทธ ๊ฐ’๋งŒ ๊ฐ€์ ธ์™€ ํ™œ์šฉ โ‡’ state์— ์ €์žฅ์ด๋˜์ง€ ์•Š์œผ๋‹ˆ ๋ณ„๋„์˜ ๋ฆฌ๋ Œ๋”๋ง๋„ ๋ฐœ์ƒํ•˜์ง€ ์•Š์Œ โ‡’ ์„ฑ๋Šฅ์ƒ์˜ ์ด์ )

๐Ÿ’ฌ ์ •๋ฆฌ : ๋น„์ œ์–ด ์ปดํฌ๋„ŒํŠธ๋กœ ๊ตฌํ˜„ ๊ฐ€๋Šฅํ•˜๋ฉด ๋น„์ œ์–ด๋กœ ํ•˜์ž


๐Ÿ’ก ๋„์ ์˜€๋˜ ์›๋ณธ ํ…์ŠคํŠธํŒŒ์ผ

  • ๋‚จ๋ณด์—ฌ์ฃผ๊ธด ๋ถ€๋„๋Ÿฌ์›Œ์„œ ๋ ˆํฌ๋ฅผ private๋กœ ๋Œ๋ ค๋†จ๋‹ค
  • ๊ทธ๋ž˜์„œ ๋‚˜๋งŒ ๋ณผ์ˆ˜ ์žˆ์„๊ฑฐ๊ฐ™๋‹ค
    somfist-github
post-custom-banner

0๊ฐœ์˜ ๋Œ“๊ธ€