์ธํ”„๋Ÿฐ ์˜๋ฌธ ๋ธŒ๋žœ๋“œ ๋กœ๊ณ 
์ธํ”„๋Ÿฐ ์˜๋ฌธ ๋ธŒ๋žœ๋“œ ๋กœ๊ณ 
์ฑ„๋„ํ†ก ์•„์ด์ฝ˜

์ฝ”๋”ฉ์€ ์ฒ˜์Œ์ด๋ผ with ์›น ํผ๋ธ”๋ฆฌ์‹ฑ - HTML ๊ธฐ์ดˆ

์ด ๊ฐ•์˜๋ฅผ ํ†ตํ•ด ์›นํŽ˜์ด์ง€๋ฅผ ๊ตฌ์„ฑํ•˜๋Š” 3๋Œ€ ์–ธ์–ด HTML, CSS, javascript์ค‘ HTML์–ธ์–ด์˜ ๊ธฐ๋ณธ๊ธฐ๋ฅผ ํ™•์‹คํ•˜๊ฒŒ ๋‹ค์งˆ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๊ฒ€์ƒ‰์— ์ตœ์ ํ™”๋œ, ์›น์ ‘๊ทผ์„ฑ๊ณผ ์›นํ‘œ์ค€์„ ์ค€์ˆ˜ํ•˜๋Š” HTML์„ ์ œ๋Œ€๋กœ ํ•™์Šตํ•ด๋ณด์„ธ์š”.

Thumbnail

์ž…๋ฌธ์ž๋ฅผ ์œ„ํ•ด ์ค€๋น„ํ•œ
[์›น ๊ฐœ๋ฐœ, ์›น ํผ๋ธ”๋ฆฌ์‹ฑ] ๊ฐ•์˜์ž…๋‹ˆ๋‹ค.

์ด๋Ÿฐ ๊ฑธ ๋ฐฐ์šธ ์ˆ˜ ์žˆ์–ด์š”

  • ์˜๋ฏธ์— ๋งž๋Š” ์˜ฌ๋ฐ”๋ฅธ HTML ์ž‘์„ฑ๋ฒ•

  • ์˜ฌ๋ฐ”๋ฅธ ํผ ์–‘์‹ ์ž‘์„ฑ๋ฒ•

์ฝ”๋”ฉ์ด ์ฒ˜์Œ์ด์‹ ๊ฐ€์š”?
์›น ๊ฐœ๋ฐœ์˜ ๊ทผ๋ณธ, HTML๋ถ€ํ„ฐ ์‹œ์ž‘ํ•ด์š”! ๐Ÿƒ 

์ฝ”๋”ฉ์€ ์ฒ˜์Œ์ด๋ผ with ์›นํผ๋ธ”๋ฆฌ์‹ฑ

์›น ๊ฐœ๋ฐœ์˜ ํ•ต์‹ฌ ์–ธ์–ด, HTML โœ”๏ธ

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

