React

• useReducer
  まとめて状態管理ができる。
  一部抜粋

 const [emailState, dispatchEmail] = useReducer(emailReducer, {
    value: '',
    isValid: null,
  });

const emailReducer = (state, action) => {
  if (action.type === 'USER_INPUT') {
    return { value: action.val, isValid: action.val.includes('@') };
  }

  if (action.type === 'INPUT_BLUR') {
    return { value: state.value, isValid: state.value.includes('@') };
  }
  return { value: '', isValid: false };
};

• useContext
  これは結構やったので感覚的に分かってきた。
  一部抜粋

const AuthContext = createContext({
  isLoggedIn: false,
  //   ダミー関数をおいておくとオートコンプリートが効くので便利
  onLogout: () => {},
  onLogin: (email, password) => {},
});

export const AuthContextProvider = (props) => {
  const [isLoggedIn, setIsLoggedIn] = useState(false);

  // 初回レンダリング時にローカルストレージからログイン情報を取得。
  // あればログイン管理をtrueに
  useEffect(() => {
    const storedUserLoggedInInformation = localStorage.getItem('isLoggedIn');

    if (storedUserLoggedInInformation === '1') {
      setIsLoggedIn(true);
    }
  }, []);

  const logoutHandler = () => {
    localStorage.removeItem('isLoggedIn');
    setIsLoggedIn(false);
  };

  const loginHandler = () => {
    localStorage.setItem('isLoggedIn', '1');
    setIsLoggedIn(true);
  };

  return (
    <AuthContext.Provider
      value={{
        isLoggedIn: isLoggedIn,
        onLogout: logoutHandler,
        onLogin: loginHandler,
      }}
    >
      {props.children}
    </AuthContext.Provider>
  );
};

export default AuthContext;

オブジェクトなんかもContectに入れられるから何でもできそうだけど、
stateの変更が頻繁に行われるものでは使わないそうな。
createContext
Provider
valueで渡す
このあたりがポイント。
後はProviderでラッピングした中身を{props.Children}で渡すとか

• antd
  コンポーネントのスタイルは{{}}で結構制御できる
  こちら記事化予定

• react-router
  チョット遊んでみました。
  こちらもantdと合わせて記事予定。
  記事用にきちんとルーティングしようとすると大変。
  ルーティング苦手。

• Redux
  トラハックさんのRedux基礎講座終了。
  動きがだいぶ終えるようになった。
  実践編やるかは不明。今はtoolkitがあるし。
  でもfirebaseもやってくれてるし、凄く良さそうなのよね。

JavaScript

• 基本構文おさらい
  forとかオブジェクトの事とか
• CSSについてもやった
  これは全然知らない事ばっか。

振り返り

初日は中々エンジンがかからず、だらけ気味になってしまった。
夏休みはReduxでtodoくらいは作りたい。いや、作る
CSSもしっかりフレームワーク当てて、ポートフォリオと言えるレベルの物を