개인 공간

스크롤 다운 화면 만들시 상단 view 고정 시켜야하는데 보통 stickyHeaderIndices={ [ number ] } 로 고정시킨다.

다만 ScrollView에서 stickyHeaderIndices로 고정하면서 Animated.View로 height, ... 애니메이션 효과 주려할때 

'stickyHeaderIndices style property height is not supported by native animated module' 에러가 발생하면서 애니메이션 효과를 줄수가 없다.

솔루션 코드는 여기에 있다. - https://gist.github.com/BoBinLee/76f13317e135adc16a7eae42fe4aab7e

해결방법은 간단하다.

View를 한번더 감싸고 감싼 View style={{ height: 1 }}을 주면 끝.

원하는 방식대로 동작하는 것을 확인할 수 있다.

import _ from 'lodash';
import { FETCH_READY_COMMENT, FETCH_COMMENT_SUCCESS, FETCH_COMMENT_ERROR,
  ADD_READY_COMMENT, ADD_COMMENT_SUCCESS, ADD_COMMENT_ERROR } from './CommentActions';

const initialState = {
  comments: [],
};

const CommentReducer = (state = initialState, action) => {
  switch(action.type) {
    case ADD_READY_COMMENT:
      return {
        ...state,
        comments: [...state.comments, action.comment]
      };
    case ADD_COMMENT_SUCCESS:
      return {
        ...state,
        comments: _.map(state.comments, comment =>
          (comment.id === action.id ? { ...comment, id: action.newId } : comment))
      };
    case ADD_COMMENT_ERROR:
    default:
      return state;
  }
};

export default CommentReducer;

...

const addCommentReducer = {
  [ADD_READY_COMMENT]: (state, action) => ({
    ...state,
    comments: [...state.comments, action.comment]
  }),
  [ADD_COMMENT_SUCCESS]: (state, action) => ({
    ...state,
    comments: _.map(state.comments, comment =>
      (comment.id === action.id ? { ...comment, id: action.newId } : comment))
  }),
  [ADD_COMMENT_ERROR]: (state, action) => ({
    ...state,
    comments: _.filter(state.comments, comment => (comment.id !== action.id))
  })
};

function createReducer(initialState, handlers) {
  return function reducer(state = initialState, action) {
    if (handlers.hasOwnProperty(action.type)) {
      return handlers[action.type](state, action);
    } else {
      return state;
    }
  };
}

const CommentReducer = createReducer(initialState, {
  ...addCommentReducer,
});

export default CommentReducer;

React Heroku 세팅하는 방법이 아래에 잘 나와있다.

http://revelry.media/tech-talk/2016/2/15/getting-a-simple-react-app-on-heroku

보통 리액트 프로젝트에 적용하려면 webpack -p 에서 not found 에러가 발생하는 데 heroku 기본 환경 세팅이 NPM_CONFIG_PRODUCTION=true 라 false로 바꾸어 줘야 devDependency 패키지도 install 하여 webpack -p 가 잘 동작한다.

끝.

우선 루비 버젼부터 2.0 이상으로 맞추어보자.

http://bigmatch.i-um.net/2013/12/%EB%A9%98%EB%B6%95%EC%97%86%EC%9D%B4-rvm%EA%B3%BC-%EB%A3%A8%EB%B9%84-%EC%84%A4%EC%B9%98%ED%95%98%EA%B8%B0/

대략 이렇다.

rvm을 설치한 후, 그 담에 루비 stable 버젼을 설치하는 방식이다.

단 주의할 점은 apt-get install ruby-rvm 형식으로 설치하는 것이 아니라

https://rvm.io/ 에 있는 가이드 보고  따라 설치하면 된다.

rvm 설치하고 나서 루비를 설치하면 될것이다.

rails 까지 설치를 완료하면 끝.

Requirements installation failed with status: 100. - rvm에서 루비 설치 시 에러

http://stackoverflow.com/questions/20789754/rvm-requirements-error-on-ubuntu-13-10

can't install pg gem - bundle install 시 에러

http://stackoverflow.com/questions/9668753/rails-3-cant-install-pg-gem

레일즈 가이드

http://rubykr.github.io/rails_guides/getting_started.html#Starting-up-the-Web-Server