Open lekosk2001 opened 1 year ago
UI 메모
구현 페이지는 아래와 같습니다.
1. 유저 관련
1-1. 회원가입 폼 화면 1-2. 로그인 폼 화면
2. 홈 화면 및 글로벌 스타일
3. 운동설비 페이지
3-1. 리스트 화면 (카드 리스트 / 검색기능) 3-2. 운동설비 추가/수정 화면
4. 자기관리 페이지
4-1. 리스트 화면 (가계부리스트, todo리스트 및 달력) 4-2 .작성/수정 화면
상의 하면서 프로젝트 구조 및 공통 컴포넌트 잡아가면 좋을거 같습니다.
그리고 제 경험상 UI작업 하면서 동시에 리덕스 initialState에 더미 데이터 대략적으로 작성해두면 백앤드 분들과 소통이 더 원할하게 되면서 작업이 수월해지는거 같습니다.
const initialState = {
facilities: [
{
id: 1,
address: '123 Main St',
location: {
lat: 37.7749,
lng: -122.4194
},
description: 'Beautiful park with playground and picnic area',
type: 'Park'
},
{
id: 2,
address: '456 Maple Ave',
location: {
lat: 37.7833,
lng: -122.4167
},
description: 'Indoor gym with weights and cardio equipment',
type: 'Gym'
},
{
id: 3,
address: '789 Oak St',
location: {
lat: 37.7749,
lng: -122.4312
},
description: 'Historic theater with live performances',
type: 'Theater'
}
],
daywork: [
{ id: 1, title: 'Finish project proposal', content: 'Research and write up proposal for new project', completed: false },
{ id: 2, title: 'Attend meeting with team', content: 'Discuss progress and plan for next steps', completed: true },
{ id: 3, title: 'Update website content', content: 'Write and publish new blog post', completed: false }
],
accounting: [
{ id: 1, type: 'expense', account: 'Office Supplies', amount: 25.00 },
{ id: 2, type: 'earning', account: 'Client Payment', amount: 500.00 },
{ id: 3, type: 'expense', account: 'Advertising', amount: 100.00 }
],
user: {
name: 'John Doe',
email: 'johndoe@example.com'
},
loading: false
}
위의 내용 확인하였습니다. ui 구현 들어가게되면 해당 데이터를 바탕으로 진행하겠습니다.
차후 initialState에 다른 state를 추가할 시점이 있을까요? 아니면 기획단계에서 처음에 잘 잡고 진행하는게 더 좋을까요?
보통 글로벌 스타일은 어떤 순서로 진행하시나요?
지금 프로젝트가 어떤 시점에 있나요? (제가 지금 어떠한 롤이 주어진 것인지 조금 구체화하고싶습니다.)
메인화면, 운동설비 화면입니다. :) (아이콘이 들어갈 곳은 아직 비워두었습니다.)
피그마
와이어프레임(https://www.figma.com/file/ipVxC7za24yRPddogxsZ8y/What-a-Chad-Project-wireframe?node-id=0%3A1&t=O1N7WLd4fJ0sQpkX-0)