본문 바로가기

전체 글159

리액트 데이트피커 포맷 api axios error문제 react datepicker date format axios not working 리액트에서는 jquery용 데이트 피커를 사용할 수 없다. 아니 사실 리액트용 데이트피커인 react datepicker가 훨씬 깔끔하게 사용되기 때문에 굳이 제이쿼리 데이트 피커를 붙여야 할 필요가 없다. 사실 아직 리액트가 초짜라 react datepicker를 온전히 다루지는 못하고 있기 때문에 정석으로 설정하는 방법은 사실 나도 잘 모르겠다. 일단, 신규 프로젝트에서 datepicker를 사용할 일이 있어서 설치했다. yarn add react-datepicker 혹은 npm i react-datepicker 로 설치 하면 되겠다. 그런데 문제는 이렇게 설치하고 import DatePicker from "react-datepicker"; 했을 경우 스타일 깨짐 문제가 발생했다. 이유는 모르겠지만 .. 2021. 5. 27.
워드프레스 사이트 이름 문자 출력 인스턴스 bloginfo( 'name' ); 워드프레스는 PHP로 만들어졌다. 하지만 워드프레스에서 쓰는 모든 함수가 PHP 네이티브 함수는 아니다. 워드프레스 사이트 이름을 문자로 출력하고자 할 때 찾는 방법은 많지만 이미 워드프레스 코어 자체가 사이트 이름을 bloginfo의 인스턴스로 가지고 있다. 이 것을 호출해서 쓰기만 하면 된다. 사용방법은 간단하다. 쓰고 싶은 위치에서 2021. 4. 23.
ReactJS input, select disabled 제어. Warning: Received the string `false` for the boolean attribute `disabled`. The browser will interpret it as a truthy value. Did you mean disabled={false}? ReactJS Warning: Received the string `false` for the boolean attribute `disabled`. The browser will interpret it as a truthy value. Did you mean disabled={false}? ReactJS input, select disabled 제어. index.js:1 Warning: Received the string `false` for the boolean attribute `disabled`. The browser will interpret it as a truthy value. Did you mean disabled={false}? at input at td at tr at tbody at t.. 2021. 4. 14.
여러가지 리액트 멀티 레이아웃 connected-react-router multi layout 적용하기 리액트를 별로 좋아하지 않는 1인이다. 그런데 어쩔 수 없이 리액트 플젝을 해야 해서 퍼블리셔 겸 프런트 엔드로 참여 중이다. jquery라면 단박에 끝낼 문제에 고민하지 않아도 될 문제들이 리액트에는 넘쳐난다. 왜 쓰는지는 여전히 모르겠지만 까라니까 깐다. 일단 SPA 사이트에서 리액트가 편한 것은 대충 짐작은 된다. 그런데 SPA사이트라고는 해도, 한 사이트에 서로 다른 레이아웃이 여럿 사용해야 되는 경우가 많다. 단적으로 GNB, LNB가 없는 Intro페이지, Login페이지 그리고 사용자 화면과 다른 관리자 화면의 레이아웃은 서로 다를 수 있다. 아니 다를 수 있는 정도가 아니라 대체로 다르다. 그럴 때 리액트 여러 가지 레이아웃 적용하는 방법은 꽤 다양하지만 직관적이고 쉬운 리액트 멀티 레이아.. 2021. 3. 25.
당근마켓 판매 태클라스트 tbook11 2in1 안드로이드 윈도우 8 태블릿pc 당근 마켓에 팔려고 올린 물건이다. 태클라스트 tbook11 2 in 1 안드로이드 윈도우 8 태블릿 pc. 구입은 2017년에 했으나 솔직히 한 손에 들기는 너무 무거워서 처박아만 두어서 거의 사용감 없이 깨끗합니다. 허나 저가 태블릿인걸 감안하면 답답하게 느리고 윈도우는 사용할 수는 있으나 의미 없을 정도입니다. 키보드 포함 케이스는 지지막대 두 개가 부러져있습니다. 원래 허약해서 구입하자마자 부러졌으나 쓸 일이 없어 그냥 방치되었으니 케이스는 고려하지 말고 구입 결정하세요. 네고 환영하지만... 상식선에서 네고 요청하세요. 팔렸음. 2021. 3. 17.
React Js - Global CSS 설정 + styled reset. classNames/bind :global local css 동시 적용 react module.css :global local css 동시 적용하는 방법. classNames/bind를 사용하고 있을 때 className={cx("label","labelTst")} .labelTst는 app.module.css에 등록. React Js - Global CSS 설정 + styled reset css 초기화를 위해 styled-reset 설치 styled-components는 local로 동작하기 때문에 global 한 css를 만들기 위해 GlobalStyles.js 생성 설치 NPM설치 : npm install styled-reset styled-components 얀 살치: yarn add styled-reset styled-components 사용 Components/G.. 2021. 3. 10.
CSS3 text-shadow 텍스트 쉐도우 배경 BG에도 잘 보이는 글자 국어청 인사말 퍼블리싱 작업 중인데... 2016. 9. 8. 17:35 디자이너가 원색 찬연한 BG를 깔았다. PC 화면에서라면 문제가 없지만... 반응형으로 모바일 화면이 되면, 백그라운드 이미지와 텍스트가 겹치게 되는데... 글씨가 배경 때문에 잘 안보일 수가 있다. 이럴 때 선택은 3가지다. 1. 모바일 상태에서 BG를 날려버린다. (화면이 굉장히 심심해진다.) 2. 텍스트와 BG레이어를 absolute로 띄워서 모바일 미디어 쿼리일 때는 BG레이어에만 opacity를 먹인다. (배경 흐려짐 효과) 3. BG에도 잘 보이는 글자가 되게끔 텍스트에 스트로크를 씌운다. CSS에 스트로크가 없으니 text-shadow를 응용한다. 텍스트의 css속성으로 text-shadow:#fff 0 0 2px 2p.. 2021. 3. 10.
jquery로 페이지 상단으로 부드럽게 이동하는 탑 스크롤 버튼 만들기 보통 탑스크롤이라고 부르는 버튼인데요. 흔한 방식이지만, 가끔 떠 오르지 않아서 검색하시는 분들을 위해 올려둡니다. 뭐~ 저도 가끔은 까먹어서 다시 생각해내는 일 없이 떠다 쓰려공.... /* top 스크롤 */ var speed = 500; $("a.top").css("cursor", "pointer").click(function(){ $('body, html').animate(, speed); }); speed 변수는 스크롤이 애니메이트 되어서 이동하는 속도를 지정해줬습니다. 귀찮으면 그냥 변수 쓰지 말고 숫자로 바로 써도 됩니다. . css("cursor, "pointer")는 생략해도 무방하며, css자체에 a.top { cursor:pointer}로 작성해두어도 무방합니다. 실질적인 핵심은 $(.. 2021. 3. 5.
WordPress 워드프레스 다운로드 받아서 설치하기. 1. 워드프레스 다운로드하기. 설치하기 반응형 웹, 개인 블로그 워드프레스는 http://wordpress.org/에서 다운 받을 수 있다. 딱히 어렵지 않으며 그냥 다운받으면 된다. Blog Tool, Publishing Platform, and CMS - WordPress Open source software which you can use to easily create a beautiful website, blog, or app. wordpress.org 압축을 푼 후, UTF-8을 지원하는 호스팅 계정이고, mySQL, PHP를 지원하는 호스팅이라면 어디든 설치가 가능하다. 필자는 http://nayana.com에서 도메인을 구입하면 무료 호스팅을 해주는 계정에 설치를 해보았다. 웹 호스팅, 도메.. 2021. 2. 23.

티스토리툴바