인프런 영문 브랜드 로고
인프런 영문 브랜드 로고
개발 · 프로그래밍

/

프론트엔드

[웹 개발 풀스택 코스] 부트스트랩 기초

본 강의는 풀스택 웹 개발자 양성을 위한 [웹 개발 풀스택 코스] 강의 시리즈의 부트스트랩 기초에 대한 강의입니다. 부트스트랩에 대한 기초를 배우고 고품질의 반응형 웹을 빠르게 구축할 수 있는 방법을 알게 됩니다.

(5.0) 수강평 23개

수강생 1,432명

Thumbnail

초급자를 위해 준비한
[프론트엔드, 웹 개발] 강의입니다.

이런 걸
배워요!

  • 부트스트랩 디자인

  • 반응형 웹

  • 그리드 시스템

부트스트랩으로 멋진 웹을 뚝딱! 
반응형 웹사이트 빠르게 빌드하기 ✨

✅ 이 강의는 [풀스택 웹 개발자 로드맵] 시리즈 강의입니다.

  • 본 강의는 풀스택 웹 개발자 양성을 위한 [웹 개발 풀스택 코스] 강의 시리즈 중 부트스트랩 기초를 다루는 강의입니다.
  • 웹 개발 풀스택 코스는 HTML&CSS → 바닐라 자바스크립트 → 부트스트랩 → Vue.js → 데이터베이스 → Node.js → 포트폴리오까지 풀스택 웹 개발을 위한 전 과정을 포함하고 있습니다.
  • 웹 개발 풀스택 코스를 모두 수강하면 여러분은 웹 개발에 대한 기초 뿐만 아니라 실무에 바로 적용할 수 있는 기술을 익히게 됩니다.
  • 본 강의를 수강하기 전 [웹 개발 풀스택 코스] HTML&CSS → [웹 개발 풀스택 코스] 바닐라 자바스크립트 강의를 차례로 수강하는 것을 추천합니다.

What is Bootstrap?

Bootstrap logo.svg - Wikimedia Commons

반응형 웹을 하나의 코드로 빠르게 만들 수 있게 도와주는 HTML/CSS/JS 프레임워크입니다.

부트스트랩은 반응형 웹을 빠르게 만들 수 있게 도와주는 HTML, CSS, JS 프레임워크입니다. 하나의 코드로 스마트폰, 태블릿, 데스크탑과 같은 다양한 크기의 기기에 최적화된 웹을 만들 수 있으며, 미리 만들어진 컴포넌트를 기반으로 쉽게 웹을 구현할 수 있도록 합니다.


부트스트랩, 왜 배워야 할까요? 


 빠른 개발, 일관성, 호환성... 효율적으로 웹 페이지를 만들고 싶다면!

빠른 개발

부트스트랩은 반응형 및 모바일 First 웹사이트를 빠르게 구축하는 데 도움이 되는 프론트엔드 프레임워크입니다. 기본 제공되는 CSS 스타일, 컴포넌트 및 자바스크립트 플러그인을 사용하여 웹사이트를 개발하기 위한 시간과 노력을 절약할 수 있습니다.

일관성과 호환성

부트스트랩은 반응형 그리드 시스템을 제공하여 다양한 화면 크기에 최적화된 웹사이트를 쉽게 만들 수 있습니다. 이를 통해 모바일, 태블릿 및 데스크탑에서 웹사이트가 사용자에게 올바르게 제공되는 것을 보장할 수 있습니다.

커뮤니티 지원

부트스트랩은 개발자 커뮤니티와 잘 정리된 문서를 갖추고 있어서 도움이 필요한 경우 쉽게 찾을 수 있습니다. 또한 다양한 플러그인, 테마 및 예제가 제공되어 웹사이트를 더욱 풍부하게 만들 수 있습니다.

유지 관리

부트스트랩은 일관된 스타일 가이드를 제공하기 때문에 코드를 효과적으로 유지 관리할 수 있습니다.


이 강의의 특징!

쉽고 자세하게
실무 응용 중심
예제 코드까지!
  • 부트스트랩의 기본 문법 및 사용법을 차근차근 알려드려요.
  • 웹 개발 프로젝트에 필요한 부트스트랩을 적용해 봅니다.
  • 모든 예제 코드는 깃허브를 통해 제공됩니다.

무엇을 배우나요?

