kasumil의 코딩 공작소

- 오늘의 할일. Crsp라고 Daily stock을 보여주는 페이지가 있는데, 각 하위 컴포넌트에서 해당 값을 끌어와 마지막 step4에 해당 state 값들을 넘겨서 해당 컴포넌트에서 버튼을 누르면 작동하게 하는 것을 구현하고 다운로드를 구현해야하는데, 매우 어렵다... 이것만 구현해도 오늘 하루는 충분히 일했다고 생각된다. 그만큼 어렵다. 그리고 여기에 + submit query를 눌렀을 경우 해당 파일을 다운로드 시켜야하고, 이메일도 있을 경우 해당 이메일로 발송되게 설정해야함. 난이도가 너무 급 상승해서 힘들긴한데, 이걸 해결하면 또 한번 성장할 것으로 생각해서 여러모로 구글링 중. state값을 여러개를 한번에 넘겨줄 수는 없는건가????

- 오늘의 할일. 1. 김민준의 리액트를 다루는 기술 완독하기 2. submit 버튼을 눌렀을때 다른 컴포넌트에서 state값으로 저장된 것들 뽑아와서 백엔드에 보내주고, 그 파일을 다운로드 시키는 기능 완성할 것. - 리액트를 다루는 기술을 읽고 있는 이유는 오늘은 위코드데이라고 중간 보고하는 날이라 협업중인 상황과 개인공부하는 날이라고 보면 된다. 지난주는 anser 기능 구현을 위해서 하루를 오로지 사용했지만, 오늘은 기능구현보다 내 개발 능력을 성장시키기위해 쓰는 날이다. 리액트를 쓰고 있지만, 알게모르게 왜 이렇게 작성하는가(?) 하는 의문을 갖고 있었는데, 그런 내용을 해소할 수 있게 해당 책에 많은 내용이 있더라 ㅎㅎㅎ 여태껏 부족했던 개념인 것들에 대해서 지금은 빈틈을 채우고 있다. 2번째..

* 아직 리덕스는 학습을 시작한 상태라 적용하지 않았음. - 오늘의 할일. 1. 어제 구현하지 못한 input check 박스 선택에 따라서 필요한 컴포넌트 호출하는 기능 구현. 2. email 주소와 쿼리네임을 선정하여 해당 input 창에 기입하면 해당 값을 입력시키기. 3. 제출하기 버튼클릭시 해당 이메일과 다운로드 기능 구현 - 진행 완료사항. 1. input true : faslse값에 따라 해당 컴포넌트 호출하는 기능으로 구현. 2. email, input 창 기입에 따른 해당값 state값으로 저장구현. - 진행중 사항 - 1. submint 버튼 클릭시 이메일로 발송과 해당 파일을 다운로드 요청하는 기능 구현 중 2. 각자의 컴포넌트마다 해당 state 값이 저장되므로 Redux를 공부하여..

- 오늘의 할일. 코드 리팩토링. 기능 구현 상담 후 수정할 것 있는지 확인 후 merge할 것. -코드 리뷰 3일간 날 괴롭히던 datepicker의 기능을 대부분 구현했다. 기존에 하드 코딩으로 2019를 표시했던 것을 이제 자동으로 시간이 지나도 알아서 작동되게 구현하였고, WRDS처럼 2007년 페이지를 기준으로 했던 것처럼, 내가 만든 부분도 13년으로 설정해서 현재는 2007년 내년에는 2008년 내후년은 2009년으로 자동으로 바뀌게 만들었다. 원래 J쿼리로 만들어진 것이라 구현이 매우 빡셌다. 자료도 대부분 J쿼리 전용이라... 이에 참고한 자료가 HackerOne에서 만든 React-datepicker 자료 https://reactdatepicker.com/ React Datepicker..

