FrontEnd
Javascript
Diary
ML
CS
Django
Algorithm
AWS
Co-Work
HTML
CSS
Python
React
ReactNative

Blog Migration

๐Ÿ“š ๋‚˜์˜ ๋ธ”๋กœ๊ทธ๋“ค

2020๋…„ ๋“ค์–ด์„œ ์†Œ๋งํ•˜๋˜ ๋ธ”๋กœ๊ทธ ์ด์‚ฌ๋ฅผ ๋๋ƒˆ๋‹ค๐Ÿ™‚๐Ÿ™‚ ์ง€๊ธˆ ์ƒ๊ฐํ•ด๋ณด๋ฉด ์™œ ์ด๋ ‡๊ฒŒ ์˜ค๋ž˜๊ฑธ๋ ธ๋ƒ ์‹ถ์ง€๋งŒ.. ๋‹ค์‹œ ๋Œ์•„๊ฐ€๋„ ๋น„์Šทํ•˜์ง€ ์•Š์„๊นŒ

2017๋…„ ๋งˆ์ผ€ํŒ…์ชฝ์œผ๋กœ ๊ณต๋ถ€๋ฅผ ํ•ด๋ณด๊ฒ ๋‹ค๋ฉฐ ๋„ค์ด๋ฒ„ ๋ธ”๋กœ๊ทธ๋ฅผ ์‹œ์ž‘ํ–ˆ์—ˆ๋‹ค. ๊ทธ ์ดํ›„ 2019๋…„ ๊ฐœ๋ฐœ์ด ํ•˜๊ณ  ์‹ถ์–ด Google Blogger๋ฅผ ์ฒ˜์Œ ์‹œ์ž‘ํ•˜๊ฒŒ ๋˜์—ˆ๋Š”๋ฐ ๊ทธ ๋•Œ๋„ ์—ฌ๋Ÿฌ ์„ ํƒ์ง€ ๊ฐ€์šด๋ฐ Blogger๋ฅผ ์„ ํƒํ–ˆ์—ˆ๋‹ค.

๋ธ”๋กœ๊ทธ์˜ ์˜์†์„ฑ์„ ๋”ฐ์ง€๋”๋ผ๋„ Tistory ๋ณด๋‹ค๋Š” Blogger๊ฐ€ ์˜ค๋ž˜๊ฐˆ ๊ฒƒ ๊ฐ™์•˜๊ณ  ๊ตฌ๊ธ€๋ง์„ ์ž์ฃผํ•˜๋Š” ๊ฐœ๋ฐœ์ž์˜ ํŠน์„ฑ์ƒ google search์— ์ข€๋” ์ตœ์ ํ™” ๋˜์–ด์žˆ๋‹ค๋Š” ๋Š๋‚Œ์„ ๋ฐ›์•˜์œผ๋ฉฐ, ์ผ๋‹จ ๋ฌด์—‡๋ณด๋‹ค๋„ Google์—์„œ ์ œ๊ณตํ•˜๋Š” ์„œ๋น„์Šค๊ฐ€ ๋ฉ‹์žˆ๋‹ค๊ณ  ์ƒ๊ฐํ–ˆ๋‹ค.


๐Ÿƒโ€โ™‚๏ธ ์ด์‚ฌ๊ฒฐ์‹ฌ

๊ทธ๋Ÿฐ๋ฐ ๋ฐ˜๋…„๊ฐ„ ํฌ์ŠคํŒ…์„ ํ•˜๋ฉด์„œ ๋‚˜๋ฆ„ ๋ธ”๋กœ๊ทธ๋กœ ์ˆ˜์ต์„ ๋‚ด๋ณด๊ฒ ๋‹ค๊ณ  ๋ถ™์ธ ๊ตฌ๊ธ€ ์• ๋“œ์„ผ์Šค์™€, code editor์—์„œ์˜ code ๋ณต๋ถ™, ํ•œ์ •๋œ ํ…Œ๋งˆ์™€ ์ œํ•œ์ ์ธ ๊ธฐ๋Šฅ๋“ค๋กœ ์ธํ•ด ์ ์  UI, UX๋ถ€๋ถ„์— ์žˆ์–ด ์•ˆ ์ข‹์•„์ง€๊ธฐ ์‹œ์ž‘ํ–ˆ๋‹ค. (์•„๋ฌด๋ž˜๋„ ์†์„ธ์— ์ฐŒ๋“ค์–ด ์ˆ˜์ต์„ ๋‚ด๋ณด๊ฒ ๋‹ค๊ณ  ๋ถ™์ธ ์• ๋“œ์„ผ์Šค๊ฐ€ ํฐ ์—ญํ• ์„ ํ–ˆ๋‹ค.)

