profile
์ฃผ๋‹ˆ์–ด ๊ฐœ๋ฐœ์ž ์„ฑ์žฅ๊ธฐ๐Ÿ˜Ž
post-thumbnail

Webpack ๊ธฐ์ดˆ ๊ฐ„๋‹จ ์ •๋ฆฌโœจ - ์‘์šฉํŽธ

์ด๋ฒˆ์—๋Š” ์ง€๋‚œ ๋ฒˆ์— ์ž‘์„ฑํ•œ ๋ฐ”๋‹๋ผ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์ฝ”๋“œ๋ฅผ ๋ฆฌ์•กํŠธ ๊ธฐ๋ฐ˜์˜ ์ฝ”๋“œ๋กœ ๋ฐ”๊ฟ”๋ณผ ์˜ˆ์ •์ด๋‹ค!๐Ÿ˜™ ๊ทธ๋Ÿผ ๋ฐ”๋กœ ์‹œ์ž‘ํ•ด๋ณด์ž๐Ÿ”ฅ

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

Webpack ๊ธฐ์ดˆ ๊ฐ„๋‹จ ์ •๋ฆฌโœจ - ์‹ค์ „ํŽธ

์›นํŒฉ ์„ค์ •์„ ์ง„ํ–‰ํ•ด๋ณด์ž!๐Ÿ˜Š๐Ÿ˜Š

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

ํ‡ด์‚ฌ!

์•„๋ฌด๋„ ๋‚  ๋ง‰์ง€๋ชจํƒœ

2021๋…„ 9์›” 11์ผ
ยท
2๊ฐœ์˜ ๋Œ“๊ธ€
post-thumbnail

์Šคํ„ฐ๋””์› ๊ตฌํ•˜๋‹ค ๋นก์นœ ๊ฐœ๋ฐœ์ž ์ฐพ์Šต๋‹ˆ๋‹ค

๊ฐœ๋ฐœ์ž๋ฅผ ์œ„ํ•œ ์ƒˆ๋กœ์šด ๋ชจ์ž„ ๊ณต๊ฐ„, Hola๋ฅผ ์†Œ๊ฐœํ•ฉ๋‹ˆ๋‹ค๐ŸŽ‰

2021๋…„ 8์›” 14์ผ
ยท
50๊ฐœ์˜ ๋Œ“๊ธ€
post-thumbnail

Intersection Observer API๋ฅผ ์ด์šฉํ•œ infinite scroll ๋งŒ๋“ค๊ธฐ!

Intersection Observer API๋ฅผ ์ด์šฉํ•œ Inifinite scroll ๊ตฌํ˜„์ž…๋‹ˆ๋‹ค.

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

AWS S3 presignedURL์„ ์ด์šฉํ•ด์„œ image Upload ํ•˜๊ธฐ

presigned URL์„ ์ด์šฉํ•œ S3 image ๋™์  ์—…๋กœ๋“œ ๊ฐ€์ด๋“œ์ž…๋‹ˆ๋‹ค. ๐Ÿ˜

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

์˜ˆ๋น„ ์ฐฝ์—… ํŒจํ‚ค์ง€(aka ์˜ˆ.์ฐฝ.ํŒจ) ํ•ฉ๊ฒฉ ํ›„๊ธฐ๐ŸŽ‰

์˜ˆ์ฐฝํŒจ ํ•ฉ๊ฒฉ ํ›„๊ธฐ ๊ฒธ 11K ์ƒํ™œ 4๊ฐœ์›” ํšŒ๊ณ !๐Ÿ˜

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

Webpack ๊ธฐ์ดˆ ๊ฐ„๋‹จ ์ •๋ฆฌโœจ - ๊ฐœ๋…ํŽธ

์›นํŒฉ์— ๋Œ€ํ•ด ์ •๋ฆฌํ•ด๋ณด์ž!๐Ÿ˜Š๐Ÿ˜Š

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

๐Ÿ“–๋นŒํŠธ์ธ ๊ฐ์ฒด

์ด๋ฒˆ ํฌ์ŠคํŒ…์—์„œ๋Š” ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ ๋นŒํŠธ์ธ ๊ฐ์ฒด์— ๋Œ€ํ•ด ์•Œ์•„๋ณด์ž!

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

Redux thunk vs Redux Saga

