profile
๐Ÿ„ ๊ฐœ๋ฐœ์ž๋กœ ์ปค๊ฐ€๋Š” ์ค‘!
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 15์žฅ Context API

๋ฆฌ์•กํŠธ์˜ ๋ฐ์ดํ„ฐ ํ๋ฆ„์€ ๋‹จ๋ฐฉํ–ฅ ํ๋ฆ„์ด๊ธฐ ๋•Œ๋ฌธ์— ๋ถ€๋ชจ โ†’ ์ž์‹์œผ๋กœ ํ˜๋Ÿฌ์•ผ ํ•จ์˜ˆ๋ฅผ ๋“ค์–ด ๋Œ€๊ทœ๋ชจ ํ”„๋กœ์ ํŠธ ์ผ ์ˆ˜๋ก ๋ฐ์ดํ„ฐ์˜ ๋ณ€ํ™”์— ๋”ฐ๋ผ ๋ณ€๊ฒฝ๋˜๋Š” ์ปดํฌ๋„ŒํŠธ๋“ค์ด ์ฆ๊ฐ€ํ•˜๊ฒŒ ๋จ์ƒํƒœ ์—…๋ฐ์ดํŠธ ๋˜ํ•œ ํ๋ฆ„์„ ์ง€์ผœ์•ผ ํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์ƒ๋‹นํžˆ ๋ณต์žกํ•œ ๊ณผ์ •์„ ๊ฑฐ์น˜๊ฒŒ ๋จโ†’ ์œ ์ง€๋ณด์ˆ˜๊ฐ€ ์ ์  ํž˜๋“ค์–ด์ง๋”ฐ

2023๋…„ 1์›” 26์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 14์žฅ ์™ธ๋ถ€ API๋ฅผ ์—ฐ๋™ํ•˜์—ฌ ๋‰ด์Šค ๋ทฐ์–ด ๋งŒ๋“ค๊ธฐ

axios๋กœ ์‰ฝ๊ฒŒ ์™ธ๋ถ€ ๋ฐ์ดํ„ฐ๋ฅผ ํ˜ธ์ถœํ•˜์—ฌ ์‚ฌ์šฉ๊ฐ€๋ŠฅuseEffect๋ฅผ ํ™œ์šฉํ•˜์—ฌ ์ฒ˜์Œ ๋ Œ๋”๋ง ์‹œ์ ์— ๋ฐ์ดํ„ฐ ํ˜ธ์ถœuseEffect์— async๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด X โ†’ useEffect์—์„œ ๋ฐ˜ํ™˜ํ•ด์•ผ ํ•˜๋Š” ๊ฐ’์€ ๋’ท์ •๋ฆฌ ํ•จ์ˆ˜ ์ด๊ธฐ ๋•Œ๋ฌธโ†’ ๋‚ด๋ถ€์— ๋‹ค๋ฅธ ํ•จ์ˆ˜๋ฅผ ๋งŒ๋“ค์–ด async/await

2023๋…„ 1์›” 20์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 13์žฅ ๋ฆฌ์•กํŠธ ๋ผ์šฐํ„ฐ๋กœ SPA ๊ฐœ๋ฐœํ•˜๊ธฐ

single page application์˜ ์•ฝ์ž๋กœ ํ•˜๋‚˜์˜ ํŽ˜์ด์ง€๋กœ ์ด๋ฃจ์–ด์ง„ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๋งํ•จ๊ธฐ์กด ์›นํŽ˜์ด์ง€๋Š” ํŽ˜์ด์ง€ ๋ณ€๊ฒฝ ์‹œ ์„œ๋ฒ„์— ์š”์ฒญํ•˜๋ฉฐ ํ™”๋ฉด์„ ์ƒˆ๋กœ ๋ถˆ๋Ÿฌ์˜ด์ด๋Ÿฌํ•œ ๋ฐฉ์‹์€ ๋งŽ์€ ํŠธ๋ž˜ํ”ฝ์„ ์„œ๋ฒ„์—์„œ ๋ถ€๋‹ดํ•ด์•ผํ•จSPA๋Š” ๋ทฐ ๋ Œ๋”๋ง์„ ์‚ฌ์šฉ์ž์˜ ๋ธŒ๋ผ์šฐ์ €๊ฐ€ ๋‹ด๋‹นํ•˜๊ณ  ๋กœ๋”ฉ์ด ํ•„์š”

