Frontend ๊ฐœ๋ฐœ์ž - hyo.loui

(React) WIL - 13์ฃผ์ฐจ ํšŒ๊ณ  ๋ณธ๋ฌธ

WIL

(React) WIL - 13์ฃผ์ฐจ ํšŒ๊ณ 

hyo.loui 2023. 1. 28. 18:08

๐Ÿ“ WIL: Weekly I Learned

 


Work done this week

์ด๋ฒˆ ์ฃผ ๋๋‚ธ ์ผ!

  1. ํ‹ฐ์Šคํ† ๋ฆฌ ํฌ์ŠคํŒ… = ๋งค์ผ TIL ์ผ์ง€ (๋ชฉ์ , ์ •๋ฆฌ๋กœ ์„ธ๋ถ„ํ™”)
  2. Project : Develife = ํ”„๋กœ์ ํŠธ ์‹œ์ž‘ ( ๊ธฐํš >> ์™€์ด์–ดํ”„๋ ˆ์ž„ >> ๋ ˆ์ด์•„์›ƒ(UI)
  3. javascript ์Šคํ„ฐ๋”” = ๊ฐ์ž ๋ฐœํ‘œ chapter ์ •ํ•˜๊ณ  ์‹œ์ž‘(๋ชจ๋˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋”ฅ๋‹ค์ด๋ธŒ ๊ต์žฌ)

 


 

๐Ÿ“š Study review

 

ํ”„๋กœ์ ํŠธ ๋งˆ๋ฌด๋ฆฌ๊ฐ€ ๋˜์–ด๊ฐ€๋ฉด์„œ

์ด๋ฒˆ์ฃผ๋Š” ๊ณต๋ถ€์— ๋ชฉ์ ์„ ๋‘์ง€ ๋ชปํ–ˆ๋‹ค..

 

์ด๋ฒˆ ํŒ€์›์„ ์ž˜ ๋งŒ๋‚˜์„œ

๋ชจ๋˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์Šคํ„ฐ๋””๋ฅผ ๊ฒฐ์„ฑํ•˜๊ณ 

ํ•œ๋‹ฌ ์ด๋‚ด์— ๋ชจ๋“  ์ฑ•ํ„ฐ๋ฅผ  ํ•˜๋‚˜์”ฉ ๋Œ์•„๊ฐ€๋ฉด์„œ

์ •ํ•ด๋‘” ๋ฐœํ‘œ์‹œ๊ฐ„ (์•ฝ 15๋ถ„)์— ๋ฐœํ‘œ๋ฅผ ํ•˜๊ณ ,

 

๋‚˜๋จธ์ง€ ์ฑ•ํ„ฐ๋Š” ์ •๋… ํ•˜๋ฉด์„œ ์Šคํ„ฐ๋””๋ฅผ ํ•˜๊ธฐ๋กœ ๊ฒฐ์„ฑ๋˜์—ˆ๋‹ค!

 

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๊ฐ€ ๋‚ด์šฉ์ด ์ด๋ ‡๊ฒŒ ๋งŽ์€ ์ค„๋„ ๋ชฐ๋ž๊ณ 

์ด๋ ‡๊ฒŒ ๊นŠ์€ ๋‚ด์šฉ๊นŒ์ง€ ๋‹ค๋ค„์ง„ ์„œ์ ์„ ์˜ค๋žœ๋งŒ์— ๊ตฌ๋งคํ–ˆ๋‹ค

 

ํŽ˜์ด์ง€๋Š” ์•ฝ 900ํŽ˜์ด์ง€ ์ด์ƒ..

ํ•œ ์ฑ…์„ ๋“ค๊ณ ๋‹ค๋‹ˆ๊ธฐ์—๋Š” ๋„ˆ๋ฌด ๋ฒ„๊ฒ๋‹ค๋Š” ์ƒ๊ฐ์ด ๋“ค์–ด

๋ถ„์ ˆ์„ ํ–ˆ๊ณ , ๋Œ์•„์˜ค๋Š” ์ฃผ ์›”์š”์ผ์—๋Š” ๋‚ด๊ฐ€ ๋ณ€์ˆ˜์ฑ•ํ„ฐ๋ฅผ

๋งก๊ฒŒ๋˜์–ด ๋ฐœํ‘œํ•  ์˜ˆ์ •์ด๋‹ค!

 

๋‚ด์ผ์€ ๋ฐœํ‘œ์ค€๋น„๋ฅผ ํ•ด์•ผ๊ฒ ๋‹ค!

 


๐Ÿงฑ  Project Start

 

ํ”„๋กœ์ ํŠธ ์ง„ํ–‰์ด ๊ฑฐ์˜ ๋งˆ๋ฌด๋ฆฌ ๋˜์—ˆ๊ณ ,

์šฐ๋ฆฌ๊ฐ€ ๋งก๊ฒŒ ๋œ ๋ฉ”์ธํŽ˜์ด์ง€์™€, Youtube API ํ†ต์‹ ์€

๋๋‚˜๊ฒŒ ๋˜์—ˆ๋‹ค.

 

๊ทธ๋ž˜์„œ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋กœ ๋ฆฌํŽ™ํ† ๋ง์„ ์ง„ํ–‰ํ–ˆ๊ณ ,

์‰ฝ์ง€ ์•Š์•˜๋‹ค. ํ•˜์ง€๋งŒ ๊ฐ™์€ ํฌ์ง€์…˜์„ ๋‹ด๋‹น(ํŽ˜์–ด) ์กฐ์›๋ถ„๊ณผ

Live Share ๋ฅผ ํ™œ์šฉํ•ด ํŽ˜์–ด์ฝ”๋”ฉ์„ ์ฒ˜์Œ ๊ฒฝํ—˜ํ–ˆ๋‹ค.

 

๊ทธ๋ฆฌ๊ณ  typescript๋กœ ์ง„ํ–‰ํ•˜๋ฉฐ ๋งŒ๋‚œ

์ˆ˜ ๋งŽ์€ ์—๋Ÿฌ(ํ”ผ๋ฒ”๋ฒ…)๋“ค์„ ๋น ๋ฅด๊ฒŒ ํ•ด๊ฒฐํ•ด ๋‚˜๊ฐˆ ์ˆ˜ ์žˆ์—ˆ๋‹ค.

 

ํŒ€์œผ๋กœ ๊ฐ™์€ ๋ฐฉํ–ฅ์œผ๋กœ ํ•ฉ์„ ๋งž์ถฐ๊ฐ€๋Š”๊ฒƒ์€ ์–ด๋ ค์šด ์ผ ์ด์ง€๋งŒ

๋ฐฉํ–ฅ์ด ์ž˜ ๋งž์•„ ์—„์ฒญ๋‚œ ์‹œ๋„ˆ์ง€ํšจ๊ณผ, ์†๋„๋ฅผ ๊ฒฝํ—˜ํ–ˆ๋˜ ๊ฒƒ ๊ฐ™๋‹ค.

 

์„œ๋กœ ๋ฐฐ๋ คํ•˜๋ฉด์„œ ์‹œ๊ฐ„ ๊ฐ€๋Š” ์ค„ ๋ชจ๋ฅด๊ณ  ์ฝ”๋”ฉ์„ ํ–ˆ๊ณ ,

ํ•œ ์‚ฌ๋žŒ์ด ๋ฌธ์ œ์— ๋„๋‹ฌํ–ˆ์„ ๋•Œ ๋‹ค๋ฅธ ์‚ฌ๋žŒ์˜ ์‹œ์„ ์œผ๋กœ

ํ•ด๊ฒฐ๋ฐฉ์•ˆ(์†”๋ฃจ์…˜)์ด ๋‚˜์˜ค๋Š” ๊ฒฝ์šฐ๊ฐ€ ๋งŽ์•˜๋‹ค.

 

์ด๋ฒˆ ํ”„๋กœ์ ํŠธ๋กœ ๋‹ค์‹œํ•œ๋ฒˆ ํŒ€์›Œํฌ์˜ ์ค‘์š”์„ฑ์„ ๊นจ๋‹ณ์€ ๊ฒƒ ๊ฐ™๋‹ค.

 


p.s

 

์บ ํ”„ ์ตœ์ข… ํ”„๋กœ์ ํŠธ๊ฐ€ ์–ผ๋งˆ ์•ˆ๋‚จ์•˜๋‹ค.

 

์ด๋ฒˆ ๊ธฐํšŒ๋กœ ์ฑŒ๋ฆฐ์ง€ ํŒ€์— ์ง€์›ํ•ด์„œ

์šด์ด ์ข‹๊ฒŒ ์„ ๋ฐœ์ด ๋˜์—ˆ๋‹ค!

์„ค๋ ˜๋ฐ˜, ๊ธฐ๋Œ€๋ฐ˜

์ˆ˜๋งŽ์€ ๊ฐ์ •๋“ค์ด ๋ณต์žก ๋ฏธ๋ฌ˜ํ•˜๊ฒŒ ๋‹ค๊ฐ€์™”๋‹ค..ใ… ใ… 

 

์—ด์‹ฌํžˆ ํ•œ ๋ณด๋žŒ์ด ์žˆ์—ˆ๋˜ ๊ฑธ๊นŒ(?)

๋‚ด๊ฐ€ ๋’ค์ณ์ง€์ง€ ์•Š๊ณ  ์ž˜ ํ•  ์ˆ˜ ์žˆ์„๊นŒ(?)

์ง„์งœ ์‹ ์ด ์ฃผ์‹  ๊ธฐํšŒ๊ฐ€ ์•„๋‹๊นŒ(?)

 

๋งŽ์€ ์ƒ๊ฐ์ด ๋“ค์—ˆ๊ณ ,

๋‹ค์‹œํ•œ๋ฒˆ ๋งˆ์Œ์„ ๋‹ค์žก๊ณ  ๋งˆ์ง€๋ง‰๊นŒ์ง€

์ตœ์„ ์„ ๋‹คํ•ด๋ณด์ž๋Š” ์˜์š•์ด ์†Ÿ์•˜๋‹ค..

 

 

์–ธ์ œ๋‚˜ ๊ทธ๋žฌ๋“ฏ์ด

๐Ÿฆพ ๋น ์ดํŒ…๊ทธ.

 


 

2023๋…„ 1์›” 1 week 2 week 3 week 4 week (project)
ํ•™์Šต ๋‚ด์šฉ
(ํ”„๋กœ์ ํŠธ)
RN ์‹ฌํ™” ๊ฐ•์˜ ์ˆ˜๊ฐ•์ค‘
(react-query, firebase ์—ฐ๋™ ๋“ฑ)


ํ”„๋กœ์ ํŠธ(MZL) ์ง„ํ–‰์ค‘
RN ํ”„๋กœ์ ํŠธ
'์™•์ดˆ๋ณด mz ์™„์„ฑ: mz-language'
๋ฐฐํฌ >> ๋ฐœํ‘œ
ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ(์ˆ˜๊ฐ• > ๊ณผ์ œ > ๋ณต์Šต),

TS ํ”„๋กœ์ ํŠธ 'Develife'( ๊ธฐํš >> ์™€์ด์–ดํ”„๋ ˆ์ž„ >> ๋ ˆ์ด์•„์›ƒ(UI)
Project : Develife
( ์ž‘์—… >> ๋ฐฐํฌ >> TS๋ฆฌํŽ™ํ† ๋ง )
                                
์‚ฌ์šฉ ํˆด
defalut : VS code
npm, RN, expo, react-query, github npm, RN, expo, react-query, github react-query, typescript, Firebase(DB), emotion react-query (Youtube API), typescript, Firebase(DB), emotion