React Project_0321로 Node_bird 빌드하기

by

화면 구현(로그인 폼 & 프로필 페이지 & 회원가입 페이지)

  • 로그인 폼 화면 구현 (antd의 Form , Button , Input 컴포넌트로 구현)

  • 더미 데이터로 로그인 구현

  • 스타일링 방법

    • 스타일이 지정된 구성 요소로 스타일 지정
    • styled-component를 사용하지 않고 useMemo()로 스타일 지정

  • 프로필 페이지 구현(antd의 아바타, 버튼, 카드 컴포넌트로 구현)

    '추천 관련글,
    • NicknameEditForm 컴포넌트 생성 및 구현(Antd Form 및 Input 컴포넌트 사용)
    • FollowList 컴포넌트 생성 및 구현(antd Button, Card, List 컴포넌트, @ant-design/icons StopOutlined 사용)

  • 회원가입 페이지 구현 (antd의 버튼, 체크박스, 폼, 입력 컴포넌트로 구현)

  • ustState 및 useCallback의 공통 구조 => useState 및 useCallback을 결합한 사용자 정의 후크 useInput 생성 및 적용 

    import { useState, useCallback } from "react";

export default (initValue = null) => {
const (value, setter) = useState(initValue);
const handler = useCallback((e) => {
  setter(e.target.value);
}, ());
return (value, handler);
};