본문 바로가기

전체 글242

SCSS 일종의 프로그래밍적인 기능을 지원하는 css 전처리기이다. scss 양식으로 작성하고 컴파일 기능을 제공하는 모듈을 이용해 css로 변환해준 뒤 사용되는 구조. 비교를 위한 기존 방식의 CSS .my-alert { background: #ff0000; padding: 20px; border-radius: 10px; max-width: 500px; width: 300px; margin: auto; } .my-alert2 { background: #eeeeee; padding: 20px; border-radius: 10px; max-width: 500px; width: 300px; margin: auto; } div.container div{ background: #00ff00; padding: 20px; .. 2021. 10. 28.
styled-components css-in-js 즉, js파일 안에 css를 설정할 수 있는 컴포넌트라고 보면 된다. 사용법은 아래처럼. App.js import styled from 'styled-components'; let TestComponent = styled.div` font-size : 12px; color : #ff0000; `; let TestComponentWithProps = styled.h4` font-size : 30px; color : ${ props.임의의컬러 }; `; return ( ) yarn add styled-components 명령어로 모듈을 설치하고 import한다. 대문자로 시작하는 변수를 생성하여 TestComponent 처럼 작성하되, 아래 WithPorps처럼 Props문법을 이용하여 공.. 2021. 10. 27.
import, export로 코드 줄이기 변수 및 데이터, 객체 등이 너무 길어질 경우 파일을 따로 구분하여 export하고 사용하고자 하는 파일에서 import Datas.js // export 파일당 default는 하나만 지정 가능하다. export default [ { id : 0, title : "White and Black", content : "Born in France", price : 120000 }, { id : 1, title : "Red Knit", content : "Born in Seoul", price : 110000 }, { id : 2, title : "Grey Yordan", content : "Born in the States", price : 130000 } ] Variables.js var name = 'k.. 2021. 10. 26.
react-bootstrap react-bootstrap : https://react-bootstrap.github.io/ React-Bootstrap The most popular front-end framework, rebuilt for React. react-bootstrap.github.io bootstrap : https://getbootstrap.com/ Bootstrap The most popular HTML, CSS, and JS library in the world. getbootstrap.com 설치명령어 npm install react-bootstrap bootstrap yarn add react-bootscrap bootstrap 특정 스타일을 사용할 때 bootstrap css 파일을 요구할 경우 대비 htt.. 2021. 10. 26.
[Kotlin] enum값을 순차적으로 이동(앞,뒤)하여 가져올 수 있는 코드 enum값을 메뉴의 flow에 따라 배치하거나 enum에 parameter를 주고 다른 용도로 활용할 경우 다음 값, 이전 값을 가져올 필요가 있을 때가 발생한다. 그 경우 활용할 수 있는 코드를 공개한다. 확장함수로 Enum.함수명 으로 사용하면 된다. 현재 값이 enum의 마지막인데 next()를 콜 할경우 첫번째 값으로 순회하여 리턴한다. 마찬가지로 첫번째 값인데 previous()를 호출할 경우 마지막 값으로 순회하여 리턴한다. inline fun T.next(): T { val values = enumValues() val nextOrdinal = (ordinal + 1) % values.size return values[nextOrdinal] } inline fun T.previous(): T.. 2021. 4. 19.
맥(Mac)에서 ssh로 접속 시, no matching cipher found 에러 맥에서 ssh로 다른 pc에 연결하려 할 때 아래와 같은 메세지가 발생한다. 원인은 암호화 방식이 맞지 않기 때문이며, 몇가지 제공되는 방식 중 선택하여 지정해 주면 정상적으로 접근이 가능하다. Last login: Mon Apr 12 14:44:03 on ttys001 kygenesis@gwon-yeong-gag-ui-MacBookAir ~ % ssh dra@10.90.101.101 -p 22 Unable to negotiate with 10.90.101.101 port 22: no matching cipher found. Their offer: aes128-cbc,aes192-cbc,aes256-cbc,blowfish-cbc,arcfour kygenesis@gwon-yeong-gag-ui-MacBoo.. 2021. 4. 12.
앱 리커버리 모드 설계 개발 퍼블리싱 다 혼자하느라 죽을뻔... 주말 출근을 몇 번 연속 한거냐 설계대로 작동하는걸 보면 꽤 뿌듯함. 개발하면서 배운 것도 많고. Javafx에 대한 이해도 높아짐. 2020. 8. 27.
Timeout을 걸고, 시간이 지난 뒤에 작업이 필요할 때 : PauseTransition 예를 들어, 새로운 stage를 열고 특정 시간이 지난 뒤에도 떠있다면 닫고 싶을 때라던지, 특정 시간이 지난 후에 작업이 필요할 때 쓰기 위한 객체 PauseTransition 객체 이름만 보면 뭔가 작업 중지에 대한게 필요할 때를 위한 것임을 알 수 있다. 아래와같이 사용한다. private val delay = PauseTransition(Duration.millis(6 * 1000.0)) 6초로 세팅 init { delay.setOnFinished { println("6초 지나쪙") hideLoading() } } 6초가 지나면 로딩화면이 사라지는 함수를 호출한다. fun showLoading(stage: Stage? = null) { if(loading != null){ hideLoading().. 2020. 7. 17.
try ~ catch의 inline, outline 사이에 exception이 발생하는 case 기본 베이스 코드 fun inline() { try { throw Exception("inline exception") throw NullPointerException("inline exception") } catch(e: NullPointerException) { println("inline에서 null pointer exception발생!!") } catch(e: Exception){ println("inline에서 exception발생!!") } } @Test fun outline() { try { inline() } catch(e: NullPointerException) { println("outline에서 null pointer exception발생!!") } catch(e: Exception).. 2020. 7. 15.

티스토리툴바