진행사항

  • 메인 페이지
  • 홈 설정 페이지
  • 게시판 페이지

소스코드는 깃 허브 에서 보실 수 있습니다.

메인 페이지

  • 즐겨찾는 게시판, Hot 게시물, 실시간 인기글 보여주기
  • 홈 화면 설정 페이지로 이동(link)
  • 게시펀 더 보기로 게시판 페이지 이동(link)
  • Dummy Date가 아닌 서버에서 데이터 받아서 보여주기

홈 설정 페이지

  • 홈 화면에 보여줄 게시판 chekbox 만들어 제어하기
  • Dummy Date가 아닌 서버에서 데이터 받아서 보여주기

게시판 페이지

  • 게시판, 진로, 홍보 페이지 보여주기
  • 게시판 간 slider를 활용해 이동하기
  • 게시판 링크를 통해 게시판 이동
  • 내부 게시판 화면은 만들기
  • Dummy Date가 아닌 서버에서 데이터 받아서 보여주기

느낀 점

헷갈렸던 부분

  • return 을 해줄 때 self-closing Tag를 하나만 쓰는 경우가 아니라면 꼭 ()를 사용해 열고 닫아줘야 한다. js를 잘 쓰지 않아 바보 같은 곳에서 헤매었다 ㅜ

틀린 방법 - 컴파일은 되지만 파일이 열리지 않는다.

return <div className="hello">hello jisoo</div>;

가능한 방법 - 사용 가능하지만 권장되지 않는다.(훗날 리팩토링시 발견하기 힘들 수 있다.)

return <img className="hello-img" src={helloImg} />;

권장되는 방법 - self-closing 하지 않고 사용하는 방법이 권장된다.

return (
  <img className="hello-img" src={helloImg}>
    {" "}
  </img>
);

부족한 부분

  • 미완성 부분 먼저 할께요 …
  • Dummy Date를 사용하는 것도 있지만 전체적인 구조가 잘 정립 되어 있지 못해 중복 코드가 많이 발생하고 있어 refactoring 을 통해 component로 뽑아내여 구현 할 생각입니다.

후기

  • backend 개발 경험만 갖고 있다가 GDSC를 통해 front 개발을 해보고 있는데 너무 부족하다고 느끼고, css 하시는 분들 존경하게 되었습니다.
  • Back은 더 열심히 하자 ㅎㅎ