whatisthis?

REFERENCE SCSS 가이드 SCSS SASS는 CSS pre-processor로서, 복잡한 잡업을 쉽게 해주고 코드의 재활용성을 높여줌. (유지보수 용이) 변수 Variable 선언 CSS에 변수 개념을 도입해줌. 변수 사용시 $기호를 사용. $primary-color: #333; body { background: $primary-color; } Variable Scope 특정 선택자에서 변수 선언시, 해당 선택자 안에서만 접근 가능. 플래그 (flag) 전역 변수 설정시 : !global 기본 값 설정시 (변수가 undefined나 null일때) : !default 플래그는 mixin 작성시 유용하게 사용됨. body { $primary-color: #eee !global; $sub-color:..

참고 문서 My velog Redux 1. 용어 설명 액션 생성함수 (action creator) 단순히 매개변수를 받아와서 액션 객체 형태로 만들어줌. 나중에 컴포넌트에서 더욱 쉽게 액션을 발생시키기 위함. 보통 export 키워드를 붙여서 다른 파일에서 불러와 사용함. 리듀서 (reducer) 변화를 일으키는 함수. state,action 두가지의 매개변수를 받아옴. 현재 상태와 액션을 참고하여 새로운 state를 리턴함. 리덕스에서는 여러개의 리듀서를 만들고 합쳐서 루트 리듀서(Root Reducer)을 만들 수 있음. 참고 useReducer에서는 default:에 throw new Error('Unhandled Action')을 넣지만, 리덕스의 reducer에서는 state를 그..

사실 지난번에 기획했었던 rainy-player. 너무 UI가 유치하고 (...) 맘에 들지 않아서 초반에 다시 갈아 엎었던 프로젝트이다. 처음 기획안 그리고 제작 과정(?) 은 링크 참조! Rainy player 나는 평소에 잠이 오지 않으면 비소리를 듣고는 한다. 그래서 내가 좋아하는 빗소리를 틀어주는 rain sound player app을 만들면 좋겠다고 생각했고, 기획을 하기 시작했다. 처음 기획안 위와 같이 나무가 보이고, 빗소리를 들을때마다 나무가 점점 자라도록 하는 컨셉으로 구상했었다. 그런데, 뭔가 심심한 느낌이 들고 디자인이 중요한 것 같아서 기능을 이것저것 고민하게 되었다. 그래서 탄생한 새로운 버전! NEW! Rainy Player 빗소리 플레이어인 것은 동일하지만, UI가 조금 더..

styled-components 공식 문서 styled-components = css in JS. 스타일 정의를 CSS파일이 아닌 JS 컴포넌트에 바로 삽입하는 기법. 웹페이지를 HTML/CSS/JS로 분리하는 것이 아닌, 여러개의 컴포넌트로 분리하고, 각 컴포넌트에 각각의 HTML,CSS,JS를 내장하는 방식으로 작성. styled-components 설치 $ yarn add styled-componentsSYNTAX styled 함수를 임포트. styled 함수는 HTML 태그 또는 리액트 컴포넌트에 스타일을 적용함 HTML Element styled.button` // style `; React Component styled(Button)` // style `; 두 문법 모두 ES6 Tagged T..