2023๋…„ 1์›” 11์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 12์žฅ. immer์‚ฌ์šฉ ๋ถˆ๋ณ€์„ฑ ์œ ์ง€

yarn add immer๋‘๊ฐ€์ง€ ํŒŒ๋ผ๋ฏธํ„ฐ๋ฅผ ์‚ฌ์šฉ์ฒซ๋ฒˆ์งธ - ์ˆ˜์ •ํ•˜๊ณ  ์‹ถ์€ state๋‘๋ฒˆ์งธ - ์ƒํƒœ๋ฅผ ์–ด๋–ค ๋ฐฉ์‹์œผ๋กœ ์—…๋ฐ์ดํŠธ ํ• ์ง€ ์ •์˜ํ•˜๋Š” ํ•จ์ˆ˜๋‘๋ฒˆ์งธ ํŒŒ๋ผ๋ฏธํ„ฐ๋กœ ์ „๋‹ฌ๋˜๋Š” ํ•จ์ˆ˜ ๋‚ด๋ถ€์—์„œ ์›ํ•˜๋Š” ๊ฐ’์„ ๋ณ€๊ฒฝํ•˜๋ฉด produce ํ•จ์ˆ˜๊ฐ€ ๋ถˆ๋ณ€์„ฑ์„ ์œ ์ง€๋ฅผ ๋Œ€์‹  ํ•ด์ฃผ์–ด ์ƒˆ๋กœ์šด ์ƒํƒœ๋ฅผ ์ƒ

2023๋…„ 1์›” 6์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 11์žฅ. ์ผ์ • ๊ด€๋ฆฌ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๋งŒ๋“ค๊ธฐ

๊ธฐ์กด ์ผ์ •๊ด€๋ฆฌ ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜ ์ฝ”๋“œ๋ฅผ ๋ฆฌํŒฉํ† ๋ง ์ง„ํ–‰React.memo ์‚ฌ์šฉonToggle, onRemove ๋ฆฌ๋ Œ๋”๋ง ๋ฐฉ์ง€react-virtualized ๋ Œ๋”๋ง ์ตœ์ ํ™”ํ˜„์žฌ๋Š” ํ•˜๋‚˜์˜ ๊ฐ’๋งŒ ์ฒดํฌํ•ด๋„ App์˜ ์—ฐ๊ฒฐ๋˜์–ด ์žˆ๋Š” state์ด ๋ณ€๊ฒฝ ๋˜๊ธฐ ๋•Œ๋ฌธ๋”ฐ๋ผ์„œ ํ•ด๋‹น ์ปดํฌ๋„ŒํŠธ ์•„๋ž˜ ์žˆ

2023๋…„ 1์›” 3์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 10์žฅ. ์ผ์ • ๊ด€๋ฆฌ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๋งŒ๋“ค๊ธฐ

node-sass, classnames, react-icons ์„ค์น˜prettier ํ”„๋กœ์ ํŠธ์—์„œ ์ œ์‹œํ•˜๋Š” ์š”๊ตฌ์‚ฌํ•ญ ์„ค์ •TodoTemplate - ํ™”๋ฉด ์ „์ฒด๋ฅผ ๊ฐ์‹ธ๋Š” ๋ ˆ์ด์•„์›ƒ ์ปดํฌ๋„ˆํ‹‘TodoInsert - ํ•  ์ผ ์ž…๋ ฅ ํผTodoList - ํ•  ์ผ ๋ชฉ๋ก ์ปดํฌ๋„ŒํŠธTodoLis

2022๋…„ 12์›” 29์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 9์žฅ. ์ปดํฌ๋„ŒํŠธ ์Šคํƒ€์ผ๋ง

๊ธฐ์กด css ์‚ฌ์šฉ์ฒ˜๋Ÿผ ์ž‘์„ฑ ํ›„ importํ•˜์—ฌ ์ ์šฉyarn add node-sass๋กœ ์„ค์น˜์‚ฌ์šฉ ๋ฐฉ๋ฒ•์€ css์™€ ๋™์ผ๊ณตํ†ต์œผ๋กœ ์‚ฌ์šฉํ•˜๋Š” ๋ถ€๋ถ„์€ ๋ถ„๋ฆฌํ•˜์—ฌ ๊ด€๋ฆฌํ”„๋กœ์ ํŠธ ๋””๋ ‰ํ† ๋ฆฌ๊ฐ€ ๊นŠ์–ด์ง€๋ฉด ํ•ด๋‹น ์Šคํƒ€์ผ์„ importํ•  ๋•Œ ๋ถˆํŽธํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์„ค์ •../../../../utils.sc

