본문 바로가기

전체 글

(306)
[JS] How Promise works 이 자료는 아래의 블로그에서 가져온 정보입니다. https://lydiahallie.framer.website/blog/promise-execution Promise의 Process a new promis object is created in memory. the promis object contains some internal slots( [[PromiseState]], [[PrmiseResult]], [[PromiseFulfillReactions]], [[PromiseRejectReactions]], [[PromiseIsHandled]] [[PromiseFulfillReactions]], [[PromiseRejectReactions]] These fields contain something calle..
[ React/ 원리 ] Basic, DOM by declarative DOM(선언적 DOM) 목차1. 명령적 코드 vs 선언적 코드2. 어떻게 React는 버추얼 돔으로 HTML을 그리는가2-1. POJO code2-2. Component2-3. Props2-4. JSX2-5. FRAGMENT & HTML AUTHORING2-6. FIBER AND RECONCILIATION HTML TREEchildren that is one object knows where another object is located in memory we represent that visually some arrows.  The Document Object Model(DOM)a collection of objects in the comuputer's memory that represent the HTML elements ..
[article/AI]Where is the A.I heading? Of course, there is the argument that new technology improves our standard of living in the long term, which makes up for the unemployment that it creates in the short term. This argument carried weight for much of the post-Industrial Revolution period, but it has lost its force in the past half century. In the United States, per-capita G.D.P. has almost doubled since 1980, while the median hous..
[Javascript/Json] Json 데이터를 만들기 위한 크롤링 최근에 누군가가 콘솔에 스크립트를 써, 정보를 추출하는 것을 보고 나도 따라해 봤다. json 데이터 만들려고 코드 작성(ai+코드 좀 수정)유용하다. 이렇게 간단한 데이터를 추출해 봤다. // Select all product tiles var productTiles = document.querySelectorAll('.product-tile'); // Iterate over each product tile productTiles.forEach(function(tile) { // Get the title var title = tile.querySelector('.tile-body .pdp-link').textContent; // Get the image URL var imageUrl = tile.que..
[Js/format ] 날짜, 통화 데이터 등의 정보를 변환해주는 함수 통화(ts)const CURRENCY_FORMATTER = new Intl.NumberFormat(undefined, { currency : "ko", style:"currency",})export const formatCurrency = (number : number) =>{ return CURRENCY_FORMATTER.format(number)} 출처 : 직접 날짜예를 들어, 현재 날짜를 한국 사용자들을 위한 형식으로 변환하고 싶다면 DateTimeFormat() 생성자로 포맷터를 생성한 객체의 format() 함수를 호출하면 됩니다.> const koDtf = new Intl.DateTimeFormat("ko", { dateStyle: "long" });undefined> koDtf.format(..
[Video/AI] 실리콘벨리 한기용 선생님의 실패 이야기 최근에 AI 글을 일고 2차 wave대한 고민을 하게 됐다. 이상하게 다른 곳에서(?) 나름의 좋은 해안을 얻었다. '내 직업만 위험한게 아니다. 모든 직업이 위험하다. 고로 지금이 가장 좋은 타임아닌가? 내가 원하는 것을 하기에'
[article/AI] 2번째 AI 물결은 비루틴적(non-routine)인 것들이 목표가 된다. 글의 내용은 현재 1의 물결은 이미 우리 삶에 많은 부분을 대체하고 있다고 하고 있다. 특히 루틴적이 일(a job)들이 대체되고 있다고 했다. 다만 2번째 물결은 비루틴적인 일들이 대체될 것이라고 했다. 예를들어, DB 설계, 글쓰기는 일, 그래픽 디자인 등 고소득일도 점점 AI에 대체될 것으로 예상했다. the second wave of AI adoption could impact non-routine tasks involving the creation of databases, copywriting and graphic design, However, the second wave of AI adoption could impact non-routine tasks involving the creation ..
[동기/비동기]async + await async + await는 필수관계 이다. 하나가 없으면 다른 하나가 작동하지 않는다. 다른 작업을 하다보면 다른 부분을 까먹기도 한다. 특히 await 부분을 잃어버리는 경우가 있다. 그게 나아게 일어났고 몇시간을 낑낑거리다. 다른 지인이 이부분을 찾아줬다.  나는 계속에서 데이터가 지연으로 인해서 못 잡는 것으로 착각하여 ? 넣던지, 데이터가 들어올때까지 기달렸다. Promise : pending사실 그게 문제가 아니였다. 데이터는 정상적으로 들어갔다. 다만 대기중인 것이다.status에 "200"값이 떠있는 것을 확인 할 수 있다. pending의 사전적 의미형용사 1) 미결[미정]인, 계류 중인, 2) 곧 있을, 임박한 await내가 코드에서 await 를 쓰지 않은 것.  이걸로 인하여 다시 p..
[npm/redux] redux 잘 못 깔아서 안된다고 징징 npm install을 잘못해서 list 확인 후 다시 설치 (전 / 후) 비교 npm list redux 최초 잘못 설치했을 때, 잘 설치했을 때, 차이가 발생한 지점 npm install redux npm install react-redux
[Book] '제정신이라는 착각' 제정신이 아니라고? 무슨 뜻이지? '제정신이 아니다'라고 말한다. 이런 사람은 머릿속에서 말도 안 되는 망상을 지어낸다. 말도 안 되는 생각을 믿거나 황당한 이야기를 확신한다. 따라서 '제정신이 아닌' 사람들은 우리 눈에는 사실이 아니거나 터무니없게 생각되는 것을 사실이라고 굳게 확신한다. 이런 확신은 그의 말과 행동에서 표시가 난다. 뭔가를 확신하면 보통 그 확신에 의거해 행동하기 때문이다. 요컨대 우리는 우리가 보기에 현실과 전혀 맞지 않는 확신을 가지고 있는 사람, 그리고 그에 따라 행동하는 사람을 제정신이 아니라고 말 하는 것이다. 나는 여기서 의식적으로 확신이라는 용어를 사용한다. 독일어 사전 《두덴 Duden》에 따르면 확신은 "확고하고 흔들리지 않는 (…) 의견 혹은 확고한 믿음"을 말한다...
[grid/flexbox] justify-items and align-items 차이란? gird axis 축의 main 중심이냐 아니면 block 중심이냐 차이 justify-items: CSS 그리드의 justify-items 속성은 그리드 셀 내의 인라인(main) 축을 따라 그리드 항목을 정렬하는 데 사용됩니다. 이 속성은 행 축을 따라 그리드 컨테이너 내부의 모든 그리드 항목의 정렬에 영향을 줍니다. The justify-items property in CSS Grid is used to align grid items along the inline (main) axis within their grid cells. It affects the alignment of all the grid items inside the grid container along the row axis. ali..
[react] onChange 와 onClick React Calendar library 쓰다가 onChange event handler 가 자동으로 props 를 전달한다는 것을 알게 되어서 onClick 도 자동으로 넘기나요? 물어보니까 그렇다고 함. @_@ 출처 : ChatGPT In React, both onChange and onClick event handlers automatically receive event objects as their first arguments, but they behave differently in terms of passing additional arguments. 둘의 차이는 뭘까? onChange: 입력 필드나 선택 요소와 같은 폼 엘리먼트에 onChange를 사용하면 React는 자동으로 이벤트 핸들러에 ..