추후 확인 및 정리할 목록
https://okky.kr/articles/1303947
https://velog.io/@jsw4215/
https://ui.toast.com/posts/ko
axios에 대하여
https://yamoo9.github.io/axios/guide/#axios%EB%9E%80
scss에 대하여
https://inpa.tistory.com/entry/Sass(SCSS) 개념 소개 & 설치 세팅 💯 정리
Form 에 대하여
1) HTML5의 Form
https://jeonghwan-kim.github.io/dev/2020/06/08/html5-form-validation.html
입력 요소는 required를 포함해 7가지 검증 속성(validation attributes)을 제공한다.
- required : 필수 입력
- minlength / maxlength: 입력값의 최소/최대 길이
- min / max: 최소/최대 정수
- type: 타입(이메일 등)
- pattern: 패턴(정규표현식)
당장 눈에는 보이지는 않지만 브라우져는 요소에 :valid와 :invalid 가상 클래스를 추가한다.
- :valid: 규칙에 맞는 값을 입력한 경우
- :invalid: 규칙에 맞지 않은 값을 입력한 경우
이를 활용하면 좀 더 명확한 UI를 만들 수 있겠다.
2) 리액트의 Form (typescript)
https://velog.io/@junghyeonsu/React-useForm
Placeholder 에 대하여
https://www.codingfactory.net/10755
<input placeholder="내용"/>
placeholder 꾸미기
input::placeholder {
color: red;
font-style: italic;
}
textarea::placeholder {
color: blue;
font-weight: bold;
}
기타
+) css로 페이지 드래그 방지
https://fresh-mint.tistory.com/entry/css-%EB%93%9C%EB%9E%98%EA%B7%B8-%EB%B0%A9%EC%A7%80
css에 삽입하는 방법
body {
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none
}
flex 연습하는 사이트
flex-position
https://minigomi.tistory.com/25
https://parkjh7764.tistory.com/80
flex: 1;
https://code-hoon.tistory.com/149
https://www.codingfactory.net/12397
https://developer.mozilla.org/ko/docs/Web/CSS/position
hover, active, visited 이벤트
https://programacion.tistory.com/96
폰트어썸
