본문 바로가기

분류 전체보기347

728x90
React #Building Custom Hooks What are "Custom Hooks"? Outsource stateful logic into re-usable functions Unlike "regular functions", custom hooks can use other React hooks and React state The name must start with 'use' Sample Code src/hooks/use-http.js import { useState, useCallback } from 'react'; const useHttp = () => { const [isLoading, setIsLoading] useState(false); const [error, setError] useState(null); const sendReque.. 2022. 9. 24.
React #Rules of Hooks React Rules of Hooks Only call React Hooks in React Functions React Component Functions Custom Hooks Only call React Hoos at the Top Level Don't call them in nested functions Don't call them in any block statements + extra, unoffical Rule for useEffect(): ALWAYS add everything you refer to inside of useEffect() as a dependency useEffect(() => { setFormIsValid(email && password) }, [email]); // (.. 2022. 9. 24.
React #Understanding useReducer() useReducer() const [state, dispatchFn] = useReducer(reducerFn, initialState, initFn); state: The state snapshot used in the component re-render/ re-evaluation cycle dispatchFn: A function that can be used to dispatch a new action (i.e. trigger an update of the state) reducerFn: (prevState, action) => new State / A function that is triggered automatically once an action is dispatched (via dispatc.. 2022. 9. 24.
『생각이 너무 많은 서른 살에게』를 읽고 기억에 남는 3가지 1. 우물안 개구리 2. 고민보단 실천을 3. 회사는 연인과 같다 우물안 개구리 영어로 고통받았던 저자는 구글을 다니며 자신이 우물안 개구리라고 생각했지만 알고 보니 생각보다 많은 우물안 개구리들이 존재했다고 한다. 저자의 용기 있는 개구리 커밍아웃을 통해 다른 개구리들도 커밍아웃을 할 수 있었던 것이다. (자세한 내용은 스포라 생략했다) 어쩌면 우물안 개구리가 아닌 사람은 없을 것이다. 사람이 할 수 있는 일은 한정적이고, 수명의 한계가 존재한다. 그렇다고 우물을 벗어나거나 우물 크기를 키우려는 노력을 하는 것이 바보같은 짓일까? 아니라고 생각한다. 그렇지만 그 노력의 과정에 분명 외롭고 힘든 순간들을 마주하게 될 것이다. 그 때 나와 같은 개구리가 많다는 것을 알고 있다면 많은 위.. 2022. 7. 17.
프로그래머스 #2021 KAKAO BLIND -신규 아이디 추천 lv1 문제 풀이 function solution(new_id) { let answer = ''; answer = getAvailableId(new_id); return answer; } function getAvailableId(id) { let recommandId = '' const idInValidRe = /[^-_.a-z0-9]/g; const doubleDotRe = /\.{2,}/g; const startDotRe = /^\./; const endDotRe = /\.$/; // 1단계 new_id의 모든 대문자를 대응되는 소문자로 치환합니다. recommandId = id.toLowerCase(); // 2단계 new_id에서 알파벳 소문자, 숫자, 빼기(-), 밑줄(_), 마침표(.)를 제외한 모.. 2022. 7. 4.
TFT 팬아트 #짜릿짜릿 키키와 배불뚝이 꼬마전설이 6h ipad pro + procreate 참고한 이미지 - 짜릿짜릿 키키와 배불뚝이 꼬마전설이 2022. 7. 2.
javascript #자바스크립트 객체와 SOLID 원칙 자바스크립트 객체와 SOLID 원칙 원시형 객체 리터럴 모듈 패턴 객체 프로토타입과 프로토타입 상속 new 객체 생성 클래스 상속 함수형 상속 멍키 패칭 1. 자바스크립트 원시형 (Primitive Type) JavaScript에서 원시 값(primitive, 또는 원시 자료형)이란 객체가 아니면서 메서드도 가지지 않는 데이터다. 원시 값에는 7종류, string, number (en-US), bigint (en-US), boolean, undefined, symbol, 그리고 null이 존재한다. 대부분의 경우, 원시 값은 언어 구현체의 가장 저급(low level) 단계에서 나타낸다. 모든 원시 값은 불변하여 변형할 수 없다. 원시 값 자체와, 원시값을 할당한 변수를 혼동하지 않는 것이 중요하다. .. 2022. 5. 29.
[VRChat] 화면 해상도 높이기 (그래픽 퀄리티 높이기) 이 방법은 이제 안돼요. 이전에는 Ctrl을 누르며 VRChat 을 켜거나 Shift 를 누르며 Steam에서 실행하면 해상도 설정 화면이 출력되었다고 합니다. 하지만 이제 작동하지 않습니다. VRChat 문서로 확인된 그래픽 퀄리티 높이기 가이드 문서이니 아래를 참고하셔서 본인 해상도에 맞는 VRChat을 즐기시길 바랍니다. 가이드 요약 1) 효과 모두 켜기 : Settings > Safety > Shild Level None 2) 아바타 퍼포먼스 높이기 : Settings > Safety > Performance Options > Avatar Perf. > Medium^ 3) 아바타 물리 모션 퍼포먼스 높이기 : Settings > Safety > Performance Options > Dynamic.. 2022. 2. 7.
『UX/UI의 10가지 심리학 법칙』을 읽고 UX/UI의 10가지 심리학 법칙 나는 사용자 경험 디자인에 관심이 많다. 내가 만든 결과물에 대해 사용자는 어떻게 받아들일까? 전달하고자 하는 메세지를 어떻게 전달할까? 어떤 것이 이로운 디자인이고 보다 나은 사용자 경험을 줄 수 있을까? 항상 하던 고민이었고 어떻게 보면 본능적으로 이미 시행하고 있었던 UX/UX 접근 방식에 대해 이 책은 간단명로하게 사전처럼 정의해두었다. 1장 | 제이콥의 법칙 사용자는 자신에게 익숙한 것을 다른 제품에 투영한다. 2장 | 피츠의 법칙 터치 대상의 크기는 사용자가 정확하게 선택할 수 있을 정도의 크기여야 한다. 터치 대상 사이에 충분한 거리를 확보해야 한다. 3장 | 힉의 법칙 의사결정에 걸리는 시간은 선택지의 개수와 복잡성과 비례해 늘어난다. 4장 | 밀러의 법칙.. 2021. 12. 12.
『Z세대는 그런 게 아니고』를 읽고 Z세대는 그런 게 아니고 좋은 기회로 책을 받고 이틀만에 완독한 뒤 리뷰를 남긴다. 그 동안 여러 매체에서 MZ세대, 밀레니엄 세대 등에 대해 다뤘었지만 정확히 어떻게 구분되는지 모르고 그게 얼마나 중요한 개념인지 몰랐었다. 그나마 알고 있었던 점은 M세대 보다 Z세대가 부모와의 유대 관계가 깊고 좋은 사이인 경우가 높다는 것이다. 책을 읽고 난 뒤 MZ세대로 함께 묶여서 불리는 2030세대가 사실은 분리된 취향을 가진 별개의 세대라는 것을 알 수 있다. 또한 기업들이 나아가야할 선한 이미지와 정치적 올바름에 대한 추구가 Z세대의 감성을 어떻게, 왜 자극하는지를 알 수 있다. 여기서 세대별 차이점을 외국 이민에 비유하며 독자로 하여금 이해하기 쉽게 설명했다. X세대가 자녀를 데리고 이민간 세대라면 어렸을.. 2021. 12. 12.
728x90
728x90

티스토리툴바