2022๋…„ 12์›” 14์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 8์žฅ ์ปดํฌ๋„ŒํŠธ์˜ ๋ผ์ดํ”„์‚ฌ์ดํด ๋ฉ”์†Œ๋“œ

state๋ฅผ ์„ค์ •ํ•  ๋•Œ ์‚ฌ์šฉ (ํ•˜๋‚˜์˜ ์ƒํƒœ๊ฐ’๋งŒ ๊ด€๋ฆฌ)ํŒŒ๋ผ๋ฏธํ„ฐ - init ๊ฐ’์„ ๋„ฃ์–ด์คŒ๋ฆฌํ„ด - state ๊ฐ’, state๋ฅผ ์„ค์ •ํ•˜๋Š” ํ•จ์ˆ˜์ปดํฌ๋„ŒํŠธ๊ฐ€ ๋ Œ๋”๋ง ๋  ๋•Œ ๋งˆ๋‹ค ํŠน์ • ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•˜๋„๋ก ์„ค์ • ๊ฐ€๋ŠฅcomponentDidUpdate + componentDidMount ๋ฅผ

2022๋…„ 12์›” 13์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 7์žฅ ์ปดํฌ๋„ŒํŠธ์˜ ๋ผ์ดํ”„์‚ฌ์ดํด ๋ฉ”์†Œ๋“œ

์ปดํฌ๋„ŒํŠธ์˜ ๋ผ์ดํ”„์‚ฌ์ดํด์ด ์กด์žฌํ•˜๋ฉฐ ํŽ˜์ด์ง€์˜ ๋ Œ๋”๋ง ์ „ ~ ํŽ˜์ด์ง€๊ฐ€ ์‚ฌ๋ผ์งˆ ๋•Œ ๋๋‚œ๋‹ค.ํด๋ž˜์Šคํ˜• ์ปดํฌ๋„ŒํŠธ์—์„œ๋งŒ ์‚ฌ์šฉ ํ•  ์ˆ˜ ์žˆ๊ณ  ํ•จ์ˆ˜ํ˜•์€ Hooks์˜ ๊ธฐ๋Šฅ์œผ๋กœ ๊ตฌํ˜„์ด ๊ฐ€๋Šฅ๋ผ์ดํ”„์‚ฌ์ดํด์˜ ์ข…๋ฅ˜๋Š” ์ด 9๊ฐœWill ์ ‘๋‘์‚ฌ๊ฐ€ ๋ถ™์€ ๋ฉ”์†Œ๋“œ - ์ž‘์—…์ด ๋™์ž‘ํ•˜๊ธฐ ์ „ ์‹คํ–‰Did ์ ‘๋‘์‚ฌ๊ฐ€

2022๋…„ 12์›” 6์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 6์žฅ ์ปดํฌ๋„ŒํŠธ ๋ฐ˜๋ณต

arr.map(callback, \[thisArg])callback ํŒŒ๋ผ๋ฏธํ„ฐcurrentValue - ํ˜„์žฌ ๋ฐฐ์—ด ๊ฐ’index - ํ˜„์žฌ ๋ฐฐ์—ด์˜ indexarray - ํ˜„์žฌ ์›๋ณธ ๋ฐฐ์—ดthisArg(์„ ํƒ ํ•ญ๋ชฉ) - callback ํ•จ์ˆ˜ ๋‚ด๋ถ€์—์„œ ์‚ฌ์šฉํ•  this์˜ˆ์‹œ์ปดํฌ๋„ŒํŠธ ๋ฐฐ

2022๋…„ 11์›” 30์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 5์žฅ ref:DOM์— ์ด๋ฆ„ ๋‹ฌ๊ธฐ

