B는 부트스트랩을 위한 것입니다.

오픈소스 소프트웨어의 역사와 영향력에 대해 한 글자씩 자세히 알아보는 OSS의 ABC에 다시 오신 것을 환영합니다. 저는 호스트인 Taylor입니다. 오늘은 부트스트랩을 위한 B입니다.

‍

부트스트랩의 탄생

트위터가 부트스트랩을 세상에 내놓은 2011년으로 거슬러 올라가 보겠습니다. 당시에는 반응이 빠른 멋진 웹사이트를 구축하는 것이 매우 어려운 일이었습니다. 사이트가 여러 디바이스에서 작동하도록 하려면 모든 프로젝트에 대해 한 줄 한 줄 CSS를 수작업으로 만들어야 했습니다.

부트스트랩은 하룻밤 사이에 모든 것을 바꿨습니다.

‍

부트스트랩이 혁신적인 이유

부트스트랩은 개발자에게 획기적인 두 가지 도구를 제공했습니다:

1. 강력한 그리드 시스템 - 마침내 레이아웃을 화면 크기에 맞게 행과 열로 분할할 수 있게 되었습니다.
   
2. 탐색 모음, 버튼, 모달, 양식, 드롭다운 등 사전 스타일이 지정된 구성 요소를 HTML 몇 줄만 입력하면 바로 사용할 수 있습니다.
   

개발자는 모든 프로젝트에서 처음부터 다시 시작할 필요 없이 부트스트랩을 사용하면 몇 주가 아니라 몇 시간 만에 반응성이 뛰어난 전문가 수준의 사이트를 만들 수 있습니다.

이 시기는 모바일 우선 디자인이 표준으로 떠오르던 시기였습니다. 부트스트랩은 모바일 접근성을 CSS 전문가뿐만 아니라 모든 개발자가 달성할 수 있는 것으로 만들었습니다.

‍

컴포넌트 혁명

부트스트랩은 단순히 시간을 절약하는 데 그치지 않고 UI 개발에 대한 사고방식을 바꿔놓았습니다. 부트스트랩의 컴포넌트 시스템은 오늘날의 디자인 시스템과 최신 컴포넌트 라이브러리의 선구자였습니다.

카드와 알림부터 도구 설명과 표에 이르기까지 부트스트랩은 일반적인 요소의 모양과 작동 방식을 표준화했습니다. 웹 전체에 일관성을 부여한 것은 전례가 없는 일이었습니다.

현재 테일윈드, 머티리얼 UI 또는 커스텀 디자인 시스템에서 작업하고 있더라도 부트스트랩이 대중화시킨 패턴을 사용하고 있을 가능성이 높습니다.

‍

단점: 부트스트랩 피로

물론 부트스트랩이 완벽했던 것은 아닙니다. 특히 디자이너들은 모두가 동일한 기본 스타일을 사용하여 모든 사이트가 거의 동일하게 보이던 '부트스트랩 피로감'의 시대를 기억합니다.

그리고 Flexbox 및 CSS Grid와 같은 최신 CSS 기능으로 인해 부트스트랩의 일부 레이아웃 유틸리티는 예전만큼 필수적이지 않습니다. 그럼에도 불구하고 그 영향력은 부인할 수 없습니다.

‍

부트스트랩의 지속적인 영향력

부트스트랩은 디자인 시스템이 단순히 외형만 중요한 것이 아니라 효율성, 일관성, 생산성이 중요하다는 것을 업계에 알려주었습니다. 개발자들은 끝없는 브라우저 버그, 레이아웃 해킹, 드롭다운 메뉴가 Chrome에서와 동일한 방식으로 작동하도록 하기 위해 시간을 낭비하는 일을 피할 수 있었습니다.

그 유산은 분명합니다:

• 이제 그리드 기반 레이아웃이 표준이 되었습니다.
  
• 재사용 가능한 컴포넌트는 React 및 Vue와 같은 프레임워크의 기초입니다.
  
• 디자인 시스템은 소프트웨어 개발의 표준 관행이 되었습니다.
  

부트스트랩은 더 이상 가장 인기 있는 도구는 아니지만, 최신 프론트엔드 개발의 모든 곳에 부트스트랩의 DNA가 깃들어 있습니다.

‍

마무리

웹을 반응성 있고 일관성 있으며 조금 더 예쁘게 만든 프레임워크인 부트스트랩은 여기까지입니다.

다음 시간에는 규정 준수를 위한 C로 이동하여 SOC 2, GDPR, 그리고 엔지니어와 법무팀을 긴장하게 만드는 모든 규제 과제에 대해 알아보겠습니다.

그때까지 코드를 깔끔하게 유지하고 종속성을 업데이트하세요.