๋ชจ๋ฐ”์ผ ํŽธ์˜์„ฑ ๋ถ€๋ถ„์— ์žˆ์–ด์„œ๋„ ๋ฐ˜์‘ํ˜•์„ ๋ฌด์‹œํ•˜๋Š” ํฌ์ŠคํŒ…์„ ํ–ˆ์—ˆ๊ณ โ€ฆ

๊ธ€์˜ ๊ธฐ๋ณธ ๋ถ„๋ฅ˜๊ฐ€ ๋‚ ์งœ๋ถ„๋ฅ˜๋กœ ์ œ๊ณต ๋˜๊ธฐ๋•Œ๋ฌธ์— ๊ฐœ์ธ์ ์œผ๋กœ tag์— ๋”ฐ๋ฅธ ์ปค์Šคํ„ฐ๋งˆ์ด์ง•์„ ํ–ˆ์ง€๋งŒ ์—ฌ์ „ํžˆ ๋ณด๊ธฐ ๋ถˆํŽธํ•œ ์ ๋„ ํ•ญ์ƒ ๋งˆ์Œ์— ๊ฑธ๋ ธ๋‹ค.


๐Ÿ“Œ ์„ ํƒ

๊ทธ๋ฆฌ๊ณ  2020๋…„ ๋‹ค์‹œ๊ธˆ ๊ณต๋ถ€ํ•˜๋Š” ๊ฒƒ๋“ค์„ ์ •๋ฆฌํ•ด์•ผ๊ฒ ๋‹ค๊ณ  ์ƒ๊ฐ์„ ํ–ˆ๊ณ , ์ด๋ฒˆ์—๋Š” ํ”Œ๋žซํผ์˜ ์ข…์†์„ฑ์—์„œ ๋ฒ—์–ด๋‚˜ ๋‚˜๋งŒ์˜ ๋ธ”๋กœ๊ทธ๋ฅผ ๋งŒ๋“ค์–ด์•ผ๊ฒ ๋‹ค๊ณ  ์ƒ๊ฐํ–ˆ๋‹ค.

Django์— ์–ด๋Š์ •๋„ ์ต์ˆ™ํ•ด์กŒ๊ธฐ๋•Œ๋ฌธ์— Django๋กœ ๋งŒ๋“ค๊ณ  ๊ด€๋ฆฌ๋ฅผ ํ•  ์ˆ˜ ์žˆ์—ˆ์ง€๋งŒ ์ •์ ์ธ Page์ธ ๋งŒํผ Django๋กœ ๋งŒ๋“ค๊ธฐ ๋ณด๋‹ค๋Š” React๊ธฐ๋ฐ˜์˜ gatsby๋กœ ๋งŒ๋“ค๋ฉด์„œ React์™€๋„ ์ž๊พธ๋งŒ ๋ถ€๋”ชํ˜€๋ณด๊ณ  ์‹ถ์—ˆ๋‹ค.

์ด ๋ถ€๋ถ„์ด Hexo(node.js)๋‚˜ jekyll(ROR)๋ณด๋‹ค gatsby๋ฅผ ์„ ํƒํ•˜๊ฒŒ ๋œ ๊ฐ€์žฅ ํฐ์ด์œ ๋ผ ๋ณผ์ˆ˜์žˆ๋‹ค.


๐Ÿšš ์ด์‚ฌํ•˜๊ธฐ

