///
Search
๐Ÿ™‚

20220412 ํ™”

Tags
stylelint
global css
babelrc
์šฐ๋ฒ„์ด์ธ ํด๋ก ์ฝ”๋”ฉ
formik
4 more properties

์˜ค๋Š˜ ์—…๋ฌด

โ€ข
ย [๊ฐœ๋ฐœ] stylelint ์„ค์ •
โ—ฆ
syntax ๋•Œ๋ฌธ์— ๋ฌธ์ œ ์žˆ๋˜ ๋ถ€๋ถ„์„ ํ•ด๊ฒฐํ–ˆ๋‹ค. ์–ด์ ฏ๋ฐค๋ถ€ํ„ฐ ํ—ค๋งธ๋Š”๋ฐ ์˜ค๋Š˜ ์•„์นจ์— ์šฐ์—ฐํžˆ ํ•ด๊ฒฐํ•˜๊ฒŒ ๋˜์„œ ๊ธฐ๋ถ„ ์ข‹๋‹ค
โ€ข
ย [๊ฐœ๋ฐœ] global css ์„ค์ •
โ—ฆ
.babelrc ์ถ”๊ฐ€
โ—ฆ
global css ์ปจ๋ฒค์…˜ ์ •ํ•˜๋ฉด์„œ ์•„๋ž˜ ๊ธ€๋“ค ์ ‘ํ•˜๊ฒŒ ๋˜์—ˆ๋Š”๋ฐ ๋„ˆ๋ฌด ์ข‹์•„์„œ ์ •๋…ํ•˜๋ฉด์„œ ํšŒ์‚ฌ ๋ฌธ์„œ ์ •๋ฆฌํ–ˆ๋‹ค. ๋‚ด์ผ ๋…ผ์˜ ํ›„ ํ™•์ •ํ•˜๊ธฐ
โ€ข
ย [๊ฐœ๋ฐœ] urql ์„ธํŒ…
โ—ฆ
mock data ์„ธํŒ…์ด ์–ด๋–ป๊ฒŒ ๋˜์–ด๊ฐ€๋Š”์ง€ ํŒŒ์•…ํ•œ ํ›„ ์ง„ํ–‰ํ•ด์•ผ ํ•  ๋“ฏ. ๋‚ด์ผ ์—ฌ์ญค๋ด์•ผ๊ฒ ๋‹ค

์˜ค๋Š˜ ์„ฑ์žฅ

โ€ข
.babelrc ๋ž‘ babel.config.json ์ฐจ์ด์  (๊ธ€)
โ—ฆ
.babelrc : ์„œ๋ธŒ์…‹ ๋””๋ ‰ํ† ๋ฆฌ ๋˜๋Š” ํŒŒ์ผ์—์„œ ํŠน์ • ํ”Œ๋Ÿฌ๊ทธ์ธ ๋ณ€ํ˜• ์‹œ
โ—ฆ
babel.config.json : ํ”„๋กœ์ ํŠธ ์ƒ์œ„์—์„œ ํ•˜๋‚˜์˜ ๋ฐ”๋ฒจ ์„ค์ • ๊ฐ€์ ธ๊ฐˆ ๋•Œ ์‚ฌ์šฉ
โ€ข
๋…ธ๋งˆ๋“œ์ฝ”๋” ์šฐ๋ฒ„์ด์ธ  ํด๋ก ์ฝ”๋”ฉ
โ—ฆ
#2.3~#2.6 typeorm
โ–ช
typeorm ๊ผญ ์•ˆ ์จ๋„ ๋˜๊ณ  sequelize ์จ๋„ ๋จ
โ–ช
typeorm ์€ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋กœ ๋งŒ๋“ค์–ด ์ง
โ—ฆ
#14.3 apollo setup
โ–ช
local state: server์—๋Š” ์—†์ง€๋งŒ application์—๋Š” ์žˆ๊ธฐ๋ฅผ ๋ฐ”๋ผ๋Š” state - apollo ์ง€์› ex. ๋กœ๊ทธ์ธ ์—ฌ๋ถ€
โ–ช
apollo useReactiveVar - ํด๋ผ์ด์–ธํŠธ ์ƒํƒœ๊ด€๋ฆฌ ํˆด๋กœ ์‚ฌ์šฉ ๊ฐ€๋Šฅํ• ์ง€ ํ™•์ธ ํ•„์š”
โ—ฆ
#15.0~#15.2 react hook form
โ€ข
โ—ฆ
๋…ธ๋งˆ๋“œ์ฝ”๋”์—์„œ react hook form ์„ค๋ช… ๊ฐ„๋‹จํžˆ ๋“ฃ๊ณ  ๊ถ๊ธˆํ•ด์„œ formik ๋„ ์ฐพ์•„๋ด„. ๋น ๋ฅด๊ฒŒ ๋Œ๋ ค๋ด์„œ ์ž์„ธํ•œ ๋น„๊ต๋Š” ๋” ํ•ด๋ด์•ผ ํ•  ๊ฒƒ ๊ฐ™์€๋ฐ, ๋‘˜ ๋‹ค ํŽธํ•ด๋ณด์—ฌ์„œ ์…€๋Ÿฌ๋ฆฌ์—์„œ ์™œ ๋„์ž… ์•ˆํ–ˆ๋‚˜ ์‹ถ์„ ์ •๋„๋‹ค

