질문리스트 작업 #92

Lavegaa · 2020-12-02T15:50:08Z

작업된 사항

질문 리스트 추가
질문 추가
질문 업데이트
모달작업

모달 사용하기 편하게 만들어뒀습니다. ModalWrapper를 통해 가운데 정렬과 배경 클릭 시 꺼지는 작업 해뒀습니다.

TODO

로그인 시 유저 정보 세션 스토리지에 저장 후 로그인 체크

- 이미지 use-select: none;은 추가해야할 것들이 있음 - 상 하단 로고, 나가기 포지션을 고정해놓고 미디어태그로 height에 따라 사라지게 만들어둠 - 좀 더 좋은 방법이 생각나면 수정해야 할듯 - 상태는 redux로 변경해야 함

TODO - redux dispatch 비동기작업 - input bar conflict잡기 - 질문 리스트 삭제 - 질문 삭제 - 이동 관련 순서 저장하기

Lavegaa · 2020-12-02T15:51:05Z

src/components/AuthRoute/AuthRoute.js

  const authSelector = useSelector(get('auth'));
+  useEffect(() => {


세션에 로그인 결과를 저장했습니다.
해당 401 시 로그아웃 처리도 추가돼야 할 것 같습니다.

네네 확인했습니다. 감사합니다! 401 상태인걸 알기위해 api 요청하는 부분이 추가되는 걸까요?

어떤 패턴으로 갈지는 잘 감이 안잡히네요. 각자 api사용하는 부분에서 예외처리를 해야하기엔 너무 중복코드가 많아 질 것 같은데 다른 방법이 딱히 떠오르지가 않네요... repository단에서 가능하려나요...

Lavegaa · 2020-12-02T15:52:06Z

src/components/InputBar/InputBar.js

@@ -21,10 +21,10 @@ const Wrapper = styled.input`
 `;

 export default function InputBar({
-  className,
+  className, placeholder, value, onchange,


이부분 필요해서 수정했었는데 용재님이 따로 수정하셨더라고요. 추후에 머지하기 전에 conflict잡곘습니다.

네네 맞습니다 협업이다보니 마스터에 PR이 반영될 때마다 머지하면 좋을 것 같아요!

안녕하세요 @dididy 님.
마스터에 PR이 반영될 때마다 머지하면 좋을 것 같아요! 가 어떤 의미인지 제대로 이해를 하고 싶어서 질문드립니다. @Lavegaa 님이 말씀하신 것처럼 머지할때마다 conflict를 잡는 작업을 말하신 걸까요?

단순히 conflict를 잡는 것을 넘어서 마감에 가까워지고있기 때문에 마스터의 변경점을 계속 반영하면서 작업해야 서로 빠르게 대응할 수 있다고 생각했습니다.

Lavegaa · 2020-12-02T15:52:56Z

src/components/Modal/Modal.js

-      { isShow && modalList[modalName] }
+      { isShow
+      && (
+      <ModalWrapper modalName={modalName}>


ModalWrapper를 만들어서 가운데정렬과 배경 클릭 시 모달 꺼지는 기능을 만들었습니다.

아하 네넵 알겠습니다. 어떻게 동작하는지 이해했습니다.

오,,추가해주셔서 감사합니다!

Lavegaa · 2020-12-02T15:54:33Z

src/components/Modal/Modal.stories.js

+
+const modalReducer = createSlice({
+  name: 'modal',
+  initialState: {


모달이 기본적으로 store에서 false값을 가지고 안보이게 설정 돼있어서 가상 store를 만들어 true값을 줬습니다.
배경을 눌렀을 시 모달이 꺼져서 storybook에서 모달을 켜는 버튼을 하나 추가하겠습니다.

Lavegaa · 2020-12-02T15:56:20Z

src/components/Question/QuestionItem/QuestionItem.js

@@ -61,9 +64,10 @@ const AnswerBox = styled.div`
  transform: translateY(-20px);
 `;

-const ContenText = styled.div`
+const ContenText = styled.textarea`


value값을 활용하기엔 div의 contentEditable만으로 다루기가 어려워 textarea로 수정했습니다.

아하 그렇군요 나중에 비슷한 작업할때 참고하겠습니다.

Lavegaa · 2020-12-02T15:57:09Z

src/components/Question/QuestionItem/QuestionItem.js

-          <IconWrapper>
-            <Icon type={clicked ? 'arrow_up' : 'arrow_down'} alt="" />
+          <IconWrapper clicked={clicked}>
+            <Icon type={clicked ? 'drop_up' : 'drop_down'} alt="" />


아이콘 이름이 바뀐 부분이 있습니다. 한번씩 확인해주세요!

Lavegaa · 2020-12-02T15:57:37Z

src/components/Question/QuestionList/QuestionList.js

-    const dragCard = cards[dragIndex];
-    setCards(update(cards, {
+    const dragCard = questions[dragIndex];
+    setQuestions(update(questions, {


해당 정렬을 활용해 추후 질문 순서를 수정할 계획입니다.

아 이부분 고민이 많으셨을 것 같은데 잘 구현해 주셨네요. 고생 많으셨습니다 ㅠㅠ

고생하셨습니다..immutability-helper 로 구현하셨군요!

Lavegaa · 2020-12-02T15:58:20Z

src/context/serverContext.js

@@ -9,7 +9,7 @@ const api = ({ url, type = 'get', param }) => Axios({
  headers: {
    'Content-Type': 'application/json',
    'Access-Control-Allow-Origin': '*',
-    'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE',
+    'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, PATCH',


수정부분이 put이 아니라 patch로 나와있길래 추가했습니다.

Lavegaa · 2020-12-02T16:00:12Z

src/pages/QuestionPage/QuestionPage.js

  }, []);
+
+  const handleQuestionMake = () => {
+    // TODO: 비동기 처리 해야함. dispatch후에 아래의 과정 처리해야함.


dispatch를 비동기 작업해줘야 하는데 redux toolkit에 thunk패턴이 있어 활용해 봤으나 비동기 작업이 안됐습니다.
thunk패턴을 잘못 적용했는지, 따로 thunk를 붙여야 하는지 알아봐야 할 것 같습니다.

https://gist.github.com/marshallmurphy/6e0de1710d34e203d624f4f66641591d#file-recipes-js 이런식으로 시도해 보신 건가요?

참고해서 다시 해보겠습니다!

@dididy 님이 첨부해주신 자료대로 async, await 를 사용하시면 해결할 수 있을 거 같습니다!

dididy

앗 리뷰다는 도중에 코멘트를 다시는 것 같아 일단 중지합니다!

dididy · 2020-12-02T15:51:42Z

src/components/InputBar/InputBar.js

 }) {
  return (
-    <Wrapper className={className} type="text" placeholder="기업명을 입력해주세요" />
+    <Wrapper className={className} type="text" placeholder={placeholder} value={value} onChange={onchange} />


이부분 저도 변경점이 있는데 아마 conflict 날 것 같네요 ㅠㅠ

네네 제가 머지하기 전에 잡겠습니다.

dididy · 2020-12-02T15:57:12Z

src/components/AuthRoute/AuthRoute.js

+  useEffect(() => {
+    const name = sessionStorage.getItem('name');
+    const email = sessionStorage.getItem('email');
+    if (name !== authSelector.name) {
+      dispatch(setLogin({ email, name }));
+    }
+  }, []);


로그인 유지 로직 감사합니다!

dididy · 2020-12-02T15:59:25Z

src/components/Modal/Modal.stories.js

+    displayModal(state, { payload: { modalName } }) {
+      return {
+        ...state,
+        [modalName]: true,


오 이렇게 작성할 수 있네요 배워갑니다!

로그인 시 유저 정보 세션 스토리지에 저장 후 로그인 체크

TODO - redux dispatch 비동기작업 - input bar conflict잡기 - 질문 리스트 삭제 - 질문 삭제 - 이동 관련 순서 저장하기

…into feat/#66

dididy

선머지후 문제점 발견하면 그떄 리펙토링 하는 걸로 하겠습니다! 수고 많으셨습니다~!

SkynI25

고생하셨습니다!! 그리고 alias로 다 수정해주셨네요..감사합니다!

SkynI25 · 2020-12-03T17:50:35Z

src/components/Modal/Modal.js

-      { isShow && modalList[modalName] }
+      { isShow
+      && (
+      <ModalWrapper modalName={modalName}>


오,,추가해주셔서 감사합니다!

SkynI25 · 2020-12-03T18:03:41Z

src/components/Question/QuestionList/QuestionList.js

-    const dragCard = cards[dragIndex];
-    setCards(update(cards, {
+    const dragCard = questions[dragIndex];
+    setQuestions(update(questions, {


고생하셨습니다..immutability-helper 로 구현하셨군요!

SkynI25 · 2020-12-03T18:05:05Z

src/pages/QuestionPage/QuestionPage.js

  }, []);
+
+  const handleQuestionMake = () => {
+    // TODO: 비동기 처리 해야함. dispatch후에 아래의 과정 처리해야함.


@dididy 님이 첨부해주신 자료대로 async, await 를 사용하시면 해결할 수 있을 거 같습니다!

Lavegaa and others added 6 commits November 28, 2020 17:26

feat: 새로고침시 로그인 유지 (#66)

7f316e3

로그인 시 유저 정보 세션 스토리지에 저장 후 로그인 체크

feat: 사이드바 추가중 (#66)

8d2e3f9

feat: modal작업 중 (#66)

5022d9a

feat: 질문추가 로직 구상중 (#66)

f4cb2e3

feat: 질문리스트 기능추가 (#66)

36cc98b

TODO - redux dispatch 비동기작업 - input bar conflict잡기 - 질문 리스트 삭제 - 질문 삭제 - 이동 관련 순서 저장하기

Lavegaa self-assigned this Dec 2, 2020

Lavegaa commented Dec 2, 2020

View reviewed changes

Lavegaa requested review from dididy and SkynI25 and removed request for dididy December 2, 2020 16:00

dididy reviewed Dec 2, 2020

View reviewed changes

Lavegaa and others added 9 commits December 3, 2020 09:35

feat: 새로고침시 로그인 유지 (#66)

16a7569

로그인 시 유저 정보 세션 스토리지에 저장 후 로그인 체크

feat: 사이드바 추가중 (#66)

f5b8ed0

feat: modal작업 중 (#66)

38233da

feat: 질문추가 로직 구상중 (#66)

04cce51

feat: 질문리스트 기능추가 (#66)

9de9536

TODO - redux dispatch 비동기작업 - input bar conflict잡기 - 질문 리스트 삭제 - 질문 삭제 - 이동 관련 순서 저장하기

Merge branch 'feat/#66' of https://github.com/Yapp-17th/Web_2_Client …

c59181b

…into feat/#66

feat: rebase 마무리 (#66)

b93375e

feat: conflict 해결 (#66)

29ab4eb

feat: 질문 리스트 삭제 시 랜더링 문제 해결 중 (#66)

a306210

dididy approved these changes Dec 3, 2020

View reviewed changes

Lavegaa and others added 2 commits December 3, 2020 23:55

feat: 코드정리 (#66)

2e2031b

Merge branch 'master' into feat/#66

4d1b39f

Lavegaa merged commit 10ddba1 into master Dec 3, 2020

SkynI25 approved these changes Dec 3, 2020

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

질문리스트 작업 #92

질문리스트 작업 #92

Lavegaa commented Dec 2, 2020 •

edited

Loading

Lavegaa Dec 2, 2020

dididy Dec 2, 2020

Lavegaa Dec 2, 2020

Lavegaa Dec 2, 2020

dididy Dec 2, 2020

SkynI25 Dec 4, 2020 •

edited

Loading

dididy Dec 5, 2020

Lavegaa Dec 2, 2020

dididy Dec 2, 2020

SkynI25 Dec 3, 2020

Lavegaa Dec 2, 2020

Lavegaa Dec 2, 2020

dididy Dec 2, 2020

Lavegaa Dec 2, 2020

Lavegaa Dec 2, 2020

dididy Dec 2, 2020

SkynI25 Dec 3, 2020

Lavegaa Dec 2, 2020

Lavegaa Dec 2, 2020

dididy Dec 2, 2020

Lavegaa Dec 3, 2020

SkynI25 Dec 3, 2020

dididy left a comment

dididy Dec 2, 2020

Lavegaa Dec 2, 2020

dididy Dec 2, 2020

dididy Dec 2, 2020

dididy left a comment

SkynI25 left a comment

SkynI25 Dec 3, 2020

SkynI25 Dec 3, 2020

SkynI25 Dec 3, 2020

		const authSelector = useSelector(get('auth'));
		useEffect(() => {

질문리스트 작업 #92

질문리스트 작업 #92

Conversation

Lavegaa commented Dec 2, 2020 • edited Loading

작업된 사항

TODO

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

SkynI25 Dec 4, 2020 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

dididy left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

dididy left a comment

Choose a reason for hiding this comment

SkynI25 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Lavegaa commented Dec 2, 2020 •

edited

Loading

SkynI25 Dec 4, 2020 •

edited

Loading