์ตœ๊ทผ์— ์ง„ํ–‰ํ•˜๋Š” ํ”„๋กœ์ ํŠธ๋“ค์—์„œ thunk์™€ saga๋ฅผ ๋‘˜ ๋‹ค ์จ๋ณผ ๊ธฐํšŒ๊ฐ€ ์žˆ์—ˆ๋‹ค. ๋‘ ๊ฐ€์ง€๋ฅผ ๋ชจ๋‘ ์‚ฌ์šฉํ•ด๋ณด๋ฉฐ ๋‘ ๋ฏธ๋“ค์›จ์–ด๊ฐ€ ์–ด๋–ค ์ฐจ์ด๊ฐ€ ์žˆ๋Š”์ง€ ์ •ํ™•ํžˆ ์ •๋ฆฌํ•ด๋†“๊ณ  ์‹ถ์–ด์„œ, ํฌ์ŠคํŒ…์„ ํ†ตํ•ด ์ •๋ฆฌํ•ด ๋†“๊ธฐ๋กœ ํ–ˆ๋‹ค.๐Ÿ˜Ž

2021๋…„ 4์›” 19์ผ
ยท
2๊ฐœ์˜ ๋Œ“๊ธ€
post-thumbnail

[๋ฐฐํฌ] AWS S3๋กœ ๋ฐฐํฌํ•œ ์•ฑ์— HTTPS ์ ์šฉํ•˜๊ธฐ

์ด๋ฒˆ ํฌ์ŠคํŒ…์—์„œ๋Š” ์ €๋ฒˆ ํฌ์ŠคํŒ…์— ์ด์–ด S3๋ฅผ ์ด์šฉํ•ด์„œ ๋ฐฐํฌํ•œ ์•ฑ์— HTTPS๋ฅผ ์ ์šฉํ•˜๋Š” ๊ณผ์ •์„ ์ •๋ฆฌํ•ด ๋ณผ ๊ฒƒ์ด๋‹ค! Route53, Cloudfront, ACM์„ ์ด์šฉํ•ด ๋„๋ฉ”์ธ ๊ตฌ์ž…๋ถ€ํ„ฐ HTTPS ์ ์šฉ ํ›„ ๋ฐฐํฌ์— ์ด๋ฅด๋Š” ์ „ ๊ณผ์ •์„ ์ •๋ฆฌํ•  ์˜ˆ์ •์ด๋‹ค. ๐Ÿ‘๐Ÿ‘

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

Redux Toolkit ์•Œ์•„๋ณด๊ธฐ

์ด๋ฒˆ ํฌ์ŠคํŒ…์—์„œ๋Š” redux toolkit์— ๋Œ€ํ•˜์—ฌ ์•Œ์•„๋ณด๊ณ , redux saga์™€ redux thunk๋ฅผ ์ ์šฉํ•˜์—ฌ ๋น„๋™๊ธฐ ํ†ต์‹ ์„ ํ•˜๋Š” ๊ณผ์ •์„ ์•Œ์•„๋ณด์ž๐Ÿ˜Š

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

[๋ฐฐํฌ] AWS์™€ github action์„ ์ด์šฉํ•ด ๋ฐฐํฌ ์ž๋™ํ™” ํ•˜๊ธฐ

S3๋กœ ๋ฐฐํฌํ•˜๋Š” ๋ฒ•์„ ์ฐพ์•„๋ณด๋‹ค๊ฐ€, github action + AWS S3 bucket์„ ์ด์šฉํ•˜๋ฉด ๋ฐฐํฌ ๊ณผ์ •์„ ์ž๋™ํ™” ํ•  ์ˆ˜ ์žˆ๋‹ค๊ณ  ํ•ด์„œ ์ง„ํ–‰์ค‘์ธ ํ”„๋กœ์ ํŠธ์— ์ ์šฉํ•ด ๋ณด์•˜๋‹ค.

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

VanilaJS๋กœ SPA ๊ตฌํ˜„ํ•˜๊ธฐ๐Ÿ˜Ž - 2

๋“œ~๋””์–ด! 2๊ธฐ๋™์•ˆ ์—ด์‹ฌํžˆ ์ง„ํ–‰ํ•œ J2KB ํ”„๋กœ์ ํŠธ๊ฐ€ ๋งˆ๋ฌด๋ฆฌ ๋˜์—ˆ๋‹ค! 2๊ธฐ์—๋Š” ๋ฐ”๋‹๋ผ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ SPA๋กœ ๋™์•„๋ฆฌ ์†Œ๊ฐœ ์›น ์„œ๋น„์Šค๋ฅผ ๋งŒ๋“ค์–ด ๋ณด์•˜๋‹ค.

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