- 오늘의 할일. React Datepicker 커스텀하기. 남은 포인트 설정하기. DatePicker를 커스텀하는 중. 특정일자로 datepicker를 설정하려고 하는데, jQUERY와 다르게 react라서 헤맸다. 원래는 jQUERY에선 그냥 "2019-12-31"만 적으면 되는데 DATEPICKER는 날짜만 기입되면 안되고, 해당 날짜 앞에 new Date("날짜") 쳐야 작동하는 것.... setStartDate(date)} selectsStart startDate={startDate} endDate={endDate} minDate={new Date("1925-12-31")} maxDate={new Date("2019-12-31")} dateFormat="yyyy-MM-dd" onKeyDown={..

오늘의 수정사항. - ip주소를 모아둔 config.js에서 행으로 구분을 위해서 뛰어달라고 요청 받음. (내가보기엔 가독성이 더 떨어지는 것 같다만;;; 뭐 요청에 따라 수정함.) - 코드 리팩토링을 통해서 1100줄이 넘던 코드를 600줄(하드코딩 자료를 목업자료인 json으로 넘겨서)로 줄였고, 컬러만 빼고 중복되던 styled 컴포넌트를 컬러만 따로 먹이게 진행함. - 동일한 스타일을 먹이던 것을 props를 통해서 따로 특정색상을 먹일 수 있도록하여, 코드의 중복을 줄였음. - 기존 프로젝트에서는 Route에서 nav와 footer를 기본으로 두고, 이를 해당 페이지만 교체하였는데, 해당 페이지에서 같이 호출하는 걸로 해달라하여 그렇게 수정하였음. - 코드 삭제하기전에 코드가 남아있는 코드 68..

월요일부터 써야했지만, 시간이 없어서 오늘적는다. - 분위기 신생기업이라서 그런지 되게 으쌰으쌰 하는 분위기이다. 업무 분위기가 엄청 좋다. 서로서로 장난도 많이치는 것 같음. - 구조 기업을 핸들링하는 교수님이 CTO로, 다른 분이 CEO로 자금을 대는 구조 같았다. 다들 DATA Sientist라서 고스펙자들만 모여 있음. - 업무 wrds라는 와튼 데이터 업체를 클론 코딩하는 중. 해당 사이트를 베이스로 자신들의 사이트로 개편해서 고치려는 것 같다. - 아직은 클론 코딩이기에 코드를 공개할 수 있겠지만, 나중에 가면 코드를 공개하지 못할지도..? - 어차피 github에 올리는 상태라 그냥 여기서 공개해도 될지도 모르겠다. footer는 하루만에 완성해서 끝났는데, 의외로 시간이 걸리는 데가 sig..

위코드에서 마지막으로 진행한 2차 프로젝트 클론 코딩. youtu.be/5bPp7WZGTWQ 전체 영상 트립어드바이저(Trip advisor) 프로젝트 소개🙌 전 세계 여행자들의 859만 개의 숙박 시설, 음식점, 체험, 항공권, 크루즈 여행에 대한 7억 95천만 건 이상의 리뷰와 의견을 검색하여 모든 여행이 최적의 여행이 되도록 도와주는 Tripadvisor 홈페이지 클론코딩. 개발기간📆 2020년 8월 3일 ~ 2020년 8월 14일(12일간) 팀원🐙 프론트엔드 [10기 권한성] [10기 김경배] [10기 송수호] 백엔드 [10기 김도환] [10기 김병준] 기술 스택 및 구현 기능 1)기술 스택 React.js React Router RESTful API multipart/form-data 2)구현 ..

오늘 해야할 것. 1) 로그인 컴포넌트(컴포넌트가 교체되면서 새로 출력하는 부분 만들 것) - 완료 2) 상세페이지 사진 hover시에만 떠야하는데 안떠서 스타일 컴포넌트로 통일 -예정 3) 상세페이지 호텔 설명 slice함수를 통해서 배열로 만들고 이를 map함수를 통해 출력하기 = 예정 4) 상세페이지 이미지(slick slider) 구현 - 예정 로그인 컴포넌트를 고쳤다. 우오오~(Modalhandler 구조는 아직도 이해가 안됨;;; 리덕스 같은데, 리덕스는 아니라고 하는데 함수를 조금더 공부해봐야 할듯 싶다.) 모든 로그인 컴포넌트를 컨트롤하는건 nav 컴포넌트였던 것이다. 이것이 꺼지도록 애초에 nav에서 설정한다면, 그것을 props로 하위 컴포넌트로 보내버리면 되는 것이었다. import ..

- 오늘한 일. hotel 상세페이지 이동. react redux에 세션을 통해서 배움. 이력서 세션이 있었음. 오늘의 문제점... 화면 마우스 이벤트로 hover시에 숨겨져야 하는 빨간색 동그라미친 부분이 hide, exhibit 클래스가 제대로 안 먹는 문제가 발생. 컴포넌트 클래스로 죄다 통일하여 정리해야겠다. 수정 예정: 충돌 문제를 해결하기 위해서 스타일 컴포넌트로 리팩토링하여 싹 다 통일 예정. 예상외로 내 속도가 너무 느려서 난항 중. 버튼을 누르면 이동하는 슬릭을 넣을 예정. 아래 코드 블럭은 사진을 표현하는 컴포넌트. import React, { useState } from "react"; import styled from "styled-components"; import { withRo..