์ผ | ์ | ํ | ์ | ๋ชฉ | ๊ธ | ํ |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- ์๊ณ ๋ฆฌ์ฆ
- trainning
- rn
- ์๋ฐ์คํฌ๋ฆฝํธ
- Firebase
- JavaScript
- ์๋ฌ
- ๋ถํธ์บ ํ
- ๋ณ์
- ๋ฆฌ์กํธ
- K-Digital
- JS
- native
- ํ์
- PROJECT
- ํจ์
- ๊ฐ๋ฐ์
- ๋ด์ผ๋ฐฐ์์บ ํ
- API
- ํ์ค
- ์จ๋ผ์ธ
- type
- ๋ด์ผ๋ฐฐ์
- ํ๋ก ํธ์๋
- Redux
- wil
- NEXT
- react
- ์ฝ๋ฉ
- ํ๋ก์ ํธ
- Today
- Total
Frontend ๊ฐ๋ฐ์ - hyo.loui
(React) WIL - 17์ฃผ์ฐจ ํ๊ณ ๋ณธ๋ฌธ
๐ WIL: Weekly I Learned
Work done this week
์ด๋ฒ ํ ์ผ!
- Project : Codefolio = ํ๋ก์ ํธ ์งํ์ค ( ํด๋๋ง, ์ค๊ฐ ๋ฐํ, KTP ํ๊ณ )
๋ฐฐ์ด ๋ด์ฉ
- ์ปดํฌ๋ํธ ๋ณ ์์ ํ ํ์ด์ง์ ์ ์ฉ
- supabase ์ฐ๋ํ์ฌ ์๋ฒํต์
- Next์์์ dev dependency array
Project review
ํ ์คํฌ ๊ด๋ฆฌ, ํ๋ก์ ํธ ํ๋ก์ธ์ค๊ฐ ์ ์งํ๋๋ ๊น์ ํ ํ๋ก์ ํธ ๊ฒฝํ์ ํ๊ณ ์์ต๋๋ค.
๋์ฑ ๋ฐ์ ๋๋๋ก ๊ธฐ์ฌํ๊ณ ์ถ์ต๋๋ค!
3์ฃผ์ฐจ ์ค๊ฐ ๋ฐํ ํํฐ๋ ํผ๋๋ฐฑ
- ์ต์ข ๋ฐํ์ + ๋ถ๊ฐ์ค๋ช ์ด ํ์.
- readme ๋ฐ์ดํฐ ๋ชจ๋ธ๋ง ์ถ๊ฐ.
- ํธ๋ฌ๋ธ ์ํ ์์ฃผ ์นญ์ฐฌํฉ๋๋ค.
- ๋ฒ๊ทธ ๊ฐ์ ํ์ฌ ์ต์ข ๋ฐํ๊น์ง ์ค๋น ์ ํ๊ธธ.
์ค๊ฐ ๋ฐํ์์๋ ์บ ํ ์ธก์์ 7๋ถ์ ๋ฐํ์๊ฐ์ ๊ผญ ์ค์ํด๋ฌ๋ผ๊ณ ์์ฒญํ์ฌ(ํ ํ์์ ๋ฐํ์๊ฐ ๋ณด์ฅ)
์ต๋ํ ๋ด์ฉ์ ์์ถํ์ฌ ๋ฐํ ์ค๋น๋ฅผ ํ์ผ๋, ์ฅ์ ์ ๊ฐ๋ฏธํ์ฌ ๋ฐํํ์ผ๋ฉด ์ข๊ฒ ๋ค๋ ํผ๋๋ฐฑ์ด ์์ด ์กฐ๊ธ ๋ ์ ๊ฒฝ์จ์ ๋ฐํ์๋ฃ ์ค๋น๋ฅผ ํด์ผ๊ฒ ๋ค.
readme ๋ฐ์ดํฐ ๋ชจ๋ธ๋ง์ ๋์์ธ๊ณผ ๊ธฐํ์ด ๊ณ์ ๋ณ๋๋์ด ํ ์ด๋ธ์์๋ ์ฆ์ ๋ณ๋์ด ์์ด ๋ชจ๋ธ๋ง ๋ด์ฉ์ ์ ์ธํ๋ค.
ํ์ง๋ง ๊ฒฐ์ ์ด ๋๊ณ ๋๋ฉด ์ธ๋ถ์ ์ผ๋ก ์์ฑํ ์์ ์ด๋ค.
ํธ๋ฌ๋ธ์ํ ์ผ๋ก๋ ๋จ์ํ๊ฒ ์๋ฌ, ๋๋ฒ๊น ์ด ์๋
์ฑ๋ฅ๊ฐ์ ๋ถ๋ถ์ ์ค์ ์ ๋์๊ณ , ์ด๋ฌํ ๋ถ๋ถ์์ ์นญ์ฐฌ์ ๋ฐ์๋ค.
์์ผ๋ก ์ด๋ฐ ๋ถ๋ถ์ ์๊ธฐํ๋ฉฐ ํธ๋ฌ๋ธ์ํ ์ด ์ด๋ฃจ์ด์ง๋๋ก ์ ์งํด์ผ๊ฒ ๋ค.(keep going!)
๋ฒ๊ทธ ๊ฐ์ ์ ํ ์คํธ๋ฅผ ์งํํ๋ฉฐ ์์์ฐจ๋ฆฐ ๋ถ๋ถ๋ ์๊ณ ,
์ ์ ํผ๋๋ฐฑ ๋ฑ์์ ๋ํ๋ ๋ฒ๊ทธ๊ฐ ์์์ผ๋
๋ฆฌํํ ๋ง, ๋ผ์ด๋ธ๋ฌ๋ฆฌ ๊ต์ฒด ๋ฑ์ผ๋ก ๊ฐ์ ๋ ์์ ์ด๋ค.
๊ฐ์ธ์ ์ผ๋ก,
์ฐ๋ฆฌ๊ฐ ๊ฐ์ฅ ์ ํ๊ณ ์๋ ์ ์
ํ ์คํฌ ๊ด๋ฆฌ๋ผ๋ ๊ฒ์ด๋ค.
Github์ project, issue ๋ฑ ์ ์ฉํ ๊ธฐ๋ฅ๋ค์ ์ฌ์ฉํ์ฌ
ํ ์คํฌ(์ ๋ฌด) ๋ถ๋ด์ ํ๊ณ , Assigness์ ๋ด๋น์๋ฅผ ์ง์ ํ๊ณ ์์ ์๋ฃ ํ
PR๋ก ํด๋นํ๋ ์ด์๋ฅผ ์ฐ๋ํ์ฌ
๋ ํ ๋ถ๋ถ์ ํด๊ฒฐํ์๋์ง ์คํฌ๋ฆฐ์ท๊ณผ gif ๋ฑ์ ์ด์ฉํด
๋์ฑ ๊ฐ์ ์ฌํญ์ ๋ณด์ฌ์ฃผ๊ณค ํ๋ค.
WIL
๋์์ธ๊ณผ ๊ธฐํ ํ์๋ฅผ ๋ง์ฃผํ๋ฉฐ ๊ฐ์๊ฐ ์ถ๊ตฌํ๋, ๋จธ๋ฆฟ์์ ๊ทธ๋ฆฌ๊ณ ์๋ mvp๊ฐ ์ ํํ ์ผ์นํ๊ธฐ๊ฐ ํ๋ค๋ค๋ ๊ฒ์ ๋๊ผ๋ค.
์ด ๋ถ๋ถ์ ๋ช ํํ ์์ฌ์ ๋ฌ๊ณผ ์๊ฐ ์๋ฃ๊ฐ ํ์ํ๋ค๊ณ ๋๋ผ๋ฉฐ ๊ฒฝํํ๋ค.
Page์ ๊ณต์ฉ ์ปดํฌ๋ํธ, ์ฌ์ฉ ๋ ์ปดํฌ๋ํธ๋ฅผ ๊ฐ์ ธ์์ ๋ถ์ด๊ณ ์กฐํฉํ๋ฉด์ ๋ฐฐ์ด ๊ฒ์
๋ด ์ฝ๋๋ฅผ ๋ณด๊ณ ํ๋์ ์ดํดํ ์ ์๋๋ก ์์ ํด์ผ ํ๋ค๋ ๋ถ๋ถ์ด๊ณ ,
js doc ๊ณผ ๊ฐ์ ๊ธฐ๋ฅ(์ฃผ์) ๋ฑ์ผ๋ก ํด๋น ์ปดํฌ๋ํธ์์ ์ด๋ฃจ์ด์ง๋ ๋ก์ง์ ์งง์ ์๊ฐ์ ํจ์จ์ ์ผ๋ก ์ดํดํ ์ ์๋๋ก ํด์ผํ๋ค๋ ๊ฒ์ ๋ชธ์ ๋๊ผ๋ค.
๋ํ ๊ณต์ฉ ์ปดํฌ๋ํธ์๋ ๋ก์ง์ ์์กด์ฑ์ด ์๋๋ก UI์ ์ธ ๋ถ๋ถ๋ง์ ๋ด๋นํด์ผ ์ถํ ๋ฆฌํํ ๋ง ์์๊ฐ ์ค์ด๋ค๊ณ ,
๋์ค์ ๋ณต์กํด ์ง์ง ์๋๋ค๋ ์ ์ด๋ค. ์ฒ์ ์์ ํ๋ dropdown ์ปดํฌ๋ํธ๋
์ฌ์ฉ๋๋ page๊ฐ ํ์ ์ ์ด์๊ธฐ ๋๋ฌธ์ prop๋ง ์ ๋ฌํ๋ค๋ฉด type์ ์ด์ฉํด ๋ก์ง๋ ๊ฐ์ด ๋ด๋ณด๋ด์ฃผ๋ ์ปดํฌ๋ํธ๋ฅผ ๋ง๋ค์ด ๋์๋๋ฐ.. ๋ค๋ฅธ ํ์ด์ง์์ ์ฌ์ฉํ ์ผ์ด ์๊ธด๋ค๋ฉด ์ข ์์ฑ์ ์ถ๊ฐํด์ผํ๊ณ ๋ก์ง๋ ํ์ ์ปดํฌ๋ํธ์ ๋ถ์ฌ์ค์ผ ํ๋ ์์ ๋ฑ
๋งค์ฐ ๋นํจ์จ์ ์ธ ์ปดํฌ๋ํธ๊ฐ ๋์ด๋ฒ๋ ธ๋ค๋ ๊ฒ์ ๋๊ผ๋ค.
supabase api๋ฅผ ์ฌ์ฉํจ์ ์์ด์ ๊ฐ์ ์ปดํฌ๋ํธ์์ get์์ฒญ์ ํ๋ ๋ถ๋ถ์ด ์์ฒญ๋๊ฒ ๋ง์์ก๋๋ฐ
์์ ์ปดํฌ๋ํธ์์ ํ๋ฒ ๋ฐ์ดํฐ๋ฅผ ๋ฐ์์ค๊ณ ํ์ ์ปดํฌ๋ํธ์์ ๋ด๋ ค๋ฐ๋ ๋ถ๋ถ์ ํตํด ์ฑ๋ฅ๊ฐ์ ์ ์ด๋ฃจ์๋๋ฐ
์์ฃผ ์ฌ์ฉํ๋ api๋ util๋ก ๋ฏธ๋ฆฌ ๋นผ๋๋ ๊ฒ์ด ๋ ํจ์จ์ ์ด๋ผ๋ ๊ฒ์ ๋ฐฐ์ ๋ค.
next์์์ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ ์ฉ ์ ์ฒ์ ํด์ผํ๋ install ํ
์ ์ฉ์ด ์๋์ด ์ฝ์ง์ ๊พ๋ ํ๋๋ฐ
๊ฐ๋ฐ ํ๊ฒฝ์ด dev์ด๋ค ๋ณด๋ dev dependency๋ก ๋ณ๊ฒฝํด์ผ ํ๋ค.
๋ dev์์ ์ด๋ฃจ์ด์ง๋ ๊ฒ์ ๋ฐฐํฌ์ ์ ์ธํ์ฌ ์๋์ผ๋ก ๋ชจ๋ํ ๋์ด์ง๋ค๋ ๊ฒ์ ๋ฐฐ์ ๋ค.
typescript๋ฅผ ๋ธ๋ผ์ฐ์ ๊ฐ ์ธ์ํ ์ ์๋ ๋ถ๋ถ๊ณผ ์ผ๋งฅ์ํตํ๋ค.
์ด์ ์ ์ธ ํ์๋ค์ ๊ฐ๋ฐ ์๋์ ๋์์ธ๋๋์ ์์ ์๋๊ฐ ์กฐ๊ธ ์ฐจ์ด๋์
์ค๋ง์ค๋ฌ์ด ๋ถ๋ถ๋ ์์ง๋ง, ์ฐ๋ฆฌ๋ ๊ฒฐ๊ตญ ๋๊น์ง ์ ํด๋ผ ๊ฒ์ด๋ผ๊ณ ๋ฏฟ๋๋ค!
๐ฆพ ๋น ์ดํ ๊ทธ.
2023๋ 2์ | 1 week | 2 week (project) | 3 week (project) | 4 week (project) |
ํ์ต ๋ด์ฉ (ํ๋ก์ ํธ) |
Next.js ํ์ต ๋ฐ ์ค์ต (๊ฐ์) ๋ชจ๋ ์๋ฐ์คํฌ๋ฆฝํธ ๋ฐํ ๋ฐ TIL ์ ๋ฆฌ |
์ ์ ํ๋ก์ฐ ์ค๊ณ,API ์ค๊ณ, ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ ์ , ์ปดํฌ๋ํธ ์ค๊ณ, DB ์ค๊ณ, ๋ผ์ฐํ
์ค๊ณ, ํด๋๊ตฌ์กฐ ์ค๊ณ, ESLint ์ค์ >> init 24H ํค์ปคํค ์งํ |
๊ธฐํ ๋ง๋ฌด๋ฆฌ, ํ์ด์ง ๊ตฌ์ฑ(์ปดํฌ๋ํธ ๋ณํฉ), ๊ฐ ์ปดํฌ๋ํธ์ ๊ธฐ๋ฅ๋ณ task ๊ด๋ฆฌ, github issue๋ก ์์
๊ฐ๊ดํ post-page, supabase ์ฐ๋, ๋ก๊ทธ์์ ํ ์กฐ๊ฑด๋ถ ๋ ๋๋ง, mypage background, toast-ui text editor |
1.0.1 version deploy ๋ฒ๊ทธ ์์ , ํด๋๋ง, ๋ฆฌํํ ๋ง(detail), 1.1.0 version task ์ค๋น ์ค๊ฐ๋ฐํ ๋ฐ KTP ํ๊ณ |
์ฌ์ฉ ํด defalut : VS code |
Next.js(ssr, ssg, isr) / Typescript | ์๋ต. | ์๋ต, | ์๋ต, |
'WIL' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
WIL - [23.04.03 ~ 23.04.09] (0) | 2023.04.09 |
---|---|
WIL - [23.03.27 ~ 23.04.02] (0) | 2023.04.03 |
(React) WIL - 16์ฃผ์ฐจ ํ๊ณ (1) | 2023.02.23 |
(React) WIL - 15์ฃผ์ฐจ ํ๊ณ (1) | 2023.02.12 |
(React) WIL - 14์ฃผ์ฐจ ํ๊ณ (1) | 2023.02.03 |