본문 바로가기

programming

(118)
react-hook-form 과 meterial-UI 함께 쓰기 (3) - DateRangePicker (1) TextField https://tacit.tistory.com/41 react-hook-form 과 meterial-UI 함께 쓰기 (1) - TextField react-hook-form은 material-UI 나 ant-D같은 외부 UI 라이브러리와 함께 사용할 수 있다. 그 중 가장 기본이 되는 TextField와 연결하는 방법을 정리해보려한다. import TextField from '@material-ui/core/TextF.. tacit.tistory.com (2) ToggleButton https://tacit.tistory.com/42 react-hook-form 과 meterial-UI 함께 쓰기 (2) - ToggleButton 이전 게시물(1) - TextField 에 이어서..
react-hook-form 과 meterial-UI 함께 쓰기 (2) - ToggleButton 이전 게시물(1) - TextField 에 이어서 https://tacit.tistory.com/41 react-hook-form 과 meterial-UI 함께 쓰기 (1) - TextField react-hook-form은 material-UI 나 ant-D같은 외부 UI 라이브러리와 함께 사용할 수 있다. 그 중 가장 기본이 되는 TextField와 연결하는 방법을 정리해보려한다. import TextField from '@material-ui/core/TextF.. tacit.tistory.com 이번엔 ToggleButton 과 함께 사용하는 방법에 대해 정리해보려한다. CheckBox로 예시들이 몇개 구글에 나와있다. ToggleButton도 비슷한 맥락이다. import ToggleButton..
react-hook-form 과 meterial-UI 함께 쓰기 (1) - TextField react-hook-form은 material-UI 나 ant-D같은 외부 UI 라이브러리와 함께 사용할 수 있다. 그 중 가장 기본이 되는 TextField와 연결하는 방법을 정리해보려한다. import TextField from '@material-ui/core/TextField'; import { useForm, Controller } from 'react-hook-form'; export default function App() { const { handleSubmit, control, formState: {errors} } = useForm(); const onSubmit = (data) => { console.log(data); }; return ( ( )}/> 전송 ); } 전달하는 속성들에..
[Web] 색상 코드 추출하기 (컬러콥 color cop 추천 및 오류 해결) 컬러콥을 사용하고는 신세계가 열렸었다.ㅋㅋ ppt 만들때나, 문서작성, 디자인 등등에 유용한 색상 추출 프로그램을 소개하려 한다. 뭐 이미 유명한 프로그램이겠지만 ㅎㅎㅎㅎㅎ colorcop.net/download/ download The easiest way to install Color Cop is to download the self-installing version. If you use the installer it's easy to remove the application by using add/remove programs under Windows. Standalone 5.4.6 BETA beta.zip I have a new version here, but I'd like colorcop.net..
[Web] url로 queryparameter 쿼리파라미터 가져오기 지금 작성하는 글의 url을 캡쳐해보았다. 뒤쪽에 보면 ? 로 시작해서 & 로 이어지는 글자들이 보인다. type = post returnURL= %2Fmanage%2Fpost%2F 위의 경우는 이처럼 2가지의 쿼리 파라미터를 가지고 있다고 볼 수 있다. 그럼 html 상에서 위의 쿼리파라미터를 변수로 가져와서 사용하는 방법을 소개하겠다. $(document).ready(function() { var param_type = new URLSearchParams(location.search).get('type'); var param_returnURL = new URLSearchParams(location.search).get('returnURL'); console.log("param_type은? ", par..
[Web] div안에 div 가운데 정렬하기 웹 디자인을 하다보면 가장 많이 쓰는데 또 맨날 까먹는 것 중에 하나가 바로 가운데 정렬이다. 무의식적으로 바로 text-align : center 사용하고는 아 왜 안되지? 그다음은 이제, vertical-align : middle 사용하고는 아 왜 안되지? 무한 반복하다가, 아 맞다....하고는 최후의 수단? 만병통치약으로 사용하는 것이 바로 position을 사용한 가운데 정렬이다. 안녕? 레알 만병통치약이다. 부모 클래스에는 position : relative; 자식 클래스에는 position : absolute; top: 50%; left : 50%; transform: translate(-50%, -50%);
[Web] css 한 줄에 여러가지 색깔 넣기 한줄에 여러가지 색깔을 사용하려면 꼭 써줘야하는 css 속성이 있다. 오늘 해볼 것은 한줄에 여러가지 두가지 색상을 표현하고, 또 추가로 마우스를 가져다 대면 (hover) 색이 변하는 css를 구현해보려 한다. like this -> 가장 중요한 것은 바로바로 !!! display : inline-block 을 넣어 주는 것이다. 그리고 hover 속성을 전체 묶어주는 div에 주어야 마우스를 가져다 대면 동시에 모든 색상이 변할 수 있다. hover 속성을 main_titl_1:hover / main_titl_2:hover 이런식으로 따로따로 주게 되면 글자를 반 나눠서 왼쪽 반에 가져다 대면 왼쪽만 바뀌고, 오른쪽에 가져다 대면 오른쪽만 바뀌게 된다. (이런 효과를 원한다면 이렇게 따로따로 hove..
[Web] ajax로 불러온 요소(element)에 접근하기 ajax로 데이터를 불러와서 innerHtml로 신나게 때려박았다. 그리고는 다음 javascript에서 innerHtml로 박아 넣은 div의 id를 가져다 쓰려는데,,, 불러오지를 못했다. 일번 프로젝트 위의 코드로는 아무리 project_list를 눌러도 눌러지지 않는다.. (ajax로 불러와서 innerHtml 한경우만!!) ajax로 불러온 데이터들에 접근하려면 다른 방법을 사용해야한다. --> 해결방법 script 부문을 다음과 같이 바꿔보자
[Web] html 안에 html 넣기 (html import 하는 방법) html을 쭉 작성하다보면, 페이지별로 공통적인 부분이 존재한다. 이를 따로 파일화 하는 것을 모듈화 라고 한다. 따로 파일로 빼서 , 공통부분은 그 파일을 참조해서 만들어라 라고 하는 것이다. // 이 부분에 import 한 menu가 들어가게 되는 것이다. 내용 자주 사용하게 되어 따로 빼둔 html파일은 menu.html 이다. html에 header라는 id로 div를 만들어 둔다. (menu.html)이 들어가게 될 구멍이라고 보면 된다. $(document).ready(function() { -> 페이지가 로딩 되면 실행하라 라는 함수이므로, 로딩과 동시에 menu.html을 심으세요@!! 라는 뜻이라고 생각하면 된다.
[Python] 아나콘다 가상환경 이름 바꾸기(Change the name of the virtual env in Anaconda) 1. conda create --name 바꿀이름 --clone 기존이름 conda create --name py37_32 --clone python_env 2. 복사된 가상환경 확인