ํ…œํ”Œ๋ฆฟ์„ ์‚ฌ์šฉํ•˜์ง€ ์•Š๊ณ  ๋‚˜๋งŒ์˜ ์ƒ‰๊น”์ด ๋ฌป์–ด๋‚˜๋Š” Blog๋ฅผ ๋งŒ๋“  ๋‹ค๋Š” ๊ฒƒ์€ ๊ฝค๋‚˜ ์–ด๋ ค์› ๋‹ค. ์ƒ์†Œํ•œ graphql ์‚ฌ์šฉ๋ฒ•๋ถ€ํ„ฐ ๊ฐ์ข… ํ”Œ๋Ÿฌ๊ทธ์ธ์˜ ์ ์šฉ์„ ์œ„ํ•ด ๊ธฐ์กด์˜ ํ…œํ”Œ๋ฆฟ์„ ์ฐธ๊ณ ํ•˜๊ณ  ๊ณต์‹ ํ™ˆํŽ˜์ด์ง€์˜ tutorial๋„ ์ฝ์–ด๋ณด๋ฉฐ ๋งŒ๋“ค๊ณ  ์žˆ๋‹ค.(ํ˜„์žฌ ์ง„ํ–‰ํ˜•)

ํ…Œ๋งˆ๋Š” ์ตœ๊ทผ ๋ง์ด ๋งŽ์€ neumorphism์„ ์ ์šฉ์‹œ์ผœ ๊น”๋”ํ•˜๊ณ  ๊ธ€์„ ์ฝ๋Š”๋ฐ ์ง‘์ค‘ํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ–ˆ๋‹ค. (๋””์ž์ธ ๊ฐ๊ฐ์ด ์žˆ์–ด๋ณด์ด๋Š” ์ž๊ธฐ๋งŒ์กฑ๋„ ์–ป์—ˆ๋‹ค.)

์–ด๋Š์ •๋„ ๊ธฐํ‹€์ด ๋‹ค์ ธ์ง„ ์ดํ›„ ์ด์ „ Blogger์— ์žˆ๋˜ ์ž๋ฃŒ์ค‘ JAVA๋ถ€๋ถ„์„ ์ œ์™ธํ•˜๊ณ  ํฌ์ŠคํŒ…๋“ค์„ Markdown์œผ๋กœ ์˜ฎ๊ฒจ๋‹ด์•„ ํฌ์ŠคํŒ…ํ–ˆ๊ณ  ๊ทธ ๊ฒฐ๊ณผ Blogger๋ณด๋‹ค ํ›จ์”ฌ ์ฝ๊ธฐ ํŽธ์•ˆํ•ด์ง„ ๊ฒƒ๊ฐ™๋‹ค. (ํฌ์ŠคํŒ…์„ md๋กœ ์˜ฎ๊ฒจ ๋‹ด์•˜๊ธฐ๋•Œ๋ฌธ์— ์ถ”ํ›„์— ๋‹ค์‹œ๊ธˆ ๋ธ”๋กœ๊ทธ๋ฅผ ์ด์‚ฌํ•  ์ผ์ด ์ƒ๊ฒจ๋„ ๋ฌธ์ œ์—†์ด ์˜ฎ๊ธธ ์ˆ˜ ์žˆ๊ฒŒ ๋˜์—ˆ๋‹ค.)

๊ทธ๋ฆฌ๊ณ  ๋‚˜๋งŒ์˜ ๋„๋ฉ”์ธ์„ ์‚ฌ๊ณ ์‹ถ์–ด io(input output)์™€ dev(develop)์ค‘ ์ตœ๊ทผ์— ๋‚˜์˜จ dev๋กœ ๊ตฌ๋งค๋ฅผ ํ–ˆ๊ณ  (๋” ์ €๋ ดํ•œ๊ฒƒ + ๋ฉ‹์ง) ๋ฐฐํฌ๋ฅผ ํ–ˆ๋˜ netlify์— ๋„๋ฉ”์ธ์„ ๋“ฑ๋กํ•˜์—ฌ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ๋‹ค. (CD(Continuous Deploy)๋ฅผ ์ž๋™์œผ๋กœ ํ•ด์ฃผ๋Š” ๋ถ€๋ถ„, ๋ฐฐํฌ์˜ ํŽธ๋ฆฌํ•จ ๋“ฑ ์•„์ฃผ์•„์ฃผ ํŽธํ•˜๊ฒŒ ์ด์šฉ์ค‘์ด๋‹ค.)