ํ™ˆํŽ˜์ด์ง€๋ฅผ ๊ตฌ์„ฑํ•˜๋Š” ์–ธ์–ด๋Š” 3๊ฐœ ๋ฐ–์— ์—†์Šต๋‹ˆ๋‹ค. ๊ทธ๋ฆฌ ๋งŽ์ง€ ์•Š์ฃ ? ๐Ÿ˜Š ์—„๋ฐ€ํžˆ ๋”ฐ์ง€๋ฉด ํฌ๋กฌ, ์‚ฌํŒŒ๋ฆฌ, ํŒŒ์ด์–ดํญ์Šค ๋“ฑ ์›นํŽ˜์ด์ง€๋ฅผ ๋ณด์—ฌ์ฃผ๋Š” ์›น๋ธŒ๋ผ์šฐ์ €๊ฐ€ ์ดํ•ดํ•˜๋Š” ์–ธ์–ด๋Š” 3๊ฐœ ๋ฐ–์— ์—†์Šต๋‹ˆ๋‹ค. ๊ทธ์ค‘ HTML์€ ๋‹จ์—ฐ์ฝ” ๊ฐ€์žฅ ์ค‘์š”ํ•œ ํ•ต์‹ฌ ์–ธ์–ด์ž…๋‹ˆ๋‹ค. CSS, JAVASCRIPT, React ๋“ฑ ๋งŽ์ด ๋“ค์–ด๋ณด์…จ์„ ์–ธ์–ด๋“ค์€ ๋ชจ๋‘ HTML๋กœ ์ž‘์„ฑ๋œ ์–ธ์–ด๋ฅผ ๋ณด์™„ํ•˜๋Š” ์—ญํ• ์„ ํ•ฉ๋‹ˆ๋‹ค. HTML์ด ์ž˜๋ชป ์ž‘์„ฑ๋˜์—ˆ๋‹ค๋ฉด ์ฃผ๊ฐ์ด ์ „๋„๋œ ์›นํŽ˜์ด์ง€๊ฐ€ ๋˜๊ฒ ์ฃ ? ์ด๋ฒˆ ๊ฐ•์˜์—์„  HTML ํƒœ๊ทธ๋ฅผ ์ด์šฉํ•˜์—ฌ ์ „๋‹ฌํ•˜๊ณ ์ž ํ•˜๋Š” ๋‚ด์šฉ์„ ์ •ํ™•ํ•˜๊ฒŒ ์ž‘์„ฑํ•˜๋Š” ๊ฒƒ์„ ๋ชฉํ‘œ๋กœ ํ•ฉ๋‹ˆ๋‹ค.

์›นํŽ˜์ด์ง€๋Š” ์—„์—ฐํ•œ ๋ฌธ์„œ์ž…๋‹ˆ๋‹ค. ๋ฌธ์„œ๋Š” ์ „๋‹ฌํ•˜๊ณ ์ž ํ•˜๋Š” ๋‚ด์šฉ๊ณผ ๋ชฉ์ ์ด ๋ถ„๋ช…ํ•˜๊ณ , ๋ชฉ์ ํ•œ ๋ฐ”๋ฅผ ์ด๋ฃฐ ์ˆ˜ ์žˆ๋„๋ก ๊ตฌ์„ฑ๋˜์–ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. HTML ์–ธ์–ด ๋ณธ์—ฐ์˜ ๊ธฐ๋Šฅ์— ์ถฉ์‹คํ•˜๊ฒŒ ์ž‘์„ฑํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ๋ฐฐ์›Œ๋ณด์„ธ์š”!

โœ”๏ธ ๋„์„œ ์ €์ž ์ง๊ฐ• ๊ฐ•์˜๋ฅผ ๋งŒ๋‚˜๋ณด์„ธ์š”!

  • ๋ณธ ๊ฐ•์˜๋Š” ์˜์ง„๋‹ท์ปด์˜ ๋„์„œ <์ฝ”๋”ฉ์€ ์ฒ˜์Œ์ด๋ผ with ์›น ํผ๋ธ”๋ฆฌ์‹ฑ>์˜ ์ €์ž๊ฐ€ ๋„์„œ ๋‚ด์šฉ์„ ๊ธฐ๋ฐ˜์œผ๋กœ ๊ฐ•์˜๋ฅผ ์ง„ํ–‰ํ•ฉ๋‹ˆ๋‹ค. ๋„์„œ์™€ ํ•จ๊ป˜ ๋ณด์‹œ๋ฉด ํ•™์Šต์— ๋” ๋„์›€์ด ๋˜์‹ค ๊ฑฐ์˜ˆ์š”.
  • ๋ณด์ถฉํ•™์Šต์ด ํ•„์š”ํ•˜์‹œ๋‹ค๋ฉด ์ €์ž์˜ ์œ ํŠœ๋ธŒ ์ฑ„๋„์—์„œ ์ถ”๊ฐ€ ๊ฐ•์˜๋ฅผ ๋งŒ๋‚˜๋ณด์„ธ์š”.

์ด๋Ÿฐ ๋ถ„๋“ค๊ป˜ ์ถ”์ฒœํ•ด์š” ๐Ÿ™‹

์ฝ”๋”ฉ ๊ฒฝํ—˜์€ ์—†์ง€๋งŒ
์›น ๊ฐœ๋ฐœ์— ์ž…๋ฌธํ•˜๊ณ  ์‹ถ์€ ๋ถ„

