-
Notifications
You must be signed in to change notification settings - Fork 4
Week3 개발일지
Zin0_0 edited this page Dec 4, 2020
·
17 revisions
2020-11-30
기존 API 명세에 하기 항목 추가(name, type, description) (insanehong멘토님 피드백 반영)
- Request Description
- Response Description
.vscode/setting.json에
"eslint.workingDirectories": [
['./client','./server']
]를 추가해주면 해결된다.
root/
client/
.eslintrc.js
server/
.eslintrc.js
현재 폴더구조가 위와같고 working directory가 root라서 발생한 에러 같다.
['./client','./server'] 옵션을 주면 working directory가 client내에서는 client로 server 내에서는 server로 바뀌어서 각각에 맞는 lint가 적용된다.
CRLF 관련 문제.
eslint rules에 다음 문구를 추가해주면 된다.
rules: {
'prettier/prettier': [
'error',
{
endOfLine: 'auto',
},
],
},lintOnSave:false
// chainWebpack: (config) => {
// config.module.rule('eslint').use('eslint-loader').tap((options) => {
// options.fix = true;
// return options;
// })
// }
include: {
model: models.section,
include: {
model: models.task,
where: { isDone: false, parentId: null },
include: ['priority', 'labels', 'alarm', 'tasks'],
required: false,
},
},include 객체에 where 절이 포함돼있을 경우 required:true 가 기본값으로 설정된다(inner join)
required: true 옵션으로 left outer join
- store를 모듈로 분리 *
- api 모듈화
- Axios 모듈화(customized)
- router params는
this.$router.params.id로 가지고 오면 된다. - computed
- computed의 내부 로직의 값이 변경될 때만 재실행시켜준다.
- 메모이제이션 느낌
- 추후 스터디 필요
weak self는 만능이 아니다. 필요한 경우에만 사용하자.
토니
수업 때 vue js 언급했는데 자랑을 못했다. 오늘 공부했으니 담엔 자랑해야지.
페어프로그래밍으로 vue js 틀을 잡았다. 내일부터 빠른개발 !
찐
밤에 잠을 제대로 못자서 집중력이 많이 흐트러졌다.
그래도 팀 활동하면서 페어프로그래밍, 이슈 작성, vue 셋팅 등 많은 걸 했다.
vuetify를 조금 더 공부해서 빠르게 개발하고싶다 !!!
리팩토링이랑 남은 API 는 언제하지..??
카일
커밋을 미리미리 하자! ( ㅋㅋ )
페어프로그래밍 하며 혼자 짜면 놓쳤을 부분들을 많이 배운 것 같다
파인애플
너무 피곤한 하루였다 ㅠㅠ 컨디션이 점점 나빠지는 게 느껴진다... 딱 3주 남았는데 버텨줄 수 있겠지??
디퍼블이 너무 말을 안 듣는다... 스트레스 ㅠㅠ
드래그 앤 드랍 하면서 알고리즘의 필요성을 많이 느낀다. 진짜 꾸준히 틈틈히 열심히 해야겠다.
오늘 멘토님께서 아주 자세하게 피드백을 해주셨다. 공통 피드백 부분이 뭔가 다 우리 얘기 같아서 비수가 꽂히는 느낌..
그래서 커널하고 컨벤션부터 그라운드 룰을 싹 새로 정했다. 확실히 통일되게 맞추니 가독성도 올라가고 깔끔해보인다 아주 좋다!! 🙏
[weak self]에 대해 다시 생각해보게 되었다. 사실 캡쳐리스트는 봐도 봐도 잘 이해가 안 가서 자신없으면 [waek self]라는 말을 듣고
습관적으로 사용하고 있었는데 멘토님께서 날카롭게 지적해주셨다.
한 번도 "weak self 써서 문제가 되는 경우는 없을까?"를 깊이있게 고민해보지 못했던 것 같다.
공부를 좀 해보니 경우에 따라 제대로 동작하지 않을 수도 있을 것 같다. 확실히 구분해서 사용할 필요가 있어보인다.
캡쳐리스트 지식이 + 0.5 정도 된 것 같다.. 정진 또 정진... 🧗♀️
커널
그래도 뷰가 괜찮게 구현되는 것 같아 기분이 죠타
근데 힘들다...ㅎㅎ 제발 빨리 시간이 갔으면 좋겠지만 연말이라 빨리 안갔으면 좋겠다~
2020-12-01
- 이미 contoller에 많은 기능이 구현된 후, 리팩토링을 진행하는데 조금 버거웠다.. 리팩토링을 진행하면서 테스트 코드의 중요성을 다시 느꼈다.
- 잘 작성된 test code인 경우, 테스트를 돌리면서 어떤 부분을 수정해줘야하는지 쉽게 발견할 수 있었다.
- test code도 리팩토링이 필요했기 때문에, test code 리팩토링 -> controller에서 비즈니스 로직을 service로 분기 -> controller에서 하위 역할을 따로 분기하는 과정으로 리팩토링을 진행했다.
- 순차적으로 리팩토링을 진행하면서, 중간중간 오타나 잘못된 로직을 test code덕에 쉽게 발견할 수 있었다.
- Vuetify의 장점을 느꼈다. 스프린트 때 처럼 바닐라 스크립트로 하나하나 만드는 것도 구조를 이해하고, 로직을 내가 이해하기 쉽게 구성하는 것도 좋지만, 도구를 쓰니까 생산성이 매우 높아졌다.
-
v-autocomplete를 사용하면서, vue의 computed를 통해 API에서 받아온 값을 캐싱해서 여러 번 호출하지 않도록 할 수 있다는 것을 배웠다. 또한, watch가 데이터(HalgoraeDO의 검색 입력값) 변화를 감지하고, 비동기 조작을 요구할 때 쓰인다는 것을 알 수 있었다. - 스프린트 때는, 학습 이후 구현 순서였는데 구현과 동시에 학습하니까 나름 신선하고 재밌다.
-
- API를 많이 만들다보니까, 어떤 로직으로 어떻게 만들어야하는지 몸에 익숙해지는 것 같아서 좋았다 !!
찐
알찬 하루였다 !! 어제 컨디션이 좋지 않아서 팀원들에게 많이 미안했는데, 오늘 많은 작업을 해서 다행이다 ㅎㅎㅎ
그리고 vue에 대해 이해도가 조금 향상된 것 같다.
내일도 남은 백엔드 리팩토링 작업이랑 클라이언트 컴포넌트 작업 열심히 합시다!!!
우리 팀원들 항상 너무 고맙고 마지막까지 열심히 해봅시다!!!
파인애플
어제 넘 피곤했는데 개발 진행이 잘 안된 탓도 꽤 컸던 것 같다.
오늘은 진도가 좀 팍팍 나가서 재밌게 개발했다. 힘들지만 재미도 있고 보람도 있다.
3주 후에 웃을 날을 생각하면서 오늘도 내일도 불태운다 🔥
토니
메뉴를 다 끝내려고 했는데 절반도 못했다. 내 개발속도가 느리다는 생각이 든다.
commit을 하나하나 해가면서, 정리하면서 해서 그렇다고 생각하자!
커널
메뉴 뷰 시작했다! 그리고 drag & drop은 제발 끝내버리고 싶다...
편한것 같으면서도 편하지 않은 디퍼블 다타소스....
그래도 조금씩 익숙해지는 것 같다!
내 로컬 환경은 맨날 더럽지만 메인 프로젝트는 깔끔하게! 가끔 print섞여 들어가는건 비밀..
2020-12-02
동일한 route에 params만 바뀌는 router 전환이 있을때 리렌더링이 안되는 문제가 있었다.
ex) /project/1 => /project/2로 전환시
export default {
components: { ProjectContainer },
methods: {
...mapActions(["fetchCurrentProject"]),
},
computed: mapGetters(["currentProject"]),
created() {
this.fetchCurrentProject(this.$route.params.projectId);
},
};해당 컴포넌트의 created()는 한번만 일어나고 이 lifecycle에서만 fetch가 일어났다. 전환시에는 fetch가 다시 되어야 하는데 created()에만 걸려있기 때문에 되지 않은 것.
beforeRouteUpdate(to, from, next) {
this.fetchCurrentProject(to.params.projectId);
},해결 : router의 lifecycle에 beforeRouteUpdate라는 게 있었다. 이를 활용해서 route가 update가 있을때마다 fetch를 해주는 로직을 추가했다.
store의 getter로 받아온 data가 초기상태가 undefined 인 경우 console에 error가 났다.
ex) cannot find id of undefined
데이터를 사용하는 v-if로 해당 getter를 적어주면 error가 사라졌다.
커널
메뉴 뷰.. 간단한것 같았는데 헤멨다....
섹션을 위에는 없애고 싶어 투명도 주고 높이도 0으로 해보고... 근데 cell없다고 앱이 난리가 났다...
그래서 한참 섹션 헤더 없애는걸 찾아보다가 안되서 멍때리고 있었는데
그때... 그럼 섹션을 그냥 안주면 되지않나? 하는 생각에 바로 해봤더니 바로 잘 된다.......
오늘 느낀건 안될땐 잡아끌지말고 다른 방법을 생각해보던가 멍때려봐라! :)
찐
어제에 이어서 많은 작업을 했다.
백앤드 1차 리팩토링을 끝냈고, 작업 상세 화면 라우팅과 모달창을 띄우는데 까지 성공했다.
간단한 작업 같으면서도 꽤나 오랜 시간이 걸렸다.. 뷰의 라이프 사이클에 대해 조금 더 공부해야할 것 같다.
파인애플
마스터 클래스 시간에 코드 리뷰를 받았다. 주로 예상했던 부분을 지적 받았다 ㅠㅠ
뷰 설정해주는 코드가 뷰컨에 나와있으면 얼마나 지저분해 보이는지 다시한번 느낄 수 있었다.
안 그래도 별도의 뷰로 분리하고 있던 찰나에 제대로 리뷰를 받았다 ㅎㅎ
뷰로 분리하고 코드를 날릴 때 쾌감이 있다 🥰 빨리 개발하고 리팩토링!!
코어데이터 학습을 좀 했다.
ManagedObject를 그냥 쓸지 아니면 변환해서 써야할지 사이에서 엄청난 고민이다..
2020-12-03
- 각 컴포넌트마다 책임을 분할해서, 각자의 책임만 갖게 지금처럼 유지하면 좋을 것 같다.
- Axios의
Axios Interceptor를 활용해서 편하게 사용할 수 있다고 하셨다. 조금 더 알아보고 공부해봐야겠다.
- 시스템을 사용하기 위한 인프라(데이터 관련 X)
- 데이터를 어떻게 저장하고 사용할건데?? 에 관련된 내용들은 비즈니스 로직이니까, 서비스 로직에서 담당하자
- 데이터에 관련된 Validation Check 또한 비즈니스 로직에서 담당
- 컨트롤러에서는 클라이언트로부터 받은 정보가 맞는지, 타입은 적절한지 정도만 체크
찐
3일 내내 조금 달렸더니 힘이 들었다..
routing을 설정해주는 과정도 꽤나 힘들었고, 데이터가 fetch되고 생성되는 지점을 파악하고 마운트되기까지 어떤 과정을 거치는지 전반적인 라이프 사이클에 대한 고민과 공부를 많이했다. 결론적으로는 데이터에 관련된 내용은 탬플릿이 생성되기 전에 완료돼야한다고 생각해서 async & await을 걸어뒀지만, 더 좋은 방법이 있는지는 더 확인해봐야겠다.
새롭게 구현한 작업이 많지는 않았지만, 컴포넌트를 분리하고 책임을 분기하는 등 리팩토링 작업이 많았고 좋은 사이클을 만드는 것에 대해 집중해서 대체적으로 만족한다.
새로운 기능 구현으로 힘들 것은 다음 주의 나... ㅎㅎㅎ
다음 주에는 못다한 백엔드 API와 Validation 체크 분기 & 수정 & 생성 작업도 같이 해야겠다..
다 재밌는데 시간이 너무 부족하다..(?)
파인애플
힘들다 이번주...