BEAT A SHOTGUN

시작 👊 성공해서 이 글을 쓰기 까지 3일이나 걸렸다. 매일 새벽 4시까지 키보드 부셔가면서 502 504 와 씨름했지만. 에러의 원인은 내가 생각하던 것들이 아니었다. 전부. 기본이 매우 중요하다는 걸 깨닫는 3일이었다. 우선 나는 자바코드 없이 react 만으로 페이지를 만들고 싶었기 때문에 자바 api 와 데이터베이스 가 없다. mysql 도 사용하지 않았다. 하지만 데이터베이스의 필요성을 느꼈고 RDS 를 만들었지만, RDS 만들기 끝까지 인텔리제이를 켜기 싫었기 때문에 RDS 로 바로 연결할 순 없나? 해서 3일동안 끙끙 앓았다. 특별하게 내가 사용하고 있는 건 나는 TS , http-proxy-middleware 를 사용한다. 그리고 앞으로 express 와 mysql 을 사용할 거다. 이게 ..

백엔드 없이 프론트엔드만으로 페이지를 완성할 생각이므로 백엔드 없이 리액트와 AWS RDS 를 연결해볼 생각이다. RDS 를 만드는 건 쉽다. AWS RDS 들어가서 데이터 베이스 생성 들어가서 나는 MySQL 을 사용할 거기 때문에 선택하고 돈 안 내고 쓰고 싶기 때문에 프리티어 식별자는 우리가 Heide 에서 처음 만들 때 그 이름  여기 `stockviews` 가 바로 식별자다. 아무튼 이름 적고 `사용자 이름`은 데이터 베이스에 접근할 때 사용할 이름. 거기에 비밀번호. 인스턴스 구성은 t2 스토리지는 20GiB 로 해야 한다. 프..

이 전엔 하나의 차트에 두 개의 그래프를 넣어 이 따위로 만들어놓았지만 Docs 를 보니 두 차트를 Synchronize 해 하나의 차트처럼 살펴볼 수 있었다. 이렇게. 이렇게 만들어보자. 매우 쉽다. 시작 👊 일단 차트를 하나 더 개 만든다. ... ... 이제 두 차트에 syncId 속성을 추가해준다. Docs 가 얘기해주는 것 처럼 두 차트의 syncId 에는 같은 값이 들어가야 한다. ... ... 끝🙋‍♂️ 너무 쉬운 건데 Docs 를 안 읽고 대충대충 만드니 엉망진창이 된 거지. 항상 댕청해지지 않도록 조심하자!

시작👊 API 를 이용하기 위해서 받은 APPKEY 와 APPSECRET 이 있다. APPKEY 와 APPSECRET 이 공개된 채로 github 에 올라가면 안 되겠죠😉? .env 파일 .gitignore 옆에 .env 파일을 만든다 .env 파일안에 적는다. 이때 따옴표는 적지 않도록 하자. // example APPKEY="AAA" ❌ APPKEY=AAA ✅ APPKEY와 APPSECRET 이 들어가는 부분에 방금 만든 env 를 넣어주자 process.env.ㅇㅇㅇ이름 끝 🙋‍♂️ npm start 새롭게 해주면 잘 작동한다. 덤 지금처럼 하면 재사용성이 조금 떨어지므로 변수에 담아서 사용해보자. 덤2 url 도 넣을 수 있다. url 도 .env 에 넣은 다음 변수로 받아온 다음 사용해보자

시작 👊 주식 차트를 그리는데 "상한가"로만 표현된다.😟 내가 원하는 차트 그림은 이게 아니야. 내가 원하는 차트는 진짜 주식 차트 처럼 하한가 상한가를 가지고 막대의 길이를 조절하고 싶다. 내가 가져온 데이터(한국투자증권 주식 API)에 이렇게 모든 게 담겨 있기 때문에 주가 아래쪽 바닥에는 거래량까지 표현할 수 있다. 사실 거래량을 표시하는 것은 어렵지 않다. 거래량은 바닥부터 올라오면 되는 그냥 막대그래프 기 때문에 를 하나 더 넣고 데이터를 넣어주면 된다. 결국 내가 원하는 건 🤔 하한가 상한가 를 이용해 막대를 공중에 띄우기 floating 전일 대비 부호 를 이용해 막대그래프 색깔 바꾸기 바닥에 거래량 막대 표시하기 🙂 만들어보자 🙋‍♂️ 1번부터 만들어볼까욤. dataKey 값에는String..

ERROR ❌ // FE const handleReplyDelete(props){ console.log(props.replyId) } ... Delete onClick 이벤트를 넣은 버튼을 눌렀을 때 props 로 넣어준 reply 가 제대로 넘겨주는지 확인하기 위해 console에 replyId 를 출력하는 간단한 이벤트를 발생시켜보았다. 그런데 페이지를 Rendering 할 때 onClick 이벤트가 자동으로 작동된 뒤, 버튼을 눌러도 console 에 replyId 를 찍어주지 않았다. Rendering 할 때 작동 된 뒤로는 버튼이 전혀 반응이 없어서 너무 의아했다. 해결 ✅ {handleReplyDelete(reply)}}>Delete 이렇게 Arrow Function 을 사용해 한 번 더 함수..

ERROR ❌ Object { message: "Request aborted", name: "AxiosError", code: "ECONNABORTED", config: {…}, request: XMLHttpRequest, stack: "" }라는 오류가 떴다. CODE // Front const [id, setId] = useState(""); const [title, setTitle] = useState(""); function testSubmit(){ axios.get('http://localhost:8080/test/creat',{ params:{ id:id, title:title } }) .catch(function(error){ console.log("실패"); console.l..