์›น ๊ฐœ๋ฐœ์ž๋กœ ์ด์ง์„ ์ค€๋น„ํ•˜๋Š”
์›น๋””์ž์ด๋„ˆ

ํ”„๋ŸฐํŠธ์—”๋“œ๋ฅผ ๋ณด์™„ํ•˜๊ณ  ์‹ถ์€
๋ฐฑ์—”๋“œ ๊ฐœ๋ฐœ์ž

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

HTML์„ ๊ธฐ์ดˆ๋กœ CSS, Javascript ์ˆœ์„œ๋ฅผ ํ•™์Šตํ•œ ํ›„, React์™€ ๊ฐ™์€ ์–ธ์–ด๋กœ Javascript๋ฅผ ์—…๊ทธ๋ ˆ์ด๋“œํ•˜์—ฌ ์›น ํผ๋ธ”๋ฆฌ์…”๋กœ ๊ฑฐ๋“ญ๋‚œ ํ›„, php, Python, Java ๋“ฑ ๋ฐฑ์—”๋“œ ์–ธ์–ด๋ฅผ ํ•™์Šตํ•˜์—ฌ ๋ฐฑ์—”๋“œ ๊ฐœ๋ฐœ์— ๋„์ „ํ•˜๋Š” ๊ฒƒ์„ ์ถ”์ฒœํ•ฉ๋‹ˆ๋‹ค.


ํ•™์Šต ๋‚ด์šฉ ๐Ÿ“š

์„น์…˜ 1

HTML ๋ฌธ์„œ ํƒ€์ž…๋ถ€ํ„ฐ, ์ œ๋ชฉ, ๋ฆฌ์ŠคํŠธ, ์ด๋ฏธ์ง€, ํ…Œ์ด๋ธ” ๋“ฑ ์›นํŽ˜์ด์ง€์˜ ๋‚ด์šฉ์— ํ•„์š”ํ•œ ๊ธฐ๋ณธ ํƒœ๊ทธ๋ฅผ ํ•™์Šตํ•ฉ๋‹ˆ๋‹ค.

์„น์…˜ 2

์„น์…˜ 1์—์„œ ํ•™์Šตํ•œ ๋‚ด์šฉ์„ ๋ฐ”ํƒ•์œผ๋กœ ์‹ค๋ฌด์™€ ๊ฐ™์ด ๋””์ž์ธ ์ฐธ์กฐํ•˜์—ฌ HTML ๊ตฌ์กฐ๋ฅผ ์ž‘์„ฑํ•ด๋ด…๋‹ˆ๋‹ค. ๋””์ž์ธ์—์„œ ์ฝ”๋”ฉ์— ํ•„์š”ํ•œ ์‚ฌํ•ญ์„ ํŒŒ์•…ํ•˜๊ณ , ์ด๋ฏธ์ง€ ์ค€๋น„ ํ›„ ๋‚ด์šฉ์— ๋งž์ถฐ HTML์„ ์ž‘์„ฑํ•ฉ๋‹ˆ๋‹ค. 


HTML ๋‹ค์Œ์€ CSS! ๐ŸŽจ

๋ณธ ๊ฐ•์˜๋ฅผ ํ†ตํ•ด HTML ๊ธฐ์ดˆ๋ฅผ ์ตํ˜”๋‹ค๋ฉด, CSS๊นŒ์ง€ ์ •๋ณตํ•ด๋ณด์„ธ์š”!

์†Œํ†ต ์ฐฝ๊ตฌ(์„ค๋ฌธ, 1:1์˜คํ”ˆ ์ฑ„ํŒ…๋ฐฉ)โœ’๏ธ

์ˆ˜๊ฐ•์ƒ ๋ถ„๋“ค์€ ์ƒˆ์†Œ์‹๋ž€์˜ ์†Œ๊ฐœ๋˜์–ด ์žˆ๋Š” ๊ตฌ๊ธ€ ์„ค๋ฌธ๊ณผ 1:1 ์˜คํ”ˆ ์ฑ„ํŒ…๋ฐฉ์„ ํ†ตํ•ด ์–ธ์ œ๋“  ์˜๊ฒฌ๊ณผ ์งˆ๋ฌธ์„ ํ•˜์‹ค์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์ง€์‹๊ณต์œ ์ž ์†Œ๊ฐœ โœ’๏ธ

