Bootstrap 4 & 3 Framework Tutorial
ํธ์ํฐ ์๋น์ค๋ฅผ ๊ฐ๋ฐ์ ์ํด ๋ง๋ค์ด์ง BootStrap์ ์ค๋๋ ๊ฐ์ฅ ๋ง์ด ์ฌ์ฉํ๋ HTML5 ์น ํ๋ ์์ํฌ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์
๋๋ค.์๋จ ๋ฉ๋ด,๋ฒํผ, ํ์ ๋ชฉ๋ง ๋ฑ ๋ค์ํ UI ์์๋ค์ ์์ฝ๊ฒ ์ฌ์ฉํ ์ ์๋๋ก ๋ง๋ค์ด์ ธ ์์ผ๋ฉฐ ๊ฐ๋ฐ์๋ ์ ์ ํ๊ฒ ํ๊ทธ๋ฅผ ๋ฐฐ์นํ๊ณ ์ ๊ณต๋๋ css ํด๋์ค๋ฅผ์ ์ฉํ์ฌ ์น ์ ํ๋ฆฌ์ผ์ด์
Front End๋ฅผ ์์ฝ๊ฒ ๊ฐ๋ฐํ ์ ์์ต๋๋ค.
๊ธฐ๋ณธ UI ์์๋ค๋ง ์ฌ์ฉํด๋ ๋ฉ์ง ์น ์ ํ๋ฆฌ์ผ์ด์
์ ๊ฐ๋ฐํ ์ ์์ผ๋ฉฐ 100% CSS์ jQuery๋ก ๊ตฌ์ฑ๋์ด ์์ด ์์ ์ด๋ ํ์ฅ์ด ์ฉ์ดํฉ๋๋ค. ๋ณธ ๊ฐ์ข๋ ์ต์ ๋ฒ์ ์ธ BootStrap 4๋ฅผ ์ค์ฌ์ผ๋ก ๊ฐ์๋ฅผ ์งํํ๊ณ ์์ผ๋ ํ์ฌ๊น์ง๋ ๋ง์ด ์ฌ์ฉํ๊ณ ์๋ 3๋ฒ์ ๋ ๊ฐ์ด ์ค๋ช
์ ํ๊ณ ์์ต๋๋ค.ํ์ฌ ํ๋ก์ ํธ์ ๋ฐ๋ผ 3๋ฅผ ์ฌ์ฉํ๋ ๊ฒฝ์ฐ๋ ์์ด ๋ ๊ฐ์ง ๋ฒ์ ์ ๋ชจ๋ ์ค๋ช
ํ๊ณ ์์ต๋๋ค.
ํ์ต ๋ชฉํ
- ๋ณธ ๊ฐ์ข๋ฅผ ๋ง์น๋ฉด ๋ฐ๋ก Front End ๊ฐ๋ฐ์ ์์ฝ๊ฒ ํ์ค ์ ์์ต๋๋ค.
- ์ฝ๊ฐ์ ํ๋ก๊ทธ๋๋ฐ ๋ง์ผ๋ก ๋ฉ์ง ์น ์ ํ๋ฆฌ์ผ์ด์
์ ๊ฐ๋ฐํ ์ ์์ต๋๋ค.
๋์์ด ๋๋ ๋ถ๋ค
- ๋ํ์, ์ผ๋ฐ์ธ, ๊ฐ๋ฐ์ ๋ฑ ์น ์ ํ๋ฆฌ์ผ์ด์
Front End ๊ฐ๋ฐ์ ๊ด์ฌ์ด ์๋ ์ฌ๋์ด๋ผ๋ฉด ๋๊ตฌ๋ ๋์์ด ๋ ์ ์์ต๋๋ค.
๋ฐฐ์ฐ๋ ๊ฒ๋ค
Jumbotron
์ง์ ๋ ์์ญ์ ์ฌ๊ฐ์ ์์ญ์ผ๋ก ๋ง๋ค์ด ์ค๋๋ค.
Flex Bootstrap์์ Flex ์์๋ฅผ ์ฌ์ฉํด div ํ๊ทธ์ ๋ํ ๋ฐฐ์น๋ฅผ ๋ค์ํ๊ฒ ์ค์ ํ ์ ์๋ค.
์ฐธ๊ณ ์ฌํญ
- ๋ณธ ๊ฐ์ข๋ Front End ์น ํ๋ ์์ํฌ ๊ฐ์ข๋ก์จ HTML5, CSS3, JavaScript, jQuery ๋ฅผ ํ์์ ์ผ๋ก ํ์ตํด์ผ ํฉ๋๋ค.
- jQuery ์ฝ๋๊ฐ ๋ง์ด ๋์ค๋๊ฑด ์๋์ง๋ง ๊ฐ๋ ์ฌ์ฉํ๋ ๊ณณ์ด ์์ด ๊ธฐ๋ณธ์ ์ธ selector ๋ฌธ๋ฒ ์ ๋๋ ์์์ผ ํฉ๋๋ค.
์ง์๊ณต์ ์ ์๊ฐ
์ค์ฌ์ฑ
๊ตญ๋ด IT ์ด์ฐฝ๊ธฐ ๋ชจ๋ฐ์ผ ์ฝํ
์ธ ๊ฐ๋ฐ ๋ถํฐ ํ์ฌ ์๋๋ก์ด๋,์์ดํฐ ์ฑ๊ฐ๋ฐ ๋ฐ ๋ค์ํ ์ ํ๋ฆฌ์ผ์ด์
์ ๋ํด์ ๊ฐ๋ฐ ๋ฐ ๊ฐ์๋ฅผ ์งํํ๊ณ ์์ต๋๋ค.ํ์ฌ๋ (์ฃผ)์ํํธ์บ ํผ์ค ๊ฐ๋ฐ ์ด์ฌ์ด์ฌ๋ก ์ฌ์งํ๊ณ ์์ต๋๋ค.
๊ฐ๋ฐ ๊ฒฝ๋ ฅ
- SKT "์์ผ๋๋ ์ด๋๋ฒค์ณ" ๋ชจ๋ฐ์ผ ์ฝํ
์ธ ๊ฐ๋ฐ ๋ฐ์นญ
- KT " ํด์ฆ์ฌ์ปค" ๋ชจ๋ฐ์ผ ์ฝํ
์ธ ๊ฐ๋ฐ ๋ฐ์นญ
- SK "๋ชจ๋ฐ์ผ ๊ณต์ธ์ค๊ฐ์ฌ" ๋ฐ์นญ
- ์์ดํฐ "ํ์ํต" ์ฑ๊ฐ๋ฐ
- ์์ดํฐ "ํฌ์ค ํธ๋ ์ด๋" ์ฑ๊ฐ๋ฐ
- KT/SK ๋ฐ์ผ์ฆ ์ค๋ธ ์ฝ๋ชฌ์ฆ ์ฝํ
์ธ ๊ฐ๋ฐ
- KT ๋ฏธ๋ ๊ฒ์(์ผ๊ธ์ผ๊ธ ๋
๋ฐ๋จน๊ธฐ, ์๋ผ๋์ ์์ ๋จํ,๋ฏธ์คํฐ๋ฆฌ ๋ธ๋กํ์ ๋จ,BUZZ and BUZZ)๊ฐ๋ฐ
๊ฐ์ ๊ฒฝ๋ ฅ
์ผ์ฑ๋ฉํฐ์บ ํผ์ค,๋ถ์ฐ์ ๋ณด์ฐ์
์งํฅ์,์ ์ฃผ์ ๋ณด๋ฌธํ์ฐ์
์งํฅ์,์ธ์ฒ์ ๋ณด์ฐ์
์งํฅ์, ํ๊ตญ์ ํ์งํฅ์, SK C&C, T ์์นด๋ฐ๋ฏธ,ํ๊ตญ๋ก๋ด์ฐ์
์งํฅ์,๋์ ETRI,์ผ์ฑ์ ์,nica ๊ต์ก์ผํฐ,ํ๊ตญ์์ฐ์ฑ๋ณธ๋ถ,ํํ S&C๋ฑ ๊ตญ๋ด ์ ๋ช
๊ธฐ์
ํ์ง ์ฌ์์ ๋ฐ ๋ฏธ์ทจ์
์๋ฅผ ๋์์ผ๋ก ๊ฐ์๋ฅผ 18๋
์ฐจ ๊ฐ๋ฐ ๊ณผ ๊ฐ์๋ฅผ ์งํ ํ๊ณ ์์ต๋๋ค.
๊ฐ์ ์ฝํ
์ธ
- Start Google Angular.js (์ต๊ทค๋ฌ) ๊ณผ์
- Bootstrap 4 & 3 Framework Tutorial
- ์ฒ์์์ํ๋ JavaScript Tutorials
- ์ฒ์์์ํ๋ jQuery Programming
- ์ฒ์ ์์ํ๋ CSS & CSS3
- ์ฒ์์์ํ๋ HTML & HTML5 Tutorials
- node.js server Tutorials(Node.js ์๋ฒ ํ๋ก๊ทธ๋๋ฐ ๊ณผ์ )
- ์ฝํ๋ฆฐ ์๋๋ก์ด๋ ๊ธฐ๋ณธ 1๋จ๊ณ(Kotlin for Android: Beginner one step)
- ์ฝํ๋ฆฐ ์๋๋ก์ด๋ ์ฌํ 2๋จ๊ณ (Kotlin for Android: Deepening course)
- ์ฝํ๋ฆฐ ์๋๋ก์ด๋ ๊ณ ๊ธ 3๋จ๊ณ (Kotlin for Android: 3 step final course)
- Oracle SQL Database 11g PL/SQL Developer(์ค๋ผํด ๋ฐ์ดํฐ๋ฒ ์ด์ค 11G)
- ์ฒ์ ์์ํ๋ MySQL DataBase
- ์ฒ์ ์์ํ๋ C Programming
- ์ฒ์์์ํ๋ Google ๊ณต์ ๊ฐ๋ฐ ์ธ์ด Kotlin(์ฝํ๋ฆฐ)
- ์ฒ์์์ํ๋ ํ์ด์ฌ(Python)
๊ฐ์ ๋ถ์ผ ์๋ฐ, ์๋๋ก์ด๋, ํ๋ ์ ์ํฌ, ๋ฐ์ดํฐ๋ฒ ์ด์ค,UML, ์์ดํฐ, ๋น
๋ฐ์ดํฐ ์ฒ๋ฆฌ ๋ฐ ๋ถ์,ํ์ด์ฌ, ์ฌ๋ฌผ์ธํฐ๋ท, R/ํ์ด์ฌ์ ํ์ฉํ ๋ฐ์ดํฐ ๋ถ์,๋ฅ๋ฌ๋,๋จธ์ ๋ฌ๋ AI, ์คํํฌ ๋ถ์ผ ํ๋ถ์ผ์ ๋ํด ๊ฐ์ ๋ค์ํ ๊ฒฝํ์ด ๋
น์ ๋ด์ด ์ต๋ํ ์ฝ๊ฒ ๊ฐ์ ํ์ฌ ์ค์ต์ ์ ์ฉํ๋๋ก ์์ ๋ฅผ ๋ง๋ค๊ณ ์ค๋ช
์ ํ๊ณ ์์ต๋๋ค. ์คํ๋ผ์ธ ์์
์ด ์๋๋ฏ๋ก ๋ชจ๋ฅด๋ ๊ฒ์ ์ง๋ฌธ&๋ต๋ณ์ ์ด์ฉํด์ฃผ์ธ์. ๊ผญ ํด๊ฒฐํด๋๋ฆฌ๊ฒ ์ต๋๋ค.