함수형 프로그래밍- reduce함수function _reduce(list, iter, memo){ if(arguments.length == 2){ memo = list[0]; //slice는 array만 사용가능 list = list.slice(1); } _each(list,function(val){ memo = iter(memo,val); }); return memo; } console.log( _reduce([1,2,3], add, 0)); //6 memo = add(0,1); memo = add(memo, 2); memo = add(memo, 3); return memo;reduce는 말 그대로 축약하는 함수이다. (재귀)개발자가 고민을 덜하게한다.쉽게 코딩을 할 수있다. console.lo..
ES6-Filter, includes, from을 사용해서 문자열 'e'가 포함된 배열을 만들어서 반환하기 Filter,includes,from을 사용해서 문자열 'e'가 포함된 배열을 만들어서 반환하기 test apple orange banana strawberry function print(){ /* filter, includes, from을 사용해서 문자열 'e'가 포함된 노드로 구성된 배열을 만들어서 반환하기 */ let list =document.querySelectorAll("li"); let listArray = Array.from(list); let eArray =filter(function (v){ return v.innerText.includes("e"); }) return eArray..
React-google analytics 달기 > ReactGA npm 사용하기 https://milooy.wordpress.com/2016/01/14/google-analtyics-2-google-tag-manager/ 참고 import React from 'react'; import ReactDOM from 'react-dom'; import { Provider } from 'react-redux'; import { ConnectedRouter } from 'react-router-redux'; // import { BrowserRouter } from 'react-router-dom'; import { AppContainer } from 'react-hot-loader'; import creat..
Ruby on rails - 구글 계정 연동 로그인 구현하기 아래 실습은 devise gem이 설치되었다고 가정하고 진행되니, 참고바랍니다. > 1. google developer 에서 프로젝트 생성하기 https://console.developers.google.com 에서 프로젝트 생성 Create Credentials 을 누르고 OAuth client ID. 눌러서 web-application으로application type을 선택한다.authorized redirect URL에 http://localhost:3000/users/auth/google_oauth2/callback을 추가해준다. 그렇게 되면 아래와 같은 창이 뜨게 되는데 그 text들을 복사해두자! > 2. omniauth -googl..
CSS: 레일스 프로젝트에서 scss 파일적용으로 클래스명명, 반복된 코드줄이기 >css파일을 적용하다보면, 명명규칙이나, 다른 뷰파일에 같은 css가 적용되는등의 문제점들이 많이 발생하게된다. 이를 해결하기 위한것이, scss이고 레일스는 scss를 프로젝트를 만들면 뷰파일에관한 스타일링을 scss로 기본으로 제공하기 때문에 레일스 프로젝트에서 scss파일 적용하기를 활용해보자. 이승규 컴퓨터공학과 15 "쌰럽. 펔유" -home/index.html.erb .var-highlight{ color: #C0AD60; font-family: 'courier new'; } .string-highlight{ color: rgba(253, 149, 90, 0.8); font-family: courier; } ..
CSS: Sass란 ? >Sass란? CSS를 효율적으로 작성할 수 있도록 도와주는 프로그램이다.기존의 CSS의 유지보수의 불편함 등을 SASS를 사용하면 해결 할 수 있다. 위에서 언급한 CSS의 단점을 보완하기 위한 기술로, SASS 자체를 그대로 사용할수는 없고, SASS의 문법에 맞게 SASS파일을 만들면 컨버터를 이용해서 CSS를 생성한다. 즉, SASS문법에 맞게 CSS를 작성하고, SASS 컴파일러를 사용하여 HTML이 이해 할 수 있는 문법으로 변환합니다. >Sass의 장점 1.코드중복을 줄일수 있다. SASS 사용 전 코드 (코드가 복잡할수록 더 유지보수가 어려워 집니다.) #navbar { width: 80%; height: 23px; }#navbar ul { list-style-typ..
React-Link to로 화면전환시 맨위로 스크롤가게하기 >Link to를 활용해 화면전환을 할때, 아래쪽에서 버튼을 눌러 하면 그대로 아래에 위치해서, ux상에 좋지 않은 경우가 있다. 그럴땐 아래와 같이 해주면 된다. window.scrollTo(0, 0)} history={createBrowserHistory()}> ... 위의 설정으로도 되지 않는다면, componentDidMount를 바꿔주면 된다.아래와 같이 설정해주면된다.:componentDidUpdate() { window.scrollTo(0,0); }