์•ˆ๋…•ํ•˜์„ธ์š”. rock's easyweb ์œ ํŠœ๋ธŒ ์ฑ„๋„ ์šด์˜์ž ๊น€๋™์ฃผ ๊ฐ•์‚ฌ์ž…๋‹ˆ๋‹ค.  

์ฃผ์š” ๋„์„œ

  • ์›น๋””์ž์ธ & ์›น ํผ๋ธ”๋ฆฌ์‹ฑ์„ ์œ„ํ•œ ํ”ผ๊ทธ๋งˆ ์™„๋ฒฝ ํ™œ์šฉ์„œ - ๋น„์ œ์ดํผ๋ธ”๋ฆญ ์ถœํŒ์‚ฌ

  • ์ฝ”๋”ฉ์€ ์ฒ˜์Œ์ด๋ผ with ์›น ํผ๋ธ”๋ฆฌ์‹ฑ - ์˜์ง„๋‹ท์ปด

Contact Me

์˜คํ”„๋ผ์ธ ๊ฐ•์˜ ์ •๋ณด, ์ถ”๊ฐ€ ์˜์ƒ ๋“ฑ์„ ํ™•์ธํ•˜์‹ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. 

 

์ด๋Ÿฐ ๋ถ„๋“ค๊ป˜
์ถ”์ฒœ๋“œ๋ ค์š”!

ํ•™์Šต ๋Œ€์ƒ์€
๋ˆ„๊ตฌ์ผ๊นŒ์š”?

  • ์ฝ”๋”ฉ์„ ์ฒ˜์Œ ์ ‘ํ•˜๋Š” ๋ถ„

  • ์›นํผ๋ธ”๋ฆฌ์…”๋ฅผ ํฌ๋งํ•˜๋Š” ๋ถ„

  • ์›นํผ๋ธ”๋ฆฌ์…”๋กœ ์ด์งํ•˜๊ณ  ์‹ถ์€ ์›น ๋””์ž์ด๋„ˆ ๋ถ„

์•ˆ๋…•ํ•˜์„ธ์š”
์ด์ง€์›น์ž…๋‹ˆ๋‹ค.

2,329

๋ช…

์ˆ˜๊ฐ•์ƒ

37

๊ฐœ

์ˆ˜๊ฐ•ํ‰

2

๊ฐœ

๋‹ต๋ณ€

4.9

์ 

๊ฐ•์˜ ํ‰์ 

8

๊ฐœ

๊ฐ•์˜

โ–  [ํ˜„์žฌ] ๊ทธ๋ฆฐ์ปดํ“จํ„ฐ์•„ํŠธํ•™์› ์›นํผ๋ธ”๋ฆฌ์‹ฑ, ํ”„๋ก ํŠธ์—”๋“œ ๊ฐ•์˜
โ–  [ํ˜„์žฌ] ์›น ํผ๋ธ”๋ฆฌ์‹ฑ ์œ ํŠœ๋ธŒ ์ฑ„๋„ 'Rock's Easyweb' ์šด์˜
โ–  ๋”์กฐ์€ ์ปดํ“จํ„ฐ์•„์นด๋ฐ๋ฏธ ์›น ํผ๋ธ”๋ฆฌ์‹ฑ ๊ฐ•์‚ฌ
โ–  ํ•œ๋น› ์ปดํ“จํ„ฐ์•„์นด๋ฐ๋ฏธ ์›น ํผ๋ธ”๋ฆฌ์‹ฑ ๊ฐ•์‚ฌ
โ–  ํ”„๋ก ํŠธ์—”๋“œ ํผ๋ธ”๋ฆฌ์…”, ํ”„๋ก ํŠธ์—”๋“œ ํผ๋ธ”๋ฆฌ์‹ฑ ์ „๋ฌธ๊ฐ•์‚ฌ
โ–  UI/UX ์›น ๋””์ž์ธ ํฌํŠธํด๋ฆฌ์˜ค ๊ฐ•์˜


