투자유의 개발 블로그

https://consensys.net/blog/developers/how-to-fetch-and-update-data-from-ethereum-with-react-and-swr/ fetcher가 axios 등의 간단한 형태인 경우 data fetch를 위해 swr을 사용해본 경험이 있는데, 이더리움 네트워크의 데이터를 fetch하는데도 swr을 사용하는 방법이 소개되어 있다. 나중에 해보자.

const decimal2Input = (e) => { e.target.value = e.target.value.replace(/(\.\d{2})\d+/g, "$1"); if (parseFloat(e.target.value) >= parseFloat(sellPrice)) { alert("참여 금액은 판매 금액보다 작아야 합니다."); e.target.value = ""; } }; export const isHangul = (value) => { const regExp = /[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/g; return regExp.test(value); }; export const toInputAlphabetDecimal = (e) => { e.target.value = ("" + e.target.value..

Data fetching library DB가 가진 최신 데이터를 중복되지 않게(최적화하여) 가져오는 방법을 제공. docs가 워낙 잘되어 있어서 여기선 mutate에 관한 내용만 가볍게 남기겠다. 참고: https://swr.vercel.app mutate import useSWR from 'swr' function Profile () { const { data, mutate } = useSWR('/api/user', fetcher) return ( My name is {data.name}. { const newName = data.name.toUpperCase() // 데이터를 업데이트하기 위해 API로 요청을 전송 await requestUpdateUsername(newName) // 로컬 데이터를..

// keyof + generic + extends & type lookup interface IPerson { name: string; age: number; } const person: IPerson = { name: "Hyun", age: 33, }; const getProp = (obj: IPerson, key: string | number): string | number => { return obj[key]; // Error }; const getProp1 = (obj: IPerson, key: keyof IPerson): IPerson[keyof IPerson] => { return obj[key]; }; const getProp2 = (obj: T, key: K): T[K] => { retu..

// generic vs. any function hello(message: any): any { return message; } console.log(hello('Hyun').length); console.log(hello(33).length) function helloGeneric(message: T): T { return message; } console.log(helloGeneric('Hyun').length); // T는 string console.log(helloGeneric('Hyun').length); // T는 'Hyun' console.log(helloGeneric(33).length); // T는 number // any를 사용하면 못 잡던 error를 잡아 준다. console.lo..

static property & function in class // static property & function // 클래스 차원에서 공유하는 property & function class Person { private static CITY = 'seoul'; hello() { console.log(`안녕하세요. 저는 ${Person.CITY} 살아요.`); } public static change(city: string) { Person.CITY = city; } } const p1 = new Person(); p1.hello(); const p2 = new Person(); p2.hello(); Person.change('Dongtan'); p2.hello(); singleton 애플리케이션이 ..

// 3. readonly - 선언부에서만 할당 가능 class Person5 { public readonly name: string = "Hyun"; // 선언부 1 private readonly age: number; constructor(private _name: string, private _age: number) { this.age = 32; // 선언부 2 } hello() { this.name = "Kim" // ERROR this.age = 33 // ERROR } } // 4. index signatures in class // 아래 두 가지 형태를 아우를 수 있는 클래스 정의 // { hyun: "male", kim: "female" } // { park: "male", ooh: "ma..

// 0. class class Person1 { name: string; age!: number; // 초기값을 설정하지 않겠다. 나중에 설정해서 사용할 것이다. 라는 의미 주의! 이렇게 선언해놓고 할당하지 않고 호출하면 프로그램이 정상적으로 동작하지 않을 수 있음. constructor(name?: string) { this.name = name ? name : "Hyun"; } } const p1 = new Person1("Hyun"); const p2 = new Person1(); p1.age = 32; console.log(p2); // 1. initialization in constructor parameters class Person2 { name: string; private age: nu..