VSCode
BootStrap
  • 개발 IDE 툴로는 비주얼스튜디오코드(Visual Studio Code)를 사용합니다. 비주얼스튜디오코드를 이용한 개발 방법 및 유용한 확장 프로그램을 알게 됩니다.
  • 부트스트랩 Layout, Contents, Forms, Components, Helpers, Utilities, Extend에 대해서 알게 됩니다.
  • 부트스트랩을 CRUD 화면에 적용해 봅니다.
  • 부트스트랩 테마 시장을 이해하고 테마를 사용해서 웹을 빠르게 만들 수 있는 방법을 알려드립니다.

부트스트랩으로 생성 화면 만들기

부트스트랩으로 수정 화면 만들기

선수 지식을 확인하세요!

  • HTML에 대한 기본 지식이 있어야 해요.
  • CSS를 알아야 해요. 
  • 자바스크립트를 알아야 해요
  • 본 강의를 수강하기 전에 [웹 개발 풀스택 코스] HTML&CSS → [웹 개발 풀스택 코스] 바닐라 자바스크립트 강의를 수강하는 것을 추천합니다.

이 강의를 만든 사람은
누구일까요?

개발자의 품격

소프트웨어 기술을 통해 세상에 선한 영향력을 주고 싶은 24년차 소프트웨어 개발자.
지식을 나누는 것을 좋아하고, 항상 새로운 기술을 익히는 것을 즐겨요.

국내외 60개가 넘는 글로벌 기업 ERP 시스템을 구축하는 컨설턴트 및 개발자로 활동하였고, 직접 개발한 소프트웨어를 국내는 물론 해외 유수의 기업에 판매를 한 경험 또한 가지고 있어요. IT 스타트업 대표이사이기도 해요.

개발자뿐만 아니라 UX 컨설턴트로, 때로는 비즈니스 컨설턴트로 일하면서 애플리케이션과 서비스 개발 시 기획에서 개발까지 전 과정에 대한 수많은 경험을 쌓았습니다. 이제는 20년이 넘는 실무 경험을 바탕으로 후배들에게 정말 필요한 기술, 정말 제대로 된 지식을 전달하는 사명감을 갖고 지식을 나누는 일을 하고 있어요.

더 알아볼까요?

[웹 개발 풀스택 코스] 시리즈 모아보기

이런 분들께
추천드려요!

학습 대상은
누구일까요?

  • 부트스트랩을 사용해서 반응형 웹을 만들고 싶은 사람

  • 디자인 시스템을 경험해 보고 싶은 사람

선수 지식,
필요할까요?

  • HTML

  • CSS

  • 자바스크립트

안녕하세요
개발자의 품격입니다.

수강생 수

9,887

수강평 수

203

강의 평점

4.9

강의 수

8

소프트웨어 기술을 통해 세상에 선한 영향력을 주고 싶은 24년차 소프트웨어 개발자.
지식을 나누는 것을 좋아하고 항상 새로운 기술을 익히는 것을 즐겨요.

국내외 60개가 넘는 글로벌 기업 ERP 시스템을 구축하는 컨설턴트 및 개발자로 활동하였고, 직접 개발한 소프트웨어를 국내는 물론 해외 유수의 기업에 판매를 한 경험 또한 가지고 있어요. IT스타트업 대표이사 이기도 해요.

개발자 뿐만 아니라, UX 컨설턴트로, 때로는 비즈니스 컨설턴트로 일하면서 애플리케이션과 서비스 개발 시 기획에서 개발까지 전과정에 대한 수많은 경험을 쌓았고, 이제는 20년이 넘는 실무 경험을 바탕으로 후배들에게 정말 필요한 기술, 정말 제대로 된 지식을 전달하는 사명감을 갖고 지식 나눔에 일을 하고 있어요.

 

  • (현)주식회사 더그레잇 대표이사
  • (현)주식회사 썬슈어 CTO
  • (현)주식회사 리턴밸류 CTO
  • (현)팬임팩트코리아 유한회사 기술전문위원

 

이메일 - seungwon.go@gmail.com

커리큘럼

전체

13개 ∙ (4시간 52분)

강의 게시일: 
마지막 업데이트일: 

수강평

아직 충분한 평가를 받지 못한 강의입니다.
모두에게 도움이 되는 수강평의 주인공이 되어주세요!