์•„์ง์€ ์ฑ„์›Œ์•ผ ํ• ๊ฒŒ ๋งŽ์€ runchi Blog์ด๋‹ค. ์•ž์œผ๋กœ ์ง€์†์ ์ธ ๋ธ”๋กœ๊ทธ ๊ด€๋ฆฌ์™€ ํฌ์ŠคํŒ…์„ ํ•ด๋‚˜๊ฐ€๋ฉฐ ๋‚˜์™€ ๊ฐ™์ด ์„ฑ์žฅํ•ด๋‚˜๊ฐˆ ๋ธ”๋กœ๊ทธ๋กœ ํ‚ค์›Œ์•ผ๊ฒ ๋‹ค.

๐Ÿพ ๋ฒˆ์™ธํ›„๊ธฐ

๊ทธ๋Ÿฐ ์˜๋ฏธ์—์„œ ์ง€๋‚œ ๋ธ”๋กœ๊ทธ์—์„œ๋Š” โ€˜๋ฒฝ์— ๊ทธ๋ฆฐ ๋‚˜์˜ ํ‚คโ€™๋ผ๊ณ  ์ด๋ฆ„์„ ์ง€์—ˆ์—ˆ๋‹ค.
์˜๋ฏธ๋Š” ์–ด๋ฆด์  ๋ฒฝ์ง€์— ๋‚ด๊ฐ€ ์ž๋ผ๋‚˜๋Š” ํ‚ค๋ฅผ ํ‘œ์‹œํ•ด ๋‘๊ณค ํ–ˆ์—ˆ๋Š”๋ฐ, ์–ด๋Š์ƒˆ ๋ณด๋ฉด ๋‚ด๊ฐ€ ์ด๋Ÿด๋•Œ๋„ ์žˆ์—ˆ๊ตฌ๋‚˜, ์ง€๊ธˆ์€ ๊ทธ๋•Œ์— ๋น„ํ•ด ๋งŽ์ด ์ปธ๊ตฌ๋‚˜ ํ•˜๋Š” ๋งŽ์€ ๊ฐ์ •์„ ๋Š๋ผ๊ฒŒ ํ–ˆ์—ˆ๋‹ค. ๋‚ด ๋ธ”๋กœ๊ทธ๋„ ์ผ์ƒ์ ์ด๊ณ  ์ˆœ๊ฐ„์ˆœ๊ฐ„์˜ ๊ธฐ๋ก์ด์ง€๋งŒ ํ›—๋‚  ๋Œ์•„๋ณด๋ฉด ๊ทธ๋Ÿฌํ•œ ๊ธฐ๋ก์ด ๋˜๊ณ  ์‹ถ์€ ์˜๋ฏธ๋กœ ์‚ฌ์šฉ์„ ํ–ˆ๋˜ ์ด๋ฆ„์ด์—ˆ๋‹ค. ๊ทธ๋ฆฌ๊ณ  ์‹ค์ œ๋กœ ์ด๋ฒˆ์— Blog migration ์ž‘์—…์„ ํ•˜๋ฉด์„œ๋„ 1๋…„์ „์˜ ๋‚˜๋ฅผ ๋˜๋Œ์•„๋ณผ์ˆ˜ ์žˆ์—ˆ๋˜, ์–ผ๋งˆ๋‚˜ ์„ฑ์žฅํ–ˆ๋Š”์ง€๋ฅผ ๊ฐ€๋Š ํ•ด๋ณผ์ˆ˜ ์žˆ์—ˆ๋˜, ์•ž์œผ๋กœ์˜ ๋ฐฉํ–ฅ์„ ๋‹ค ์žก์„ ์ˆ˜ ์žˆ์—ˆ๋˜ ์ข‹์€ ๊ธฐ๋ก์ด ๋˜์ฃผ์—ˆ๋‹ค.

ํ•˜์ง€๋งŒ ์ง€๊ธˆ์€ runchi๊ฐ€ ๋˜์—ˆ์ง€.