export const HOME = '/';

  //Users
  export const SIGN_UP = '/signup';
  export const SIGN_IN = '/signin';
  export const ACCOUNT = '/account';
  export const PASSWORD_FORGET = '/pw-forget';

  //Boards
  export const BOARD_LIST = '/board-list';
  export const BOARD_CREATE = '/board-create';
  export const BOARD_DETAIL = '/board-detail';

const Navigation = () =>
    <div>
        <ul className={styles.navMenu}>
            <li className={styles.menuButton}><Link to={routes.HOME}>Home</Link></li>
            <li className={styles.menuButton}><Link to={routes.BOARD_CREATE}>Create</Link></li>
            <li className={styles.menuButton}><Link to={routes.ACCOUNT}>Account</Link></li>
        </ul>
    </div>;

  class WithAuthentication extends React.Component {

      ...

      componentDidMount() {
          firebase.auth.onAuthStateChanged(authUser => {
              authUser
                  ? this.setState({ authUser })
                  : this.setState({ authUser: null });
          });
      }

      render() {
          const { authUser } = this.state;
          return (
              <AuthUserContext.Provider value={authUser}>
                  <Component {...this.props} />
              </AuthUserContext.Provider>
          )
      }
  };

  export default withAuthentication(App);

import React, { Component } from 'react';
import { storage } from '../firebase';

class BoardImage extends Component {

    componentDidMount() {
        storage.getImageUrl(this.props.url, this.props.name)
    }

    render() {
        return <span id={this.props.name}></span>;
    }
}

export default BoardImage;

class BoardDetail extends Component {

    ...

    componentWillMount() {
        ...

        //DB에서 해당 게시글 가져오기
        db.getBoardDetail(id).then(doc => {
            if (doc.exists) {
                this.setState({
                    detail: doc.data(),
                    key: id,
                })
            } else {
                console.log("No such document!");
            }
        }).catch(function(error) {
            console.log("Error getting document:", error);
        });

        ...
    }

    //게시글 삭제
    _deleteBoard() {
        const _this = this;
        const boardKey = this.state.key;
        const imageName = this.state.detail.imageName;
        const listWrap = document.getElementById('commentList');

        if(!window.confirm("정말 삭제하시겠습니까?")) return false;

        if (!boardKey) return false;

        ...

        //삭제 process 완료된 후 홈으로 이동
        Promise.all([deleteBoard, deleteImage, deleteComment]).then(() => {
            _this.props.history.push("/");
        });
    }

    render() {
        const {
            nickname,
            title,
            description,
            rating,
            tags,
            imageName,
            dateWithFormat,
        } = this.state.detail;
        const boardkey = this.state.key;
        const authorCheck = this.state.authorCheck;

        return (
            <div className={styles.boardBackWrap}>
                <div className={styles.layerTop}>
                    <Back />
                    {authorCheck &&
                    <button onClick={this._deleteBoard}>삭제</button>
                    }
                </div>
                <div className={styles.boardBoxWrap}>
                    <div className={styles.detailInfoWrap}>
                        <div className={styles.imgWrap}>
                            {imageName &&
                            <BoardImage url={imageName} name={imageName} />
                            }
                        </div>

                        ...

                    </div>
                </div>
            </div>
        );
    }
}

const authCondition = (authUser) => !!authUser;
export default withAuthorization(authCondition, BoardDetail);

import { auth } from './firebase';

// Sign Up
export const doCreateUserWithEmailAndPassword = (email, password) =>
    auth.createUserWithEmailAndPassword(email, password);

// Sign In
export const doSignInWithEmailAndPassword = (email, password) =>
    auth.signInWithEmailAndPassword(email, password);

// Sign out
export const doSignOut = () =>
    auth.signOut();

// Password Change
export const doPasswordUpdate = (password) =>
    auth.currentUser.updatePassword(password);

// 현재 로그인한 사용자 체크
export const currentUserCheck = () => {
  const user = auth.currentUser;
  if (user !== null) {
    return user.email;
  }
}

class ScrollToTop extends Component {
  componentDidUpdate(prevProps) {
    if (this.props.location !== prevProps.location) {
      window.scrollTo(0, 0);
    }
  }

  render() {
    return this.props.children;
  }
}

export default withRouter(ScrollToTop);

const App = () => (
  <Router>
    <ScrollToTop>
      <App/>
    </ScrollToTop>
  </Router>
)

componentDidUpdate(prevProps) {
    if (this.props.location.pathname !== prevProps.location.pathname) {
        window.scrollTo(0, 0)
    }
}

//특수문자 정규식 체크
const regx = /[[\]\\/?.,;:|)*~`!^\-_+<>@#$%&=('"]/gi;
if(regx.test(tag.text)) {
    alert("특수문자를 포함한 태그는 입력할 수 없습니다.")
    return false;
}

tag.id = encodeURIComponent(tag.id); //encode uri