본문 바로가기

전체 글

(215)
프론트엔드에서 상태란? 웹 프론트엔드에서 핵심적으로 논의되는 주제인 상태는 무엇이며 왜 관리해야하는 대상인지 그리고 관리하는 방법에는 어떤 것들이 있는지 알아봅니다. 프로그래밍에서 상태란? 프로그래밍에서 상태에 대해 이야기해보기 전에 저의 현재 상태에 대해 이야기해보겠습니다. 저는 현재 의자에 앉아서 책상에 올려져있는 뜨거운 커피를 마시고 있습니다. 현재 저의 상태는 앉아 있다는 것이고 커피의 상태는 뜨거운 상태입니다. 몇시간이 지났습니다. 저는 운동을 하러 나갔고 책상에 있던 커피는 식었습니다. 이제 제 상태는 운동 중인 상태이고 책상에 있던 커피는 차가워진 상태입니다. 이것이 현실 세계에서의 상태입니다. 현실 세계에서의 상태와 비슷하게 프로그래밍에서의 상태는 데이터로 표현합니다. 컴퓨터 프로그램에서 상태란 시간이 지남에 따..
Leetcode 91. Decode ways function numDecodings(s) { if (s.length === 0) return 0; const N = s.length; const dp = Array(N+1).fill(0); dp[0] = 1; dp[1] = s[0] === '0' ? 0 : 1; for (let i = 2; i
HCI 논문 리뷰 모음 - Network effects on physical activity through interpersonal vs. masspersonal communication with the core and acquaintance networks Network effects on physical activity through interpersonal vs. mass-personal communication with the core and acquaintance networ Review 결국 사회적인 요인들이 인간의 신체적 활동에 영향을 미친다. 지인들과 커뮤니케이션 하는 것이 신체 활동에 영향을 미친다. 사회적 제어는 네트워크의 멤버가 긍정적인 건강 행동을 충 www.evernote.com - AI 대화형 에이전트..
Leetcode 45. Jump Game II a처음에는 재귀를 이용한 완전 탐색으로 접근했다. /** * @param {number[]} nums * @return {number} */ const jump = function(nums) { const endIndex = nums.length - 1 let ans = Infinity function travel(position, count) { if (position > endIndex) { return } if (position === endIndex) { ans = Math.min(ans, count) return } const jumpRange = nums[position] for (let i = 1; i = nums.length - 1) return 0 if (memo[idx]) return ..
Learning React | 4장 ~ 5장 리액트 작동 원리 리액트를 브라우저에서 다루려면 React와 ReactDOM 라이브러리를 불러와야 한다. React는 뷰를 위한 라이브러리고 ReactDOM은 UI를 실제로 브라우저에 렌더링할 때 사용하는 라이브러리이다. 리액트 엘리먼트 HTML을 브라우저가 문서 객체 모델(Document Object Model)인 DOM을 구성하기 위해 따라야 하는 절차라고 간단히 말할 수 있다. HTML 문서를 이루는 엘리먼트는 브라우저가 HTML 문서를 읽어들이면 DOM 엘리먼트가 되고, 이 DOM이 사용자 인터페이스를 화면에 표시한다. 전통적으로 웹사이트는 독립적인 HTML 페이지들로 만들어졌다. 사용자가 페이지 사이를 내비게이션 함에 따라 브라우저는 매번 다른 HTML 문서를 로딩할 수 있었다. AJAX(Asy..
가장 빨리 만나는 스벨트 | 11장 ~ 끝 스토어 사용하기 스토어는 스벨트 애플리케이션에 속한 컴포넌트끼리 데이터를 자유롭게 공유하는 방법중 하나입니다. 스벨트로 작성한 애플리케이션에 포함된 각각의 컴포넌트들은 subscribe 함수를 사용하여 애플리케이션 전체에 공유된 스토어 데이터의 변화를 감지할 수 있습니다. 따라서 이 subscribe 함수에서 추가적인 동작을 정의한다면 데이터 공유뿐 아니라 애플리케이션 전체가 일관성을 가지고 움직이게 할 수 있습니다. 리덕스의 스토어처럼 구독 해놓고 그 값이 변경되면 사용하고 있는 컴포넌트에서 자동으로 업데이트한다. 스토어 때문에 스벨트에서 변수명 사용시 주의해야할 것이 있습니다. $스토어명 형태의 사용이 예약되어 있기 때문에 일반 변수명을 $로 시작하여 사용하면 안됩니다. 스벨트 스토어는 writabl..
2022년 돌아보기 딱 일년 전이 기억이난다. 21년 12월 25일 크리스마스때 코딩을 했던게 뭔가 스냅샷처럼 머리에 찍혀있다. 1년이 지난 지금 너무 많은게 바뀌었다. 2022년은 지금까지의 내 인생에서 가장 기억에 남는 년도이다. 시간이 지나면 다 까먹으니까 꼭 기억에 남기고 싶은 2022년은 어떠했는가 돌아보자. 1~3월 커밋들을 보니 React, TypeScript, 알고리즘 커밋이 대부분이었다. 이 때는 React가 익숙하지 않았다. 지금 생각해보면 React를 전혀 이해하지 못하고 그냥 클론 코딩을 하며 어떻게 하는지에 대해 감을 익혔던 것 같다. TypeScript도 뭐.. 그냥 책을 읽으면서 배우고 있었다. 다음으로 알고리즘!. 내가 백준 커밋을 보니 21년 11월에 알고리즘을 시작했고 그 때 매일 한문제씩 ..
Isomorphic JavaScript: The Future of Web Apps https://medium.com/airbnb-engineering/isomorphic-javascript-the-future-of-web-apps-10882b7a2ebc#.4nyzv6jea Airbnb에서는 지난 몇 년 동안 풍부한 웹 경험을 구축하면서 많은 것을 배웠습니다. 우리는 2011년에 모바일 웹 사이트를 통해 앱 세계에 뛰어들었고 그 이후로 Wish Lists와 함께 재설계된 검색 페이지를 출시했습니다. 이들 각각은 대규모 JavaScript 앱입니다. 즉, 보다 현대적인 대화형 경험을 지원하기 위해 대부분의 코드가 브라우저에서 실행됩니다. 이 접근 방식은 오늘날 일반적이며 Backbone.js, Ember.js및 Angular.js와 같은 라이브러리를 통해 개발자는 이러한 풍부한 JavaS..