์˜ค๋Š˜ ํšŒ๊ณ 

โ€ข
์•„์นจ์— ์—…๋ฌด ์ „์— ์‚ฐ์ฑ…ํ•˜๋ฉด์„œ ์žฌํƒ์˜ ์žฅ์ ์„ ๋งˆ์Œ๊ป ๋ˆ„๋ ธ๋‹ค. ์™„์ „ ์ ์‘ํ•ด์„œ ํšŒ์‚ฌ๋กœ ๋ชป ๋Œ์•„๊ฐˆ ๊ฒƒ ๊ฐ™๋‹ค,,
โ€ข
ํƒœ์Šคํฌ์— 3 ํ”„๋กœ์ ํŠธ ๊ด€๋ จ๋œ ๊ฒƒ ์™ธ์— ํ•ด๋‹น ์Šคํ”„๋ฆฐํŠธ์— ํ•˜๋Š” ๋‹ค๋ฅธ ์—…๋ฌด๋“ค (ex. CS, ๊ธฐํƒ€ ์—…๋ฌด)๋„ ํฌํ•จ์‹œํ‚ค์ž๊ณ  ๊ฑด์˜ํ–ˆ๋‹ค. ๊ฐœ์ธ ์นธ๋ฐ˜์„ ์“ฐ๋‹ˆ๊นŒ ์Šคํ”„๋ฆฐํŠธ์— ํ•ด์•ผ ํ•  ๊ฒƒ๋“ค์ด ๊ฐœ์ธ ๋ณ„๋กœ ๋ช…ํ™•ํ•˜๊ฒŒ ๋ณด์—ฌ์„œ ๊ฐœ์ธ์ ์œผ๋กœ ๋„ˆ๋ฌด ์ข‹์€๋ฐ, ๋‹ค๋ฅธ ํŒ€์›๋“ค๋„ ๊ฐ™์€ ๋งˆ์Œ์œผ๋กœ ์ž˜ ์จ์ฃผ์…จ์œผ๋ฉด ์ข‹๊ฒ ๋‹ค

โ€ข
global css ์ปจ๋ฒค์…˜ ๊ณ ๋ฏผํ•˜๋Š๋ผ ์˜คํ›„ ์‹œ๊ฐ„์„ ์ƒ๊ฐ๋ณด๋‹ค ๋งŽ์ด ์ผ๋‹ค. ์ด๋ฒˆ ์Šคํ”„๋ฆฐํŠธ์— ์‹ค์ œ ๊ฐœ๋ฐœํ•ด์•ผ ํ•  ํƒœ์Šคํฌ๋Š” ๋งŽ์ง€ ์•Š์€๋ฐ, ๋ˆˆ์— ๋ณด์ด์ง€ ์•Š๋Š” ํ•  ์ผ๋“ค (์ฃผ๋กœ ๊ธ€๋กœ๋ฒŒํ•œ ์„ธํŒ…์„ ์œ„ํ•œ ๋ฆฌ์„œ์น˜?)์ด ๋งŽ์•„์„œ ๋˜๊ฒŒ ๋ฐ”์œ ๋Š๋‚Œ์ด๋‹ค.
โ€ข
ํ”„๋กœ์ ํŠธ ๊ตฌ์กฐ์— ๋Œ€ํ•ด ํ”„๋กœ์ ํŠธ(app, lib) ๋‹จ์œ„๋กœ๋งŒ ๊ณ ๋ฏผํ•˜๊ณ , ๊ทธ ํ•˜์œ„ ๊นŠ์ด๊นŒ์ง€๋Š” ๊ณ ๋ฏผํ•˜์ง€ ๋ชป ํ•ด์„œ ํŒ€์›๋“ค์ด ์ž‘์—…ํ•˜๋ฉด์„œ ํ˜ผ๋ž€์„ ๋Š๋ผ๋Š” ๊ฒƒ ๊ฐ™๋‹ค! ์žฌ๋นจ๋ฆฌ ๊ณ ๋ฏผํ•ด๋ณด๊ธด ํ–ˆ๋Š”๋ฐ, ์Šคํƒ ๋“ฑ ์—ฌ๋Ÿฌ๋ชจ๋กœ ๋‹ฌ๋ผ์ง„ ์ ๋“ค์ด ๋งŽ๋‹ค๋ณด๋‹ˆ ์ด์ „์— ํ–ˆ์—ˆ๋˜ ํ”„๋กœ์ ํŠธ์™€ ๋‹ค๋ฅด๊ฒŒ ์ •๋ฆฌ๋ผ์•ผํ•˜๋Š” ๋ถ€๋ถ„๋“ค๋„ ์žˆ๋Š” ๊ฒƒ ๊ฐ™๋‹ค. ๊ฐ™์ด ๊ณ ๋ฏผํ•˜๊ณ  ๋…ผ์˜ํ•˜๋Š” ์ˆ˜๋ฐ–์—.
โ€ข
์ฒ˜์Œ๋ถ€ํ„ฐ ์™„๋ฒฝํ•  ์ˆ˜ ์—†๋‹ค!