리액트

[번역] 문 vs 표현식

원문 : https://www.joshwcomeau.com/javascript/statements-vs-expressions/ 몇 년 전 지역 코딩 부트캠프에서 웹 개발을 가르치고 있던 저에게 학생이 저에게 이런 질문을 했습니다. 자바스크립트에서 "문"과 "표현식"의 차이점이 뭔가요?답을 알고 있는 것 같았지만 말로 설명할수는 없었습니다. 감은 있었지만 실제 지식은 놀라울 정도로 모호했습니다. 가르치는 것만큼 겸손한 것은 없습니다 😅. 학생들은 우리가 이해하는 "모호한 부분"을 알아내는 재주가 있습니다. 그 이후로 이 질문이 가장 중요하다는 것을 깨달았습니다. 이것은 수많은 자바스크립트 지식에 도움이 되는 지지기반입니다. 이것은 특히 React 개발자에게 해당됩니다. 기억해야 하고 항상 따라야 하는 것을..

[번역] React에 SOLID 원칙 적용하기

원문 : https://medium.com/dailyjs/applying-solid-principles-in-react-14905d9c5377 소프트웨어 업계가 성장하고 실수를 저지르면서 모범 사례와 우수한 소프트웨어 설계 원칙이 떠오르며 차후에 같은 실수를 반복하지 않도록 개념화합니다. 특히 객체 지향 프로그래밍(OOP)의 세계는 이러한 모범 사례의 노다지이며 SOLID는 의심할 여지 없이 가장 영향력 있는 분야 중 하나입니다. SOLID는 각 문자가 다음과 같은 5가지 디자인 원칙 중 하나를 나타내는 약어입니다. 단일 책임 원칙 (Single responsibility principle, SRP) 개방-폐쇄 원칙 (Open-closed principle, OCP) 리스코프 치환 원칙 (Liskov s..

[번역] Remix: 리액트의 음에 양을

원문 : https://kentcdodds.com/blog/remix-the-yang-to-react-s-yin 저는 2015년부터 React 애플리케이션을 개발해왔습니다. 그 이후로 React 덕분에 개발 생산성이 크게 향상했습니다. 상태를 기반으로 UI를 렌더링하는 React의 선언적 모델은 웹용 UI 구축을 구축하는 방법을 크게 단순화했습니다. 또한 이전에 Angular.js와 Backbone으로 작업했던 것보다 훨씬 앞서서 상태에 대해 생각할 수 있는 좋은 방법을 제공했습니다. React의 슬로건은 다음과 같습니다. 사용자 인터페이스를 만들기 위한 자바스크립트 라이브러리 React는 스스로 개척한 선언형 컴포넌트 모델을 제공함으로써 이를 잘 처리합니다. 상태(콤보박스 메뉴가 열림 또는 닫힘 같은)..

[번역] Remixing React Router

원문 : https://remix.run/blog/remixing-react-router React Router의 첫 번째 버전에는 실제로 willTransitionTo라는 데이터 로드를 지원하기 위한 비동기 훅이 있었습니다. 그 당시에는 React를 어떻게 사용해야 하는지 아무도 몰랐고 우리도 예외는 아니었습니다. 당시의 React Router는 좋다고 말할 수는 없었지만 적어도 올바른 방향으로 가고 있었습니다. 좋든 안 좋든 우리는 React Router v4의 컴포넌트에 전력을 다했고 그 훅을 제거했습니다. withTransitionTo가 사라지고, 컴포넌트가 주요 도구로 사용되면서 오늘날 거의 모든 React Router 앱은 컴포넌트 내부에서 데이터를 페칭합니다. 우리는 컴포넌트 안에서 데이터를..