๋ฐ˜์‘ํ˜•

๐Ÿ› ๏ธ Dev. 12

Playstore ๊ฐœ๋ฐœ์ž ๊ณ„์ • ์ธ์ฆ (์ „๊ธฐ,๊ฐ€์Šค,์ž„๋Œ€๊ณ„์•ฝ์„œ ์„œ๋ฅ˜์ œ์ถœ ์ธ์ฆ์‹คํŒจ)

23๋…„๋„ ๋ถ€ํ„ฐ ์“ฐ๋˜ ๊ฐœ๋ฐœ์ž ๊ณ„์ •์— ์ธ์ฆ์ด ํ•„์š”ํ•˜๋‹ค๋Š” ๋ฉ”์„ธ์ง€๊ฐ€ ์™”์—ˆ๋Š”๋ฐ...๋ณด์ง€ ๋ชปํ•˜๊ณ , ์ธ์ฆ๊ธฐ๊ฐ„์ด ๋งŒ๋ฃŒ๋˜์–ด ์Šคํ† ์–ด ์•ฑ์ด ๋‚ด๋ ค๊ฐ€๊ฒŒ ๋๋‹ค. ๊ฐœ๋ฐœ์ž ๋ณธ์ธ์ธ์ฆ์„ ํ•˜๊ธฐ ์œ„ํ•ด์„ ์•„๋ž˜์™€๊ฐ™์€ ์ง€๋ฅ˜๊ฐ€ ํ•„์š”ํ•˜๋‹ค๋Š”๋ฐ..?- 90์ผ ์ด๋‚ด์— ๋ฐœํ–‰๋œ ์ „๊ธฐ, ์ˆ˜๋„ ๊ณต๊ณต์š”๊ธˆ ์ฒญ๊ตฌ์„œ- 90์ผ ์ด๋‚ด์— ๋ฐœํ–‰๋œ ์‹ ์šฉ์นด๋“œ ๋ช…์„ธ์„œ- 90์ผ ์ด๋‚ด์— ๋ฐœํ–‰๋œ ์€ํ–‰ ๋ช…์„ธ์„œ- 90์ผ ์ด๋‚ด์— ๋ฐœํ–‰๋œ ์ž„๋Œ€ ๊ณ„์•ฝ์„œ    ๋‚˜ ๊ฐ™์€ ๊ฒฝ์šฐ ์•„๋ž˜์™€ ๊ฐ™์€ ์„œ๋ฅ˜๋ฅผ 3๋ฒˆ์ด๋‚˜ ์ œ์ถœํ–ˆ๋Š”๋ฐ ์‹คํŒจ ํ–ˆ๋‹ค- ํ•œ์ „์ „๊ธฐ ์˜์ˆ˜์ฆ- ๋„์‹œ๊ฐ€์Šค ์˜์ˆ˜์ฆ- ์ž„๋Œ€๊ณ„์•ฝ์„œ ์™œ ์ธ์ง€ ๋ชจ๋ฅด๊ฒ ์œผ๋‚˜... (๋‹ค๋ฅธ๊ฑฐ ๋ชฐ๋ผ๋„ ์ง‘ ์ฃผ์†Œ๊ฐ€ ํฌํ•จ๋˜๋ฉด ๋œ๋‹ค๋Š”๋ฐ; ์•ˆ๋จ)์ธํ„ฐ๋„ท ๋“ฑ๊ธฐ๋ถ€๋“ฑ๋ณธ์„ ๋–ผ์„œ ๋‚ด๋‹ˆ๊นŒ ๋๋‹ค.์„œ๋ฅ˜ ๋ฐœ๊ธ‰์— 15๋ถ„์ฑ„ ์•ˆ๊ฑธ๋ฆฌ๊ณ  ๋ฌด๋ฃŒ์ด๋‹ˆ,๋ฐ”๋กœ ๋“ฑ๋ณธ ๋ฐœ๊ธ‰ํ›„ ๊ฐœ๋ฐœ์ž์ฝ˜์†”์—์„œ pdf๋กœ ์ฒจ๋ถ€ํ•˜๋ฉด 3์ผ๋‚ด์— ์ธ์ฆ์™„๋ฃŒ!(๋” ๋น ๋ฅผ..

Codepen์„ ํ‹ฐ์Šคํ† ๋ฆฌ๋‚˜ ๋ธ”๋กœ๊ทธ์— ๊ฐ€์ ธ์˜ค๊ธฐ

1. ์ฝ”๋“œํŽœ ์˜ค๋ฅธ์ชฝ ํ•˜๋‹จ์˜ Embed๋ฅผ ํด๋ฆญ   2. ์›ํ•˜๋Š” ์„ค์ •ํ›„ HTML ํƒญ์—์„œ copycode  3. ๊ธ€์“ฐ๊ธฐ ๋ฐ”์˜ ๊ฐ€์žฅ ์˜ค๋ฅธ์ชฝ, ๋ธ”๋กœ๊ทธ ๊ธ€์“ฐ๊ธฐ ๋ชจ๋“œ๋ฅผ HTML ์œผ๋กœ ๋ณ€๊ฒฝ ํ›„ ์‚ฝ์ž…   4. ๊ธ€์“ฐ๊ธฐ ๋ชจ๋“œ๋ฅผ ๋‹ค์‹œ ๊ธฐ๋ณธ๋ชจ๋“œ๋กœ ๋ฐ”๊พผ ํ›„ ์™„๋ฃŒ!(๊ธ€์“ธ๋•Œ ๋ณด๋ฉด ์•„๋ž˜ ์‚ฌ์ง„๊ณผ ๊ฐ™์ด ํ•ด๋‹น ๊ณ„์ •์— ๋“ค์–ด๊ฐ€์„œ ๋ณด๋ผ๊ณ  ๋‚˜์˜ค์ง€๋งŒ, ์‹ค์ œ๋กœ ๊ธ€์“ฐ๊ธฐ '์™„๋ฃŒ'๋กœ ํผ๋ธ”๋ฆฌ์‹ฑ ๋œ๊ฑธ๋ณด๋ฉด ์ œ๋Œ€๋กœ ๋™์ž‘ํ•œ๋‹ค)   See the Pen Untitled by galaxy_star (@fold6) on CodePen.

VS Code ํ•„์ˆ˜ ํ™•์žฅ ํ”„๋กœ๊ทธ๋žจ! Prettier ์„ค์ •ํ•˜๊ณ  ๋‹จ์ถ•ํ‚ค ๋ฐ”๊พธ๊ธฐ(js,css,html๋“ฑ ์ž๋™์ •๋ ฌ ํ™•์žฅํ”„๋กœ๊ทธ๋žจ)

์›๋ž˜์˜ Prettier ๋‹จ์ถ•ํ‚ค๋Š” ctrl + alt + p? ์ธ๊ฐ€ ๊ทธ๋Ÿฐ๋ฐ์ž์‹ ์ด ์“ฐ๊ณ ์‹ถ์€ ๊ฑธ๋กœ ๋ฐ”๊พธ๋ ค๋ฉด ์•„๋ž˜์ฒ˜๋Ÿผ ํ•˜๋ฉด ๋œ๋‹ค! 1. Prettier ๋‹ค์šด ๋ฐ  ์„ค์น˜2. ์„ค์ •(ctrl+,) ์—์„œ  default formatter ๊ฒ€์ƒ‰ํ•˜์—ฌ Prettier ๋กœ ์„ค์ •3. ํ‚ค๋ณด๋“œ ์„ค์ • (๋ฐ”๋กœ๊ฐ€๊ธฐ) ctrl+k ctrl+s ์—์„œ Format Document ๊ฒ€์ƒ‰ํ•˜์—ฌํ‚ค ๋ฐ”์ธ๋”ฉ : Ctrl + Shift+  B ๋ณ€๊ฒฝ(๋‚˜๋Š” ์œ„ ๋ฐ”์ธ๋”ฉ์ด ํŽธํ•ด์„œ ์ด๋ ‡๊ฒŒ ์”€)  ์ด๋ ‡๊ฒŒ prettier ์„ค์ •์—์„œ (ํ™•์žฅ ํ”„๋กœ๊ทธ๋žจ ๋ชฉ๋ก์˜ ํ†ฑ๋‹ˆ๋ฐ”ํ€ด ์•„์ด์ฝ˜ ํด๋ฆญ)TAB ๊ฐ€๋กœ ํญ๋„ ๋ฐ”๊ฟ€์ˆ˜์žˆ๋‹ค! (๊ธฐ๋ณธ์ด 2์ด๋ผ์„œ ๋‚˜๋Š” 4๋กœ ๋ณ€๊ฒฝ)

[Dev.console] ๊ฐœ๋ฐœ์ž๋„๊ตฌ์—์„œ ๋Š๋ฆฐ ๋„คํŠธ์›Œํฌ ํ™˜๊ฒฝ ์‹œ๋ฎฌ๋ ˆ์ด์…˜ ํ•˜๊ธฐ (3G,4G,๋„คํŠธ์›Œํฌ ๋Š๊น€)

| ๋ฐฉ๋ฒ• - ๊ฐœ๋ฐœ์ž ๋„๊ตฌ (F12) - Network ํƒญ - ์™€์ดํŒŒ์ด ์•„์ด์ฝ˜ ํด๋ฆญ - Throttling (์Šค๋กœํ‹€๋ง) ์„ค์ • - ์ƒˆ๋กœ๊ณ ์นจ[์Šค๋กœํ‹€๋ง ์ข…๋ฅ˜]- Offline: ์ธํ„ฐ๋„ท ์—ฐ๊ฒฐ์ด ์—†๋Š” ์ƒํƒœ๋ฅผ ์‹œ๋ฎฌ๋ ˆ์ด์…˜.- GPRS: ๋งค์šฐ ๋Š๋ฆฐ ๋ชจ๋ฐ”์ผ ๋„คํŠธ์›Œํฌ(50kb/s)๋ฅผ ์‹œ๋ฎฌ๋ ˆ์ด์…˜.- Regular 2G: ์ผ๋ฐ˜ 2G ์†๋„.- Good 3G: ์ค‘๊ฐ„ ์ •๋„์˜ 3G ๋„คํŠธ์›Œํฌ ์†๋„.- Regular 4G: ๋น ๋ฅธ 4G ์†๋„๋ฅผ ์‹œ๋ฎฌ๋ ˆ์ด์…˜.- DSL: ์ผ๋ฐ˜์ ์ธ DSL ๋„คํŠธ์›Œํฌ ์†๋„๋ฅผ ์‹œ๋ฎฌ๋ ˆ์ด์…˜.-  Fast 3G: ๋น ๋ฅธ 3G ์†๋„๋ฅผ ์‹œ๋ฎฌ๋ ˆ์ด์…˜.

(5๋ถ„์ปท)๊นƒํ—ˆ๋ธŒ ๋ฐ์Šคํฌํƒ‘, ๊นƒํ—ˆ๋ธŒ ์›นํŽ˜์ด์ง€ repository(๋ ˆํฌ) ์ด๋ฆ„ ๋ฐ”๊พธ๊ณ  ์—ฐ๊ฒฐํ•˜๊ธฐ (git bash ์“ฐ์ง€ ์•Š์€ ๊ฐ„๋‹จํ•œ ๋ฐฉ๋ฒ•!)

1.๋กœ์ปฌ์—์„œ ์ด๋ฆ„ ๋ฐ”๊ฟ€ ํด๋”๋ฅผ ์—ด๊ณ  '์ด๋ฆ„ ๋ฐ”๊พธ๊ธฐ'๋กœ ์ด๋ฆ„์„ ๋ฐ”๊ฟˆ 2. ๊นƒํ—ˆ๋ธŒ ์›น ํŽ˜์ด์ง€์˜ setting ํƒญ์—๊ฐ€์„œ ์ด๋ฆ„์„ ๋ฐ”๊ฟˆ 3. ๊นƒํ—ˆ๋ธŒ ๋ฐ์Šคํฌํƒ‘์„ ์—ด๊ณ  Repository - remote ์—์„œ ์ฃผ์†Œ ์ด๋ฆ„์„ ์ƒˆ๋กœ ๋ฐ”๊พผ repo ํด๋”๋ช…์œผ๋กœ ๋ณ€๊ฒฝ + remote ์ฃผ์†Œ์—ฐ๊ฒฐ  4. ์›๋ž˜ ๊ฒƒ๋“ค์„ ๋‹ค์‹œ push ํ•ด์ฃผ๋ฉด ์ž˜ ์—ฐ๊ฒฐ๋๊ณ , repo ์ด๋ฆ„์ด ์ž˜ ๋ณ€ํ•œ๊ฒƒ์„ ์•Œ ์ˆ˜ ์žˆ์Œ (history๋„ ๊ทธ๋Œ€๋กœ ๋‚จ์•„์žˆ์Œ)

VS code ๊ฟ€ํŒ : ํด๋” ์•ˆ ์ฝ”๋“œ์— ๋“ค์–ด์žˆ๋Š” ๋ฌธ์ž ์ฐพ๋Š” ๋‹จ์ถ•ํ‚ค

๐Ÿ”ฐ๋‹จ์ถ•ํ‚ค :Ctrl + shift + F ์ด๋Ÿฐ์‹์œผ๋กœ ํŠน์ •๋ฌธ์ž๋ฅผ ๊ฒ€์ƒ‰ํ•ด ์ฐพ์„ ์ˆ˜ ์žˆ๋‹น  ... ์„ ๋ˆ„๋ฅด๋ฉด 'ํฌํ•จํ•  ํŒŒ์ผ' ์ด๋ผ๊ณ , ํ™•์žฅ์ž ๋ช… ๋˜ํ•œ ์ž…๋ ฅํ•ด์„œ ์ฐพ์„ ์ˆ˜ ์žˆ๋‹ค!     ์ „์— ํผ๋ธ”๋ฆฌ์…” ์นœ๊ตฌ๊ฐ€ ๋ฐฑ์—”๋“œ๊ฐ€ ์ž‘์—…ํ•œphp ํŒŒ์ผ ์•ˆ์—์žˆ๋Š” ๋ณ€์ˆ˜๋ฅผ ์ฐพ์•„์•ผ ํ–ˆ๋Š”๋ฐ,ํŒŒ์ผ ํ•˜๋‚˜ ํ•˜๋‚˜ ๋‹ค ํŽผ์น˜๊ธฐ์—๋Š” ๋„ˆ๋ฌด ์‹œ๊ฐ„์ด ๊ฑธ๋ ค์„œ...์ฐพ์•˜๋˜ ๋ฐฉ๋ฒ•ใ…Žใ…Ž '๋‹จ์–ด๋Š” ๊ธฐ์–ต๋‚˜๋Š”๋ฐ, ์–ด๋”” ์žˆ๋”๋ผ..?'์‹ถ์„๋•Œ ์ •๋ง ์œ ์šฉํ•œ ๊ธฐ๋Šฅใ…Žใ…Ž

Vs code live server ์ž๋™ ์ƒˆ๋กœ๊ณ ์นจ ์•ˆ๋ ๋•Œ ํ•ด๊ฒฐ๋ฐฉ๋ฒ• + ๋ผ์ด๋ธŒ ์„œ๋ฒ„ ์ž๋™ ์ €์žฅ๋ฐฉ๋ฒ•

๋ผ์ด๋ธŒ ์„œ๋ฒ„์—์„œ ์ž๋™ ์ƒˆ๋กœ๊ณ ์นจ์ด ์•ˆ๋˜๋Š” ๊ฒฝ์šฐ ํ•ด๊ฒฐ๋ฐฉ๋ฒ•์€ 4๊ฐ€์ง€๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค. 1. ํ˜น์‹œ ๋ผ์ด๋ธŒ ์„œ๋ฒ„๋ฅผ ์‹คํ–‰ํ•˜๊ณ ์ž ํ•˜๋Š” ํŒŒ์ผ ์ œ๋ชฉ ์ฒซ๋ฒˆ์งธ ๊ธ€์ž๊ฐ€ .์ธ ๊ฒฝ์šฐ .์„ ์—†์• ์ž! -ex) .samsungweb.html ๊ฐ™์€ ์ œ๋ชฉ์ผ๋•Œ .์„ ์—†์• ์–ด samsungweb.html์œผ๋กœ ์ €์žฅ. 2. ํ˜น์‹œ ๋ผ์ด๋ธŒ ์„œ๋ฒ„๋ฅผ ์‹คํ–‰ํ•˜๊ณ ์ž ํ•˜๋Š” ํŒŒ์ผ์˜ ์ƒ์œ„ ํด๋” ์ œ๋ชฉ์— #์ด ๋“ค์–ด๊ฐ”๋‹ค๋ฉด #์„ ์—†์• ์ž! 3. "UTF-8"์„ ์ ์ง€ ์•Š์•˜๋‹ค๋ฉด ์ž‘์„ฑ! (+ ๋กœ ์ œ๋Œ€๋กœ ์ ์—ˆ๋Š”์ง€ ํ™•์ธ) 4. ์„ค์ •- auto save๋ฅผ ๊ฒ€์ƒ‰ํ•ด ์‚ฌ์ง„๊ณผ ๊ฐ™์ด afterdelay๋กœ ๋ณ€๊ฒฝ! delay๋ฅผ 600 (0.6์ดˆ)๋กœ ๋ณ€๊ฒฝ!