DOM์„ ์ง์ ‘์ ์œผ๋กœ ๊ฑด๋“œ๋ ค์•ผ ํ•  ๋•Œ ์‚ฌ์šฉํŠน์ • Input์— ํฌ์ปค์Šค ์ฃผ๊ธฐ์Šคํฌ๋กค ๋ฐ•์Šค ์กฐ์ž‘canvas ์š”์†Œ ํ™œ์šฉ์ฝœ๋ฐฑ ํ•จ์ˆ˜๋ฅผ ํ†ตํ•œ ref ์„ค์ •ํ•จ์ˆ˜ ๋‚ด๋ถ€์—์„œ ์ „๋‹ฌ๋ฐ›์€ ref ํŒŒ๋ผ๋ฏธํ„ฐ๋ฅผ ์ปดํฌ๋„ŒํŠธ์˜ ๋ฉค๋ฒ„ ๋ณ€์ˆ˜๋กœ ์„ค์ •createRef ์„ค์ •๋ฆฌ์•กํŠธ ๋‚ด์žฅ ํ•จ์ˆ˜ (v16.3)์ปดํฌ๋„ŒํŠธ์—๋„ r

2022๋…„ 11์›” 29์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 4์žฅ ์ด๋ฒคํŠธ ํ•ธ๋“ค๋ง

event ์ด๋ฆ„์˜ ํ‘œ๊ธฐ๋ฅผ camelCase๋กœ ํ‘œ๊ธฐํ•ด์•ผ ํ•จ (onClick, onMouseOver)js ์ฝ”๋“œ๊ฐ€ ์•„๋‹Œ ํ•จ์ˆ˜ ํ˜•ํƒœ์˜ ๊ฐ’์„ ์ „๋‹ฌ ํ•ด์•ผํ•จDOM ์š”์†Œ์—๋งŒ ์ด๋ฒคํŠธ๋ฅผ ์„ค์ • ํ•  ์ˆ˜ ์žˆ๋‹ค. (์ปดํฌ๋„ŒํŠธ X)SyntheticEvent๋Š” ๋ธŒ๋ผ์šฐ์ € native event์™€ ๋‹ฌ

2022๋…„ 11์›” 28์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 3์žฅ ์ปดํฌ๋„ŒํŠธ

ํ•จ์ˆ˜ํ˜• ์ปดํฌ๋„ŒํŠธ์™€ ๋‹ฌ๋ฆฌ state ๊ธฐ๋Šฅ๊ณผ ๋ผ์ดํ”„ ์‚ฌ์ดํด ๊ธฐ๋Šฅ์„ ์‚ฌ์šฉ ๊ฐ€๋Šฅ์ž„์˜ ๋ฉ”์†Œ๋“œ๋ฅผ ์ •์˜ ๊ฐ€๋Šฅrender ํ•จ์ˆ˜๊ฐ€ ํ•„์ˆ˜๋กœ ์žˆ์–ด์•ผ ํ•˜๊ณ  jsx๋ฅผ ๋ฐ˜ํ™˜ํ•ด์•ผ ํ•จํ•จ์ˆ˜ํ˜•์„ ์–ธํ•˜๊ธฐ ํŽธํ•˜๋‹ค๋ฉ”๋ชจ๋ฆฌ ์ž์›์ด ์ž‘๋‹คstate, ๋ผ์ดํ”„ ์‚ฌ์ดํด api๊ฐ€ ๋ถˆ๊ฐ€๋Šฅ ํ•˜๋‹ค (Hooks์˜ ์ถ”๊ฐ€๋กœ ํ•ด๊ฒฐ)ํด

2022๋…„ 11์›” 27์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 2์žฅ JSX

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 2์žฅ JSX

2022๋…„ 11์›” 24์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 1์žฅ ๋ฆฌ์•กํŠธ ์‹œ์ž‘

[๊ฐœ์ธ ์Šคํ„ฐ๋””] ๋ฆฌ์•กํŠธ๋ฅผ ๋‹ค๋ฃจ๋Š” ๊ธฐ์ˆ  - 1์žฅ ๋ฆฌ์•กํŠธ ์‹œ์ž‘

2022๋…„ 11์›” 23์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

Vue composition API๋ฅผ ์‚ฌ์šฉํ•ด๋ณด์ž

