게으름뱅이의 앞구르기

보호되어 있는 글입니다.

보호되어 있는 글입니다.

컴포넌트 (Arrow Function으로) 컴포넌트를 만들어본다. import React from "react"; const App = (props) => { const { sessionList } = props.store; //비구조화 할당을 해줌 return ( Reacct and TypeScript {sessionList.map((session) => ( {session.title} ))} ); }; export default App; 컴포넌트 분리 지난번에 언급했듯, 코드 작성 시 몇가지 원칙들이 있다. '네이밍은 잘 지어야 한다.'와 같은. 상위에서 성격이 다른 것을 분리한다. 이 때, 언제 쪼갤지, 어떻게 잘게 쪼갤지 고민해야한다. 추후 코드가 비대해지기 전에 아래처럼 컴포넌트를 쪼개도록 해보..

Redux pub-sub model(구독패턴)을 구현한 라이브러리이다. (어떤 객체가 하나 있을 때 이 객체가 변경되면 구독한 함수를 호출해서 변경될 때마다 알려줌) 웹앱 어떠한 데이터를 어떠한 모양으로 어디에 배치하는지가 중요하다, 그 이후는 HTML과 CSS가 다 처리한다. 데이터는 API호출을 통해 비동기적으로 가져온다. 비동기로 가져오다보면 예외상황이 발생할 수 있으므로 각 경우에 따라 대응되는 코드들이 추가된다. 웹앱 개발시 코드를 빠르게 찾고 고칠 수 있는 구조를 연구하여 나온 것 중에 하나가 리액트. "어떤것이 좋은 아키텍쳐인가?" → 결국 같은 것끼리 묶고, 다른 것들은 분리하는 것.(지식의 수준/역량에 따라서 차이가 발생할 수 있음. 데이터의 복잡도에 따라도 달라질 수 있음) → 이름만 ..

강의 목표 도구 다양한 도구가 생산성 향상에 도움을 주는 시대 → 고민의 관점이 달라짐 언어적인 도구 : TypeScript UI Framwork 도구 : React (상태 State) 환경 (Env) 제품 Prod; 목표 (Mission)) 코드 (Quality] 상대적 {E=mc2} 더보기 "미션을 잘 이해하는게 도구를 잘 쓰는 비결" Best Practice 모든 것은 상대적이다. 위의 5가지 키워드를 다 아우르는 키워드. TypeScript playground www.typescriptlang.org/play codeSandbox https://codesandbox.io/index2 Blueprint.js https://blueprintjs.com/ UI toolkit - typescript로 만..