2. 우당탕탕 개발자/2-1. 공부기록92 09Mar2020 TIL Why Redux? 지난 주에 순수 react를 가지고 MAC의 미리 알림 애플리케이션을 따라해볼 기회가 있었다. 검색창과 오늘/예정, 리스트 추가/보기, 각 카테고리에 따른 완료/진행중인 계획을 볼 수 있는 앱이였다. 기본적인 과제로는 검색창, 리스트추가/보기, 각각 리스트에 따른 계획을 완료/비완료로 나누는 것이었지만, 나는 최신 기능도 함께 구현하고 싶어 욕심을 내었다. 결과적으론 실패했다. 리스트나 카테고리(오늘/예정)에 들어가서 완료/진행중을 조작하면, 갑자기 선택한 리스트와 관련없는 전체 계획이 나타나는 식으로 스테이트 관리가 어려워 실패로 끝났다. state가 위에서 아래로 흐르는 일방적인 리액트을 가지고, 내가 구현하고자 하는 한 페이지 어플리케이션 하려니, 나중엔 내 논리에 꼬여 stat.. 2020. 3. 9. 24Feb2020 TIL process.env[key] 환경변수 env는 environment 의 약자 였나보다. 지난 스프린트에 스쳐 지나가는 줄로 있었던 process.env의 의미를 오늘 오피스 아워 시간에 알게 되어 잊지 않기 위해 블로깅을 한다. (지난 블로그들을 자주 봐야 복습을 할텐데^^ 기록만 열심히 하는 편. 언젠가 보겠지) 우선 process란 ? The process object is a global that provides information about, and control over, the current Node.js process. As a global, it is always available to Node.js applications without using require(). (출처 : node.. 2020. 2. 25. 23Feb2020 TIL Where to Fetch Data: DATA를 서버로 부터 언제 불러와서 client 에 display 를 해줄 것인지는 리액트를 통해 직접 과제를 구현하기 전까지 아리쏭 달쏭 했던 것 중 하나다. 결론적으로 completeDidMount()에서 fetch data를 하는 것이 가장 좋다. (참고자료 : 여기) render는 data를 fetch 하는 곳이 절대 아니다. JSX의 요소들이 화면에 그려질 수 있도록 하는 공간이며, 약간의 데이터들이 디스플레이 되기 위한 약간의 조건들이 쓰여질 수 있는 곳이다. componentWillMount()도 데이터를 불러오기에 적합한 장소는 아니다. 만약 해당 함수(매소드?)에 데이터를 불러올 경우, 자바스크립트의 비동기적 특성으로 인하여 데이터를 미쳐 불러오기도.. 2020. 2. 23. 18Feb2020 TIL 하나의 component 는 한가지 기능만 수행하는 것이 좋다. e.g.) setState() 되는 것 따로 / fetch 되는 것 따로! componentDidMount()는 한 번만 실행된다. this.state는 rendering 될 때 그려지는 요소 저장으로 쓰는 것이 좋다. e.g.) 동영상 리스트, 현재 재생 동영상 등 ref : render 메서드에서 생성된 DOM 노드나 React 엘리먼트에 접근하는 방법을 제공 Dom 안에서 document.queryselector() 나 에 직접 접근하여 값을 가져오거나 값을 변경하거나 기타 등등의 이유로 사용할 때, class Search extends React.Component { constructor(props) { super(props); th.. 2020. 2. 19. 16Feb2020 TIL React : 상호작용이 많은 UI 를 만들 때 사용하는 자바스크립트 기반의 라이브러리 React 특징 Component 기반 JSX Virtual DOM Prop State Component : Components are independent and reusable bits of code. They serve the same purpose as JavaScript functions, but work in isolation and returns HTML via a render function. Components come in two types, Class components and Function components. (출처 : W3school) JSX JSX stands for JavaScript X.. 2020. 2. 17. 11Feb2020 TIL REST API (웹서버를 만드는데 사용되는 제약 모음) : Rest APIs use URIs (Uniform Resource Identifiers) to adderess resources. {} }; 방법 1. let code = app.status.code let get = app.get 방법 2. let {get, status : {code}} = app 다음에 찾아봐야할 것 async 과 await / try catch process.env : 시스템의 환경 변수. 즉, 서비스의 중요한 키를 저장하는 공간. 2020. 2. 12. 이전 1 ··· 6 7 8 9 10 11 12 ··· 16 다음
