본문 바로가기

전체 글86

리코일, Selectors atoms, selectors를 입력으로 받아들이는 순수 함수다. 상위 atoms, selectors가 업데이트되면 하위의 selector 함수도 다시 실행된다. 컴포넌트들은 selectors를 atoms처럼 구독할 수 있으며 selectors가 변경되면 컴포넌트들도 다시 렌더링된다. const fontSizeLabelState = selector({ key: 'fontSizeLabelState', get: ({get}) => { const fontSize = get(fontSizeState); // atom에 의존성이 생김 const unit = 'px'; return `${fontSize}${unit}`; }, }); get속성은 계산될 함수다. 전달되는 get 인자를 통해 atoms와 다른 sele.. 2023. 3. 30.
리코일, Atoms Atoms Atoms는 상태의 단위이며, 업데이트와 구독이 가능. atom이 업데이트되면 각각의 구독된 컴포넌트는 새로운 값을 반영해 재렌더링된다. atoms는 런타임에서 생성될 수도 있다. Atoms는 리액트의 로컬 컴포넌트의 상태 대신 사용할 수 있다. 동일한 atom이 여러 컴포넌트에서 사용되는 경우 모든 컴포넌트는 상태를 공유한다. const fontSizeState = atom({ key: 'fontSizeState', default: 14, }) Atoms는 디버깅, 지속성 및 모든 atoms의 map을 볼 수 있는 특정 고급 API에 사용되는 고유한 키가 필요하다. 두개의 atom이 같은 키를 갖는 것은 오류이기 때문에 키 값은 전역적으로 고유하도록 해야한다. 리액트 컴포넌트의 상태처럼 기본.. 2023. 3. 30.
리액트 드래그앤드랍 구현기 react-beautiful-dnd를 사용하여 구현하였다. 작업 메모 🏷 드래그 영역 변경하기 {...provided.dragHandleProps}ㅍ 를 드래그 적용 시키고 싶은 엘리먼트에 넣어준다. {(provided) => ( DRAG AREA HERE item )} 더보기 실패작 `{/* {dragDropList.map((item, idx) => ( ))} */}` ``` ``` import { View, Text } from '@pip/theme'; ``` import React from 'react'; import styled from 'styled-components'; import type { Identifier, XYCoord } from 'dnd-core'; import { ReactCo.. 2022. 9. 20.
WEB3 :: 메인넷 vs 테스트넷 메인넷 출처 입력 메인넷은 블록체인 프로토콜이 완전히 개발, 배포되는 시기를 설명하는데 사용되는 용어. 암호화폐 거래가 블록체인에 브로드캐스트, 검증 및 기록되고 있음을 의미합니다. 테스트넷 출처 입력 메인넷 네트워크와 달리 테스트넷이라는 용어는 블록체인 프로토콜이나 네트워크가 아직 가동되지 않고 최대 용량으로 실행되지 않을 때를 나타낸다. 테스트넷은 프로그래머와 개발자가 시스템이 안전하고 메인넷 출시를 위한 준비가 되었는지 확인하기 전에 블록체인 네트워크의 모든 측면과 기능을 테스트하고 문제를 해결하는 데 사용됩니다. 즉, 테스트넷은 블록체인 프로젝트의 프로토타입으로만 존재하는 반면, 메인넷은 사용자가 암호화폐 거래(또는 분산 원장에 기록되는 모든 종류의 디지털 데이터)를 주고받을 수 있도록 완전히 개.. 2022. 8. 23.
가스피(GasFee)가 무엇인가요? 블록체인에 트랜잭션을 넣거나 실행한 채굴자에게 주어지는 보상같은 개념. 식사가 끝날때 웨이터에게 주는 팁이라고 생각하시면 됩니다. 블록체인은 본질적으로 탈중앙화되어 있기 때문에 익명의 채굴자나 검증인이 네트워크 블록체인에 트랜잭션을 추가하고 검증합니다.이것은 모든 거래 블록체인 기술의 기반입니다. PoW 시스템에서 광부는 이더리움 토큰의 보상을 위해 트랜잭션을 검증하기 위한 복잡한 수학적 퍼즐을 해결합니다. 채굴자가 이더리움 토큰을 얻을 수 있는 방법은 2가지가 있다. 1. 새로 발행된 이더리움 토큰으로 지불을 받기 위해 이더리움을 채굴하는 것. 2. 거래를 처리해 사용자로부터 이더리움 수수료를 받는 것. 처리되지 않은 모든 트랜잭션은 메모리와 풀의 조합인 '멤풀'로 알려진곳에 저장됨. 여기에서 광부는 .. 2022. 7. 21.
프론트엔드에서 Binance Smart Chain 스마트계약 연결하기 개요 binance smart chain integration에서 실행되는 스마트 계약과 사용자의 웹 브라우저에서 실행되는 프런트엔드 구조 바이낸스 스마트 체인을 실행하는 소프트웨어를 클라이언트라고 합니다. 클라이언트가 노출하는 어떤 스팟의 API에 계약 기능과 스마트 계약과 상호 작용하기 위한 여러 end point가 있습니다. 트랜잭션을 보내서 데이터를 수정하고 호출하여 프론트엔드의 스마트계약은 html,css,javascript가 있는 웹페이지를 갖게됩니다. 스마트계약과 트랜잭션할 자바스크립트 코드를 사용하여 바이낸스 일치의 API와 직접 상호작용할 수 있지만 너무 많은 작업이 될 것입니다. 두개의 엔드포인트를 사용하여 트랜잭션을 전송하고 매개변수에 대한 특정 인코딩이 필요하며 이를 처리하는 것이 .. 2022. 6. 22.
바이낸스 스마트 체인(BSC) 요약 여러분은 BNB 통화가 기반을 두고 있는 바이낸스 체인에 대해 들어보셨을 수 있습니다. 이는 무척이나 빠른 트레이딩에 최적화되어 있습니다. 그러나 프로그래밍관점에서는 다른 블록체인보다 유연하지 못하다는 단점을 갖고 있습니다. 이러한 단점을 보완하기 위해 바이낸스 스마트 체인이 출시되었습니다. 바이낸스 스마트 체인은 고성능 탈중앙 애플리케이션 개발을 위한 기능을 모두 갖춘 새로운 블록체인입니다. 바이낸스 체인과 크로스체인 호환을 위해 구축되었으며, 사용자는 두 블록체인 모두에서 혜택을 누릴 수 있습니다. 바이낸스 스마트 체인이란 무엇인가요?  바이낸스 스마트 체인은 바이낸스 체인과 병렬로 실행되는 블록체인이라는 설명이 가장 적합합니다. 바이낸스 체인과 다르게 바이낸스 스마트 체인은 스마트 콘트랙트 .. 2022. 6. 20.
나리의 집, 한남동 냉동삼겹살 뿌시기! 냉동삼겹살 맛집으로 유명한 나리의 집. 유명한 만큼 웨이팅 1시간 걸렸고요 ~ 근데! 기다릴만해. 너무 촉촉하고 너무 맛있어! 일반 고기보다 앞으로 냉동삼겹살이 내 최애야. 그리고 나리의집 가면 청국장 진짜 꼭 시키기 2022. 6. 14.

티스토리툴바