VS code ์ฝ”๋”ฉํ”„๋กœ๊ทธ๋žจ ๋ฐฐ๊ฒฝํ™”๋ฉดํ…Œ๋งˆ ๋ฐ”๊พธ๊ธฐ (ํ…Œ๋งˆ์ ์šฉ)(+์ดˆ๋ณด์ž์šฉ .json ์„ค์ •๊ฐ’)

1. ์•„๋ž˜์˜ ์‚ฌ์ดํŠธ or ํ”„๋กœ๊ทธ๋žจ ๋‚ด๋ถ€์— background ๋ฅผ ๊ฒ€์ƒ‰ํ•˜์—ฌ ํ”„๋กœ๊ทธ๋žจ์„ ๋ฐ›์Šต๋‹ˆ๋‹ค. marketplace.visualstudio.com/items?itemName=shalldie.background visual studio ๋‚ด๋ถ€์˜ ๋งˆ์ผ“ํ”Œ๋ ˆ์ด์Šค์—์„œ ๊ฒ€์ƒ‰ํ• ์‹œ ๋™๋ฐฉํ”„๋กœ์ ํŠธ ์บ๋ฆญํ„ฐ, ๋งˆ๋ฆฌ์‚ฌ๊ฐ€ ๋ฐ˜๊ฒจ์ฃผ๋„ค์š”! (์—ญ์‹œ ๋™๋•๋“ค;; ์–ด๋งˆ๋ฌด์‹œํ•œ ๊ธฐ์ˆ ๋ ฅ...) 2. ์„ค์น˜ ํ›„ ํ†ฑ๋‹ˆ๋ฐ”ํ€ด ๋ฒ„ํŠผ์„ ๋ˆŒ๋Ÿฌ ํ™•์žฅ์„ค์ •์— ์ง„์ž…ํ•ฉ๋‹ˆ๋‹ค. 3. '๊ธฐ์กด์ด๋ฏธ์ง€๋ฅผ ์‚ฌ์šฉ?' (๋™ํ”„๋•ํ›„๋ผ๋ฉด ์‚ฌ์šฉํ• ๋งŒ๋„?) ์ฒดํฌ๋ฐ•์Šค๋ฅผ ์‚ฌ์ง„๊ณผ ๊ฐ™์ด ํ•ด์ œ ํ•ด์ค๋‹ˆ๋‹ค. ์ดํ›„์— ํŽธ์ง‘๋งํฌ๋ฅผ ํด๋ฆญํ•˜์—ฌ .json์— ์ง„์ž…ํ•ฉ๋‹ˆ๋‹ค. 4. ์Šคํฌ๋ฆฐ์ƒท์— ๋‚˜์˜จ๊ฒƒ์ฒ˜๋Ÿผ ์‚ฌ์ง„์ด ๋“ค์–ด์žˆ๋Š” ์œ„์น˜๋ฅผ ์žก์•„์ค๋‹ˆ๋‹ค. โ€ป ํŒŒ์ผ๋ช…์— ํ•œ๊ธ€ ๋“ค์–ด๊ฐ€๋ฉด ์•ˆ๋ฉ๋‹ˆ๋‹ค. background position(์‚ฌ์ง„์„ ์–ด๋””์— ๋„..

VS Code ์ดˆ๋ณดํŒ! ํƒœ๊ทธ ์ž๋™์™„์„ฑ ๋„๋Š”๋ฒ• (IntelliSense ๋„๊ธฐ)

์ฃผํ™ฉ์ƒ‰ charset์ด ๋ณด์ด์‹œ๋‚˜์š”? ์ธํ…”๋ฆฌ์„ผ์Šค์˜ ์ž๋™์™„์„ฑ๊ธฐ๋Šฅ์ž…๋‹ˆ๋‹ค. ์ž๊พธ ํƒœ๊ทธ๋‚˜ ๋‹ค๋ฅธ๊ฒƒ๋“ค์ด ์ž๋™์™„์„ฑ์œผ๋กœ ๋œจ๋ฉด ๊ธฐ๋ณธ์ฝ”๋“œ๋ฅผ ์™ธ์šฐ๋Š”๊ฑฐ ์กฐ์ฐจ ์‰ฝ์ง€ ์•Š์ฃ  (๊ฟ€๊ธฐ๋Šฅ์ด์ง€๋งŒ ๋„๊ณ ์‹ถ์€ ์ดˆ๋ณด๋„์žˆ์ฃ ใ…Žใ…Ž) ๊ทธ๋ž˜์„œ ์ด๋ ‡๊ฒŒ ์„ค์ • (ctrl+;)์— ๊ฐ€์„œ IntelliSense๋ฅผ ๊ฒ€์ƒ‰ํ•œํ›„ ๊ด€๋ จ ์ฒดํฌ ๋ฐ•์Šค๋ฅผ ๋ชจ๋‘ ํ•ด์ œํ•˜๋ฉด ๋œ๋‹ต๋‹ˆ๋‹ค. (์†์„ฑ์ œํ•œ ํ•ด์ œ๋Š” ๊ผญ ํ•˜์…”์•ผ ๊ธฐ๋ณธ์ ์ธ ํƒœ๊ทธ๊ฐ€ ์•ˆ๋œน๋‹ˆ๋‹ค~)

๋ฐ˜์‘ํ˜•