Don’t Stop the Data Flow in Optimizations

Writing Resilient Components

사람들이 React를 배우기 시작하면 종종 스타일 가이드를 요청합니다. 프로젝트 전체에 일관된 규칙을 적용하는 것은 좋은 생각이지만, 많은 프로젝트가 임의 적입니다. 따라서 React는 그들에 대해 강한 의견을 가지고 있지 않습니다.

다른 유형의 시스템을 사용하거나, 함수 선언 또는 화살표 함수를 선호하거나, 알파벳 순으로 또는 찾기 쉬운 순으로 props를 정렬할 수도 있습니다.

이러한 유연성 덕분에 React를 기존의 약속과 프로젝트와 통합 할 수 있습니다. 그러나 그것은 또한 끝없는 논쟁을 불러 일으킵니다.

모든 컴포넌트가 따르도록 노력해야 하는 중요한 디자인 원칙이 있습니다. 그러나 스타일 가이드가 그 원칙을 잘 포착한다고 생각하지 않습니다. 우리는 먼저 스타일 가이드에 대해 이야기 할 것입니다. 그런 다음 실제로 유용한 원칙을 살펴보세요.

상상 속의 문제로 산만해 지지 마라

컴포넌트의 디자인 원칙에 대해 이야기 하기 전에 스타일 가이드에 대해 몇 마디 말하고 싶습니다. 이것이 대중적인 의견은 아니지만 누군가는 그것을 말할 필요가 있습니다!

Javascript 커뮤니티에는 lint에 의해 시행되는 몇 가지 엄격한 스타일 가이드가 있습니다. 내 개인적인 관찰은 그들이 가치 있는 것보다 더 많은 마찰을 일으키는 경향이 있다는 것입니다. 이것에 대한 세가지 문제를 이야기 합니다.

• lint가 과장된 시끄러운 문지기가 되었다.
• 사람들이 특정 패턴의 유효 사용과 유효하지 않은 사용을 구분하는 법을 못 배웁니다. componentDidMount 내에서 setState를 호출하는 것을 금지하는 규칙이 있는데 DOM을 이용하기 위해 필요한데 사람들이 그걸 피하려고 setTimeout을 사용합니다. 그리고 만약 그것이 나쁘다면 React에서 막았을 겁니다.
• 의미있는 차이가 아닌 부분에 반발합니다. "당신은 함수 선언을 사용하고 있지만 우리와 가자! 화살표 함수를 사용하자"

제가 linting을 멈춰야 한다고 말하는 것이 아닙니다.

좋은 설정으로 lint는 버그가 발생하기 전에 잡는 훌륭한 도구입니다. 그것은 너무 많은 스타일에 집중하여 주의를 분산 시킵니다.