[ ๋„์„œ ]
2021.07.19 ์ถœ๊ฐ„ / ์›น๋””์ž์ธ & ์›นํผ๋ธ”๋ฆฌ์‹ฑ์„ ์œ„ํ•œ ํ”ผ๊ทธ๋งˆ ์™„๋ฒฝ ํ™œ์šฉ์„œ / ๋น„์ œ์ดํผ๋ธ”๋ฆญ

2022.08.25 ์ถœ๊ฐ„  / ์ฝ”๋”ฉ์„ ์ฒ˜์Œ์ด๋ผ with ์›น ํผ๋ธ”๋ฆฌ์‹ฑ  / ์˜์ง„์ถœํŒ์‚ฌ

2023.10 ์ถœ๊ฐ„ /2024 SD์—๋“€ ์œ ์„ ๋ฐฐ ์›น๋””์ž์ธ๊ธฐ๋Šฅ์‚ฌ ์‹ค๊ธฐ ๊ณผ์™ธ๋…ธํŠธ / ์‹œ๋Œ€๊ณ ์‹œ๊ธฐํš

2024.11 ์žฌํŒ /2025 SD์—๋“€ ์œ ์„ ๋ฐฐ ์›น๋””์ž์ธ๊ธฐ๋Šฅ์‚ฌ ์‹ค๊ธฐ ๊ณผ์™ธ๋…ธํŠธ / ์‹œ๋Œ€๊ณ ์‹œ๊ธฐํš

 

[ ์ˆ˜์ƒ๊ฒฝ๋ ฅ ]
2022.08 ๊ทธ๋ฆฐ์ปดํ“จํ„ฐ ์•„ํŠธ ํ•™์› ์ข…๋กœ์ง€์  - ์šฐ์ˆ˜๊ฐ•์‚ฌ 2021.06 ๊ทธ๋ฆฐ์ปดํ“จํ„ฐ ์•„ํŠธ ํ•™์› ์ข…๋กœ์ง€์  - ์šฐ์ˆ˜๊ฐ•์‚ฌ 2018.06 ๊ทธ๋ฆฐ ์ปดํ“จํ„ฐ์•„์นด๋ฐ๋ฏธ ์‹ ์ดŒ ์ง€์  - ์šฐ์ˆ˜๊ฐ•์‚ฌ 2017.05 ๊ทธ๋ฆฐ ์ปดํ“จํ„ฐ์•„์นด๋ฐ๋ฏธ ์‹ ์ดŒ ์ง€์  - ์šฐ์ˆ˜๊ฐ•์‚ฌ 2016.05 ๊ทธ๋ฆฐ ์ปดํ“จํ„ฐ์•„์นด๋ฐ๋ฏธ ์‹ ์ดŒ ์ง€์  - ์šฐ์ˆ˜๊ฐ•์‚ฌ 2015.10 ๊ทธ๋ฆฐ ์ปดํ“จํ„ฐ์•„์นด๋ฐ๋ฏธ ์‹ ์ดŒ ์ง€์  - ์šฐ์ˆ˜๊ฐ•์‚ฌ 

 

 

 

๋”๋ณด๊ธฐ

์ปค๋ฆฌํ˜๋Ÿผ

์ „์ฒด

14๊ฐœ โˆ™ (3์‹œ๊ฐ„ 39๋ถ„)

ํ•ด๋‹น ๊ฐ•์˜์—์„œ ์ œ๊ณต:

์ˆ˜์—…์ž๋ฃŒ
๊ฐ•์˜ ๊ฒŒ์‹œ์ผ: 
๋งˆ์ง€๋ง‰ ์—…๋ฐ์ดํŠธ์ผ: 

์ˆ˜๊ฐ•ํ‰

์•„์ง ์ถฉ๋ถ„ํ•œ ํ‰๊ฐ€๋ฅผ ๋ฐ›์ง€ ๋ชปํ•œ ๊ฐ•์˜์ž…๋‹ˆ๋‹ค.
๋ชจ๋‘์—๊ฒŒ ๋„์›€์ด ๋˜๋Š” ์ˆ˜๊ฐ•ํ‰์˜ ์ฃผ์ธ๊ณต์ด ๋˜์–ด์ฃผ์„ธ์š”!

๋ฌด๋ฃŒ