react 41 [리액트] 특정 엘리먼트에 focus 주는 방법에 대하여(feat.타입스크립트) 들어가며 특정 버튼을 눌렀을때 입력창이 뜨고 텍스트를 입력합니다. 근데 텍스트 입력이 안됩니다. 귀찮게 마우스로 입력창을 누르고 다시 키보드로 옮기는 과정이 필요합니다. 매우 귀찮죠. 그럴때 필요한 기능이 바로 리액트 컴포턴트에 focus를 주는 것입니다. 이번 글에서는 바로 이 기능에 대한 간단한 구현과 예시를 살펴보겠습니다. 자바스크립트에서의 Focus 일단 리액트의 focus를 들어가기 전에 HTML의 focus에 대해 간단히 살펴보겠습니다. 기본 사용법 HTMLElement.focus() - Web APIs | MDN The HTMLElement.focus() method sets focus on the specified element, if it can be focused. The focused.. 2021. 5. 10. [인터뷰] 프론트 앤드 인터뷰 질문 ( Feat.VoyagerX ) 내가 가고 싶은 기업 중 하나인 VoyagerX의 인터뷰 질문에 관한 글이다. 학부 3학년 말에 Vrew의 초기 모습을 보고 감명을 받았다. 유저가 불편해하는 부분을 컴퓨터로, 그중에서도 머신러닝을 이용해 해결했다는 점이 참 멋지다고 느꼈다. 그때 나는 친구들과 창업을 했었다. 그래서 여기저기 많은 곳을 쏘아 다녔고 가끔씩 VoyagerX 대표 남세동님이 발표하는 세션을 몇 번 봤었다. 그때 뭔가 알 수 없는 선망을 했었다. 그래서 창업을 했는데도 그냥 면접을 보고 싶다고 메일을 보냈고 실제로 면접을 봤었다. ( 만약 붙었으면 어찌했을까 라는 다소 책임감 없는 상상도 해봤었다 ) 결과부터 말하자면 떨어졌다. 아직 졸업시기도 아닌 나에게 각 파트의 리더님, 그리고 남세동님께서 한 시간 넘게 1대 4로 면접.. 2021. 2. 20. [리액트] 두번 렌더링 되는 이슈에 대하여(Feat.StrictMode) 들어가며 요새 교학성장이라는 말을 실천해보기로 했습니다. 교학상장(敎學相長) [가르칠 교, 배울 학, 서로 상, 길 장] ‘가르치고 배우면서 서로 성장한다’는 뜻. 스승은 제자를 가르치는 과정에서 아직도 막히는 부분이 있음을 느껴 더욱 정진케 되고, 제자는 배울수록 자신의 부족함을 알게 돼 학업에 힘쓰니 가르침과 배움이 서로를 성장케 한다는 뜻이다. 속담에 ‘세살먹은 아이한테도 배운다’고 했다. 배움의 길에 모든걸 가르쳐주는 절대스승은 없다. 가르치고 배우며 부족함을 채울 뿐이다. 하지만 가르칠 곳이 마땅치 않는 저에겐 그나마 오픈채팅방에서 답변해주는 게 그나마 지식을 나누는 방식이라 생각해서 알만한 질문이 나오면 최대한 답변을 하려고 노력하고 있습니다. 이번 글 또한 비슷한 맥락에서 작성하는 글이기도 .. 2021. 2. 2. [리액트] typescript, mobx 에서 private state를 처리하는 방법에 대하여 mobx 상에 store를 만들어 사용할 때 일반적으로 observable를 통해 만들게 됩니다. 간단한 예를 들어 설명하겠습니다. 일반적으로 클래스형 store에서는 간단하게 makeObservable()를 통해 간단히 만들곤 합니다. import { action, makeObservable, observable } from 'mobx' class Count { number: number = 0 constructor() { makeObservable(this, { number: observable, increase: action, decrease: action, }) } increase = () => { this.number++; } decrease = () => { this.number--; } } .. 2021. 1. 19. 이전 1 ··· 7 8 9 10 11 다음
