Giter Club home page Giter Club logo

-nomad's Introduction

Nomad 배포 바로가기

팀 소개

장은진 김율민 김준형 이주영 최지희
팀장

역할분담

장은진

  • 내 체험등록 페이지
  • 내 체험수정 페이지
  • 드랍다운

김율민

  • 예약현황페이지
  • 로그인 액세스토큰, 리프레시 토큰처리
  • 캘린더
  • 다크모드 추가
  • 사이드바,레이아웃

김준형

  • 내정보
  • 예약 내역
  • 내 체험 관리
  • 404 페이지
  • 알림 토스트

이주영

  • 체험 상세 페이지
  • 로그인, 회원가입 페이지
  • 헤더, 푸터

최지희

  • 메인페이지
  • 모달/버튼 공통 컴포넌트
  • 로고 디자인

🔨 사용 기술 및 도구

배포

개발

협업

ESLint Prettier GitHub Visual Studio Code Discord


폴더 구조

public
├── assets
│   └── icons
│   └── images
│       └── button-icon.png
│ 
src
├── apis 
├── types // 타입 지정 관련 파일(Props 타입은 해당 컴포넌트 상단에 지정)
├── components 
│   └──Layout
│   └── Input
│       └── Input.tsx
├── store // 전역 상태 관리
├── constants
│   └── userContext.ts
├── pages 
│   └── DashboardPage
│       └── DashboardPage.tsx
├── styles
│   └──GlobalStyle.css
├── utils  
│   └── calculateDate.ts
├── hooks  
    └── useHook.ts



✨ 서비스 주요 기능

📄 메인화면

📄 로그인&회원가입 페이지

📄 체험상세 페이지

📄 내정보 페이지

내정보

예약내역

내 체험관리

예약현황

 - 캘린더(리액트캘린더 라이브러리사용)
 - 캘린더모달(get, post, patch API를 사용하면 데이터 변화 실시간반영) *무한스크롤기능추가



💡 문제 및 해결

1️⃣ 문제 : 캘린더 모달을 열때 모달의 데이터가 갱신되기전에 모달이 열려서 화면이 깜빡이는 문제가있었음.

💡 해결

  • 리액트 쿼리의 isfetching 을 모달 컴포넌트 랜더링의 조건부로 붙여줘서 해결

2️⃣

💡 해결


🗒️ 팀 회고

김율민

  • 프로젝트를 시작할때 사용할 기술스택에 대한 충분한 사전공부가 안되었던거같다. 공부하는데 시간을 많이썼다. 특히 캘린더를 만드는데 있어서 확실한 방향을 정하지못하고 이것저것 시도하다가 시간을 많이 잡아먹혔다.
    또, 프로젝트의 방향성이나 주제가 내가 원했던방향과 많이달라서 적극적으로 팀을 이끌기보다는 팀의 요구사항에 집중하는 수동적인 태도를 취했는데 프로젝트 일정관리가 안되거나 부족한 마무리를 생각하면 아쉬운부분이다. 좀더 적극적으로 주도했어야했지않나라는 생각이든다.

장은진

  • 초반에 서로 진행상황 공유가 잘 안되고 소통이 부족했던 거 같다. 이로 인해 프로젝트 진행이 더뎠지만, 후반에 가서는 서로 진행상황을 자세히 공유하고 소통하면서 프로젝트 진행이 원활히 됐다. 기술 스택도 중요하지만 이런 커뮤니케이션도 팀 프로젝트 진행에 중요한 부분이라는 걸 깨달았다.





Q & A







-nomad's People

Contributors

jihee1103 avatar eundin avatar yulmai999 avatar 2zzzyoung avatar jjunhyuki avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.