프론트엔드 프레임워크(혹은 라이브러리)를 안쓰면 뭐가 불편하죠?

참고

• 리액트는 프레임워크가 아닌 라이브러리이지만 쉽게 통합해 부르기 위해, 이하 프레임워크로 통합한다

생산성 저하:

프론트엔드 프레임워크는 기본적인 템플릿, 라우팅, 상태 관리 등을 제공하여 개발자들이 보다 쉽게 개발을 진행할 수 있습니다. 프레임워크를 사용하지 않을 경우 이러한 기능들을 직접 구현해야 하므로 생산성이 저하될 수 있습니다.

유지보수의 어려움:

프론트엔드 프레임워크는 일관된 코드 스타일과 구조를 제공하여 코드의 유지보수를 용이하게 합니다. 프레임워크를 사용하지 않을 경우에는 개발자마다 코드 스타일이나 구조가 다를 수 있어서 유지보수가 어려울 수 있습니다.

// 리액트를 사용하지 않은 예제
function App() {
  const button = document.createElement('button');
  button.innerHTML = 'Click me!';
  button.onclick = () => {
    const p = document.createElement('p');
    p.innerHTML = 'Hello, world!';
    document.body.appendChild(p);
  };
  document.body.appendChild(button);
}

// 리액트를 사용한 예제
function App() {
  const [message, setMessage] = useState(null);
  return (
    <div>
      <button onClick={() => setMessage('Hello, world!')}>
        Click me!
      </button>
      {message && <p>{message}</p>}
    </div>
  );
}

크로스 브라우징 문제:

프론트엔드 프레임워크는 다양한 브라우저에서 일관된 동작을 보장합니다. 반면, 프레임워크를 사용하지 않을 경우에는 각 브라우저에서 다른 동작을 보이는 크로스 브라우징 문제가 발생할 수 있습니다.

커뮤니티의 부재:

프론트엔드 프레임워크는 대개 활발한 개발자 커뮤니티를 가지고 있어서 문제 해결이나 기능 추가 등에 대한 지원을 받을 수 있습니다. 하지만, 프레임워크를 사용하지 않을 경우 이러한 지원을 받을 수 없으므로 문제 해결이나 기능 추가 등에 대한 어려움이 있을 수 있습니다.

보안 취약성:

프론트엔드 프레임워크는 대개 보안 취약성에 대한 대응책이 마련되어 있습니다. 프레임워크를 사용하지 않을 경우 개발자가 직접 보안 취약성 대응책을 마련해야 하므로 보안 문제가 발생할 가능성이 높아집니다.