๐Ÿ“–ES6 ํ•จ์ˆ˜์˜ ์ถ”๊ฐ€ ๊ธฐ๋Šฅ

์ด๋ฒˆ ํฌ์ŠคํŒ…์—์„œ๋Š” ES6 ํ•จ์ˆ˜์˜ ์ถ”๊ฐ€๊ธฐ๋Šฅ์— ๋Œ€ํ•ด ์•Œ์•„๋ณธ๋‹ค.

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

Javascript30 - Sticky Nav

์ด๋ฒˆ์— ์ง„ํ–‰ํ•œ ์‹ค์Šต์€ Sticky Nav๋กœ, scroll๋˜๋Š” ์œ„์น˜๋ฅผ ํŒŒ์•…ํ•ด์„œ Nav์˜ ์†์„ฑ์„ fixed๋กœ ๋ฐ”๊พธ์–ด์ฃผ๋Š” ๊ฐ„๋‹จํ•œ ์‹ค์Šต์„ ์ง„ํ–‰ํ–ˆ๋‹ค.

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

Javascript30 - Follow along link Highlighter

์˜ค๋žœ๋งŒ์— ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ 30 ํฌ์ŠคํŒ…์ด๋‹ค! ์ตœ๊ทผ์— ์ง„ํ–‰ํ•˜๋Š” ํ”„๋กœ์ ํŠธ์— ์‹ ๊ฒฝ ์“ฐ๋Š๋ผ, ์ƒ๋Œ€์ ์œผ๋กœ ๊ณ„์† ์šฐ์„ ์ˆœ์œ„์—์„œ ๋ฐ€๋ฆฌ๊ณ  ์žˆ๋‹ค๐Ÿ˜‚๐Ÿ˜‚ ๊ทธ๋ž˜์„œ ์ฃผ๋ง ์˜ค์ „์— ์งฌ์„ ๋‚ด์„œ ์ง„ํ–‰ํ•ด๋ณด์•˜๋‹ค. ์ด๋ฒˆ ์‹ค์Šต์€ Link Highlighter๋ฅผ ๋งŒ๋“ค์–ด ๋ณด์•˜๋‹ค.

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

ContextAPI๋ฅผ ์ด์šฉํ•œ ๋กœ๊ทธ์ธ ์ƒํƒœ ๊ด€๋ฆฌ

์ด๋ฒˆ ํฌ์ŠคํŒ…์—์„œ๋Š” React Router์™€ ContextAPI๋ฅผ ์ด์šฉํ•ด์„œ ๋กœ๊ทธ์ธ ๋œ ์‚ฌ์šฉ์ž์—๊ฒŒ๋งŒ ์ œํ•œ๋œ ํŽ˜์ด์ง€๋ฅผ ๋ณผ ์ˆ˜ ์žˆ๊ฒŒ๋” ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•ด๋ณด์ž. ๐Ÿ˜Š

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

VanilaJS๋กœ SPA ๊ตฌํ˜„ํ•˜๊ธฐ๐Ÿ˜Ž - 1

์ตœ๊ทผ์— J2KB 2๊ธฐ ์ง„ํ–‰๋˜๋Š” ํ•ด์ปคํ†ค์œผ๋กœ ๋™์•„๋ฆฌ ์†Œ๊ฐœ ์›นํŽ˜์ด์ง€๋ฅผ ๋งŒ๋“œ๋Š” ํ”„๋กœ์ ํŠธ๋ฅผ ์ง„ํ–‰์ค‘์— ์žˆ๋‹ค. javascript๋„ ์—ฐ์Šต ํ•  ๊ฒธ Vanila JS๋งŒ ์ด์šฉํ•ด์„œ ๋งŒ๋“ค์–ด ๋ณด๊ณ  ์žˆ๋‹ค. ๐Ÿ˜Ž

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

Javascript30 - Adding Up Times with Reduce

์ด๋ฒˆ ์‹ค์Šต์€ ์˜์ƒ์ด ์ญ‰ ์žˆ๋‹ค๊ณ  ๊ฐ€์ •ํ•˜๊ณ , data-time(dataset attribute)์— ํ‘œํ˜„๋˜์–ด ์žˆ๋Š” ์˜์ƒ ๊ธธ์ด ์ •๋ณด๋ฅผ ํ•œ๋ฒˆ์— ๊ฐ€์ ธ์™€์„œ console.log๋กœ ์ฐ๋Š” ์—ฐ์Šต์„ ํ•ด๋ณด์•˜๋‹ค.

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