BEAT A SHOTGUN

Error ❌ Error❌ Access to fetch at 'https://localhost:8000/test' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. client에서 server로 요청을 보내니 에러가 발생한..

모달을 만드는 와중에 에러가 났다 상황 ❗ 자식컴포넌트에서 버튼을 클릭하면, 부모컴포넌트에 있는 함수가 실행되게 하고 싶다. // Parent.jsx function loging(userlog:string){ console.log(userlog) } // Child.jsx const Child({loging, userlog}:any) = { function sendlog(userlog:any){ loging(userlog) } } sendlog(userlog)}>로그! 이렇게 props 이름 다 맞춰도 함수가 두 번씩 is not function 에러를 내뿜을 때 SOLUTION ✅ 부모 컴포넌트에서 // Parent.jsx ❌ function loging (){ } ✅ const loging = () ..

치욕의 젠킨스와 s3, codedeploy, docker hub 같은 것들로 배포가 될 듯 말 듯해 끙끙앓았다. 😡이것 저것 해보며 내린 결론. EC2 프리티어는 너무 느리고 나약하다. 그들은 나의 프로젝트를 감당할 자질이 없다고 판단, test용으로 방금 만든 따끈따끈한 react 프로젝트를 배포해봤다. 바로 성공. 물론 같은 방법으로 내가 공들여 만들어놓은 프로젝트를 배포했을 땐 브라우저에서 연결시간이 오래걸린다하고, ec2 가 또 먹통이 되었다. 😟 나약한 놈... 그렇게 나약해선 순양을 가질 수 없다. 강해지자! 시작 👊 사용될 도구들 : nodejs 프로젝트, AWS EC2 linux, Github Actions, Github Runners, EC2 에 설치될 docker 전체 플로우는 Acti..

백엔드 없이 프론트엔드만으로 페이지를 완성할 생각이므로 백엔드 없이 리액트와 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..

일단 프론트엔드 사용 기술 ts react axios MUI 시작이 반이다. 일단 시작 설치 npx create-react-app myapp --template typescript 를 입력한다. 설치는 2분정도 걸린다. 최소 5분임 npm start 하면 여느 리액트 프로그램처럼 리액트 화면이 잘 켜진다. 중요한 건 파일이 모두 tsx 로 만들어졌다는 것! typescript 도 설치되어 있다! 주식 API 신청하기 한국투자증권의 주식 API 한국투자증권의 주식 API 를 사용할 거다. 한국투자증권의 API 는 책도 있다. (파이썬으로 되어있지만) 그만큼 API 완성에 공을 들였다~ 고 볼 수 있겠지? 일단 서비스 이용 신청하기 APP KEY 를 받자. APP KEY 를 이용해 token 을 발급받고, ..