Vue3์—์„œ ์ œ์‹œํ•˜๋Š” ์ƒˆ๋กœ์šด ๋ฐฉ์‹์˜ ์ปดํฌ๋„ŒํŠธ ๊ตฌ์กฐ๋ฅผ ์†Œ๊ฐœํ•˜๋ ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค. (composition api) Vue2์—์„œ๋„ ์ ์šฉ์ด ๊ฐ€๋Šฅํ•˜๊ณ  ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์™€ ํ•จ๊ป˜ ์‚ฌ์šฉํ•˜๊ธฐ๋„ ์šฉ์ดํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์‹ค๋ฌด์— ์ ์šฉํ•˜๋Š” ๊ฒƒ๋„ ์ƒ๊ฐ๋ณด๋‹ค๋Š” ์–ด๋ ต์ง€ ์•Š์•˜์Šต๋‹ˆ๋‹ค! ๐Ÿฅณ

2022๋…„ 1์›” 24์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[Vue] Vuex modules ํด๋” ์ „์ฒด importํ•˜๋Š” ๋ฐฉ๋ฒ•

๊ธฐ์กด jsํŒŒ์ผ์—์„œ ํด๋” ์ž์ฒด๋ฅผ importํ•˜๋Š” ๊ฒƒ์ด ๋ถˆ๊ฐ€๋Šฅ ํ•ฉ๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ Vue, React์™€ ๊ฐ™์€ ํ”„๋ ˆ์ž„์›Œํฌ์—์„œ index ํŒŒ์ผ์„ ์ƒ์„ฑํ•˜๋ฉด ํด๋” ์•ˆ์— ๋“ค์–ด์žˆ๋Š” ํŒŒ์ผ ์ „์ฒด๋ฅผ import ํ•˜๋Š”๊ฒŒ ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค! ์„ค์ • ๋ฐฉ๋ฒ•์€ import ํ•  ํด๋” ์•ˆ์— index.js๋ฅผ ๋งŒ๋“ค

2021๋…„ 6์›” 25์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[Vue] scss ์ถ”๊ฐ€ ๋ฐ ์ „์—ญ ์Šคํƒ€์ผ ์„ค์ •

Vue cli3 ์ด์ƒ๋ถ€ํ„ฐ๋Š” ํ”„๋กœ์ ํŠธ๋ฅผ ์ƒ์„ฑํ•  ๋•Œ scss ๊ด€๋ จ ๊ธฐ๋Šฅ์„ ์‰ฝ๊ฒŒ ์ถ”๊ฐ€ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ ํ”„๋กœ์ ํŠธ ์ง„ํ–‰ ์ค‘๊ฐ„์— scss๋ฅผ ์ ์šฉํ•  ์ผ์ด ์ƒ๊ฒจ ํ•ด๋‹น ๋‚ด์šฉ์„ ์ •๋ฆฌํ•˜์˜€์Šต๋‹ˆ๋‹ค ๐Ÿ™‚์ œ์ผ ๋จผ์ € ํ•ด๋‹น package์— node-sass์™€ sass-loader๋ฅผ ์„ค์น˜ํ•ด์ค๋‹ˆ

2021๋…„ 6์›” 23์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

4๊ฐ•.์‚ฌ์ด๋ฒ„ ๊ณต๊ฒฉ

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

2021๋…„ 6์›” 17์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

[Vue] ์Šคํƒ€์ผ ๊ฐ€์ด๋“œ - ํ•„์ˆ˜

Vue ๊ณต์‹ ๋ฌธ์„œ ๊ธฐ๋ฐ˜์œผ๋กœ ์ž‘์„ฑํ•œ ํ•„์ˆ˜ ์Šคํƒ€์ผ ๊ฐ€์ด๋“œ์— ๋Œ€ํ•œ ๋‚ด์šฉ ์ •๋ฆฌ์ž…๋‹ˆ๋‹ค ๐Ÿ™‚์ž์„ธํ•œ ๋‚ด์šฉ์€ ๊ณต์‹๋ฌธ์„œ๋ฅผ ์ฐธ๊ณ  ๋ถ€ํƒ๋“œ๋ฆฝ๋‹ˆ๋‹ค.Style Guide - Vue.js1\. ์ปดํฌ๋„ŒํŠธ์˜ ์ด๋ฆ„์€ ํ•ฉ์„ฑ์–ด๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค.html ํƒœ๊ทธ์˜ ๊ฒฝ์šฐ ํ•œ ๋‹จ์–ด๋กœ ํƒœ๊ทธ๊ฐ€ ๊ตฌ์„ฑ๋˜์–ด ์žˆ๊ธฐ ๋•Œ๋ฌธ์— ์ถฉ๋Œ

2021๋…„ 6์›” 7์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท