개발일지 썸네일형 리스트형 [사이드프로젝트] 백엔드 서버 띄우기 백엔드 서버 띄우려고 했는데 코드 내에서 orm 설정이 기본으로 되어있다보니 그걸 빼고는 억지로 띄우기가 힘들었다. 그래서 결국 RDS 하나를 먼저 띄우고 시작해야 할듯하다. 더보기 [사이드프로젝트] ec2 사이즈 늘리기 현재 테스트용으로 ec2 사이드를 t2.micro를 사용하고 있었는데, 올려놓고 보니 너무 느려서, t2.small로 올렸다. 메모리가 2GB로 늘었다. 요정도만 했는데 굉장히 쾌적해졌다. 인스턴스 사이즈 늘리기 전에는 인스턴스를 무조건 중지해야했었다. 그래서 하나를 중지한 상태에서 업그레이드를 하였고, 다시 ec2를 재실행 해주었다. 이 과정에서 아래와 같은 문제들을 겪었다. 1. 공개 ip 주소가 변경되어, route53에 세팅을 변경해주어야 했다. 2. 인스턴스를 다시 켜면 당연히 nginx, pm2로 다시 시작해주어야 했다. 일단 이정도만 해두었고, 처음 생각에는 하나의 인스턴스에 프론트서버와 백엔드 서버까지 올리려고 했는데 이번 기회에 그건 절대 무리라고 생각되었다. 그래서 아주 맨첨에 생각했던.. 더보기 [사이드프로젝트] 프론트 코드 ec2에 배포하기 - 2 저번글에서 404에러가 났었는데, 원인은 nginx의 route를 뚫어주지 않은것이 원인이었다. /_next/static을 내가 띄운 서버로 변경하니까 정상적으로 동작하는것을 확인했다. 다음 목표는 같은 인스턴스에서 서버까지 띄우는 것이다. 더보기 [사이드프로젝트] 프론트 코드 ec2에 배포하기 https://puterism.com/deploy-next-js-with-ec2/ AWS EC2로 Next.js 배포하기 - Puterism AWS EC2를 통해 Next.js 프로젝트를 배포하는 방법이다. EC2 인스턴스 생성하기 먼저 EC2 인스턴스를 생성해야 한다. EC2 페이지에 접속해서 인스턴스 시작 버튼을 클릭한다. https://ap-northeast-2.console… puterism.com 위 블로그가 필요한건만 나와있길래 바로 적용해서 띄우기는 했다. 하지만 오류는 항상 전혀 생각지도 못한 곳에서 나더라. 보니까 static 폴더에 있는 파일들 전체를 가져오지 못하는 것 같은데 이유를 파악해야 겠다. 아이 귀차나... 해결: 2021.11.14 - [개발일지] - [사이드프로젝트] 프론.. 더보기 [사이드프로젝트] 로그인 기능 구현 로그인 기능 구현을 모두 끝냈다. 진짜 뼈대만 구현하였고 코드 정리를 전혀 안한 상태이지만 좀 뿌듯하다. nest 프레임워크 이용하였고 github oauth를 이용해서 로그인을 구현하였다. 내가 해보니까 이런 아리까리한 (내용을 아는것 같은데 실제로 해보면 겁나게 막히는 것들. 사실 존재만 알고 모르고 있었던 것들) 내용을 학습하기 위해서는 매일 조금의 시간으로 꾸준히 진행하는 것보다는 며칠에 몰아서 빡세게 매달리는 것이 나에게 더 맞는 것 같았다. 다음에 어떤 학습을 할지는 모르겠지만 이런 방식으로 계속 학습해야겠다. 더보기 [TypeORM] entity를 갱신했는데 예전 컬럼이 그대로 있는 현상 지금 사이드 프로젝트를 작업중이다. 개빡치는 문제가 있었는데, 예전 엔티티 기준으로 자꾸 테이블이 생성되어서 안쓰는 컬럼이 자꾸 생성되는 문제였다. 원인은, typeorm 옵션중 synchronize: true 가 있는데, 현재 업데이트된 entity 기준이 아닌, 이전에 만들어 두었던 dist 의 엔티티 파일을 기준으로 생성이 되었기 때문이다. 참고: https://stackoverflow.com/questions/66509913/nestjs-typeorm-typeorm-doesnt-update-entity-in-db-uses-old-cached-entity-inst 더보기 [직소퍼즐] 직소 퍼즐 만들기 (8) - raycaster 확인 - canvas를 사용할거고, 거기서 drag n drop 기능을 이용해서 네모 조각을 움직이는 기능을 구현한다 - 특정한 조각의 배열이 순서를 이루면 정답으로 인정한다 - 네모 조각을 진짜 직소 퍼즐 조각처럼 만든다 어제 배낀 코드가 raycaster가 동작을 안하는 것 같다. 설명대로라면 빛이 가장 먼저 닿은 거리에 있는 object가 반응해야 하는데, 뒤에 있는놈이 반응을 한다. 대충 원인은 파악했으니, 이걸 수정해보자. https://threejsfundamentals.org/threejs/lessons/kr/threejs-picking.html 다음에 할 일 1. raycaster 동작하도록 수정 2. 3D객체 z 축 position 생성 순서, z 값 말고 제어할 값 찾아보기 3. 코드 리팩토링 더보기 [직소퍼즐] 직소 퍼즐 만들기 (7) - 드래그 정밀도 올리기 - canvas를 사용할거고, 거기서 drag n drop 기능을 이용해서 네모 조각을 움직이는 기능을 구현한다 - 특정한 조각의 배열이 순서를 이루면 정답으로 인정한다 - 네모 조각을 진짜 직소 퍼즐 조각처럼 만든다 피곤하다.... 일단 저번에 못했던 1. 드래그 정밀한 값으로 개선하려고 한다. 참고문서 https://discourse.threejs.org/t/dragging-3d-objects-using-mouse-in-three-js/12731 Dragging 3D objects using mouse in three.js I need to drag a 3d object using mouse. The 3d objects has its face coloured and edges shown.The pro.. 더보기 [직소퍼즐] 직소 퍼즐 만들기 (6) - drag 구현 리얼 - canvas를 사용할거고, 거기서 drag n drop 기능을 이용해서 네모 조각을 움직이는 기능을 구현한다 - 특정한 조각의 배열이 순서를 이루면 정답으로 인정한다 - 네모 조각을 진짜 직소 퍼즐 조각처럼 만든다 일단 지난 시간에 마우스 감지를 했으니까, 똑같은거 3개 네모를 만든 다음, 드래그를 진짜 구현을 해보자 1. 일단 네모 3개를 만들고 마우스 감지만 한 상태 이제 드래그 구현해보자 드래그 기능 자체는 구현했는데, 아직 미숙하고, 좀 더 정밀한 position 값이 필요하다. 지금 position의 z 값을 0인 상태로 두게되면 무조건 3D 객체가 생성된 순으로 배치가 되는데.. 이걸 바꿀 수 있는 방법을 알고 싶다. 코드가 개판이라 정리를 좀 해야할 것 같다. 다음에 할 일 1. 드래그 .. 더보기 [직소퍼즐] 직소 퍼즐 만들기 (5) - drag 구현 - canvas를 사용할거고, 거기서 drag n drop 기능을 이용해서 네모 조각을 움직이는 기능을 구현한다 - 특정한 조각의 배열이 순서를 이루면 정답으로 인정한다 - 네모 조각을 진짜 직소 퍼즐 조각처럼 만든다 드래그 구현 시작 1. three.js는 z축의 값을 raycaster()로 계산한다. ray casting이란: https://en.wikipedia.org/wiki/Ray_casting Ray casting - Wikipedia From Wikipedia, the free encyclopedia Jump to navigation Jump to search Methodological basis for 3-D CAD/CAM solid modeling and image rendering Ra.. 더보기 이전 1 2 3 4 5 6 다음
