일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- 개발자패션
- jeremy
- typescript
- 개발 책 리뷰
- react
- 타입스크립트
- 맨투맨
- HTML
- 후드티
- 후드
- 티셔츠
- JavaScript
- 프론트앤드
- Jeremy Winchester
- 개발자
- 프론트엔드
- 제레미윈체스터
- 옷
- frontend
- 책 후기
- 북 토크
- 개발자후드
- 브랜드
- Winchester
- brand
- 티셔츠디자인
- 개발자옷
- clean code
- 생각정리
- 지속 가능한 개발
- Today
- Total
목록전체 글 (37)
Electronic Jeremy Record
커스텀 타입을 선언할 때 일반적으로 type을 사용한다. 다만 object의 타입을 선언할 땐 하나의 선택지가 더 있다. 바로 interface 다. type과 interface는 표면적으로는 같은 역할을 한다. 이들의 사용 방법은 다음과 같다. 샘플의 객체를 생성했다. const student = { name : 'kevin', age: 15, hasCar : false } 이 객체의 타입을 위의 두 가지 방식으로 선언해보겠다. type 방식 type StudentTypeCase = { name: string; age: number; hasCar: boolean; } const student:StudentTypeCase = { name : 'kevin', age: 15, hasCar : false } ..
윈도우에서 윈도우 창 끝에 두면 커서가 화살표로 바뀐다. 화살표를 드래그하면 해당 윈도우 창을 늘이거나 줄일 수 있다 . 이런 기능을 브라우저에서 구현해보려고 한다. 1. 사용할 윈도우 창 만들기 메모장을 만드는 걸로 해보려 한다. 윈도우 창의 우측하단 대각선 드래그 커서를 만드려고 한다. HTML을 이렇게 만들고 .memoDiv { width: 100px; height: 100px; background-color: gold; position: relative; } .sizeBtn { position : absolute; cursor:move; right:0; bottom:0; padding : 5px; background-color: transparent; border : none; } CSS는 이렇게..
주말이 왔다. 오랜만에 여유로운 주말이다. 요즘 확진자도 많아서 참 나가기도 힘든 상황에 집에서 아이와 즐거운 시간을 보낼 콘텐츠가 필요했던 와중 아내가 준비한 것이 있었다. 바로 피자 만들기다. 우리집엔 오븐도 없고 에어프라이어도 없고 당연히 화덕도 없는데 무슨 피자? 라는 생각이 들었지만 그 아이디어는 기발했다. 바로 만두피를 이용해서 피자 만들기였다. 서둘러 재료를 준비했다. 집에 있는 것들에 필 수 재료 몇 가지 장을 봐왔다. 준비물 1. 도우로 쓸 만두피 2. 피자에 빠질 수 없는 피자치즈 3. 남으면 스파게티라도 해 먹을 수 있는 토마토소스 4. 각종 취향에 맞는 토핑들 - 스위트콘 - 양파 - 단호박 - 슬라이스 햄 - 크래미 - 브로콜리 - 파프리카 제조법 4살 아이도 만들 수 있는 매우 ..
웹 개발, 특히 프론트앤드 개발을 하다 보면 Form Control을 할 일이 자주 있다. 로그인, 회원 가입, 게시물 작성 등 꽤 자주 활용하게 된다. 보통 Form에 입력된 값들은 DB에 넣거나 조회하는 등 할 때 사용되는데 Submit 하기 전에 입력을 제대로 했는지, 빠진 값들은 없는지 하는 Validation 과정을 거친다. 이런 일련의 과정들을 매우 쉽게 구현할 수 있는 것이 있어 소개하고자 한다. "React Hook Form" 이다. React Hook Form 의 장점은 1. 코드 량이 적다. 2. Validation이 강력하다. 3. Error 잡기 좋다. 4. Input Control 유용하다 5. 이벤트를 신경쓰지 않아도 된다. 6. Input 처리가 간편하다 그럼 React Hoo..