본문 바로가기

반응형

분류 전체보기

(362)
[모음집] NestJS(with TypeORM + PostgreSQL) 예제 모음집 포스트 목적NestJS, TypeORM, PostgreSQL 을 사용하면서 적용해야 했던 내용들에 대해 하나하나 정리하여 찾아볼 수 있는 아카이브 형식으로 자료들을 모아두는 포스트 입니다. 정리 순서는 뒤죽박죽이라서 목차를 보고 필요한 내용이 있다면 참고하시면 좋을 것 같습니다. 해당 포스트는 관리 효율성을 위해 업데이트 되는 날을 기준으로 최상단에 포스트가 갱신되는 것을 원칙으로 합니다. 참고/참조 자료 링크(TypeORM Where 문 예시) https://typeorm.io/select-query-builder#adding-where-expressionPostgreSQL 에서 제공하는 JSONB 타입의 데이터 다루기아래는 JSONB 타입의 데이터를 조작하기 위해 사용하는 옵션에 대한 간략한 설명을 ..
[복지맵 프로젝트] 트러블 슈팅 모음집 ① 오늘의 명언 "모든 문제에는 실마리가 존재한다." [리셋 문제 1 ] 필터 모달을 닫는 경우 체크 항목이 초기화되는 문제 해당 문제는 단순하게 해결되며, [리셋 문제2] 로 이어집니다.문제상황,사용자가 필터 기능을 사용하여 검색을 하고, 해당 창을 닫은 후 다시 사용하려고 하면, 기존에 체크 영역이 초기화되는 무제가 있습니다.필터창을 열고 체크한 상태 [닫기] 후 다시 필터창을 연 후 개선과정,원인분석해당 문제의 1차적인 원인은  showFilters 라는 true or false를 담고 있는 상태가 변경될 때 마다 해당 필터창이 브라우저 렌더링에서 완전히 배제되었다가 생겨나면서 생기는 문제 입니다.  이 문제를 해결하는 단순한 방법은 showFilters 상태에 따라서 해당 필터 모달의 클래스를 동적으..
AWS EC2 내 파일을 내 로컬로 가져오려면?(Window Putty.exe) 명언 웹 프로젝트를 하면서 AWS EC2 내에서 사용하고 있는 데이터베이스 백업 파일을 로컬로 가져와야 하는 일이 생겼다. 이번 포스트는 Window 환경에서 키 페어를 .ppk 를 사용하는 Putty SSH 클라이언트를 사용하여 어떻게 ec2 내의 파일을 로컬로 가져오는지 정리한 것이다. putty 사용법 등은 이미 안다고 가정하므로 설치방법 등에 대한 절차는 모두 생략한다. 접근 권한 변경우선적으로 옮기고자 하는 파일이 위치한 폴더로 외부에서 접근할 수 있도록 임시적으로 권한을 부여해야 한다. 본인의 경우에는 admin.sql 이라는 DB 백업 파일이 /var/lib/pgsql 이라는 postgres 사용자만 접근이 가능한 경로에 있다. 따라서 pgsql 폴더에 대한 접근 권한을 수정하여 pscp 에..
[JS] Array.from 의 두번째 인자는 map 과 유사한 함수다. 생각보다 자주 사용되고 있는 Array.from 이라는 메소드에 대해서 알아보고 보다 다양한 상황에서 활용할 수 있는 능력을 키우기 위해서 이번 포스팅을 준비하였다.  기본 사용과 개념 | 순회 가능 혹은 유사 배열 객체를 Array 인스턴스로 생성우선 Array.from 은 Array 생성자 함수에 바로 접근이 가능한 정적 메소드이다. 그리고 해당 메소드를 사용하면 순회 가능한 객체나 유사 배열 객체를 Array 인스턴스로 생성할 수 있다. 예를 들어, hello 라는 문자열이 있으면, 해당 문자열은 실제 배열은 아니지만, 내부적으로는 배열과 유사한 형태를 지니기 때문에 유사배열객체로서 순회가 가능하다. 따라서 Array.from 의 인자로 해당 문자열을 전달하게 되면, Array 인스턴스로  새롭게 ..
[복지맵 프로젝트] ~ 2024.05.10 진행사항 점검[CH04] 현재 까지 진행도뉴스 검색기능복지맵과 연관하여 추가적으로 제공할 수 있는 기능이 무엇이 있을까 고민하다가. 네이버 검색 api 를 사용하여 복지 관련 뉴스를 가져와서 보여주면 좋을 것 같아서 해당 기능을 추가하였다. 해당 프로젝트에서 제공되는 복지서비스 정보는 부산 지역에 한정하여 제공할 생각이기 때문에, 검색 필터링을 부산 구군별 + 대상별로 한정하여 기능을 구현하였다.   복지맵과 서비스 상세내가 이번에 계획한 복지맵 프로젝트의 주요 컨셉은 말그대로 지도이다. 물론 그 지도가 카카오 맵 api 와 같은 sdk 를 사용한 방식 보다는 실제 SVG 를 사용하여 각 구군별 선택 시 해당 지역에서 제공하는 서비스 목록을 렌더링하여 보여주는 것이 주요 컨셉이었다. 레이아웃이 변경 됨원래 기존의 복지맵은 지리도..
[복지맵] 복지맵 프로젝트 테스트 코드 아카이브 보호되어 있는 글입니다.
윈도우 환경에서 잘 되던 PUTTY SSH 접속이 안 될 때 확인해야 하는 것 중 한 가지, 로컬 IP의 변경 [서론] 잘 되던 친구가..기존 프로젝트를 올렸던 인스턴스에 접속하기 위해서 putty.exe 를 실행하여 SSH 접속을 시도하였다. 그러나, 2024.05.09 오후 12시 경, 아래와 같은 에러가 발생했다.  [본론] 문제 원인으로 짐작되는 것네트워크 에러가 발생하는 이유에 대해서 구글링을 통해 찾아보니, 현재 로컬 IP 와 인스턴스를 연결하는 데 사용된 IP 주소가 서로 달라서 발생할 수 있다고 한다. 생각해보니, 어제 LGU+ 에서 제공하는 공유기에서 SK 브로드밴드로 바꾸었기 때문에, 기존 내 컴퓨터를 식별하는 IP 주소가 바뀌어서 이 문제가 발생한 것이라 짐작할 수 있었다. 사실 이거 말고는 문제를 일으킬 요소가 없었긴 했다. 문제원인이 명확해졌으니 바꿔주면 될 일그래서 이 문제를 해결하기 위..
CSS +JS 를 이용한 톡톡 튀는 폭죽(스파크) 애니메이션 만들기 이전 애니메이션 | 로딩 스피너 HTML/CSS 를 이용한 로딩 스피너 만들기3탄 | 마우스 호버 시 따라다니는 언더라인 만들기 바닐라 JS/HTML/CSS 로 재밌는 애니메이션 효과 만들기 (3탄)2탄 | HTML/CSS 만으로 재밌는 마우스 호버 애니메이션 구현하기 HTML/CSS 만으로 재밌는duklook.tistory.com 미리보기현재 포스트를 따라오시면 다음과 같은 애니메이션을 구현할 수 있는 능력을 갖추게 되십니다. HTML이번 포스트는 HTML 을 직접적으로 생성할 일은 없습니다. 향후 JS 를 이용해 동적으로 생성할 것입니다.CSSCSS 초기화* { margin: 0; padding: 0; box-sizing: border-box;} 우선 margin 과 padding 을 0 으로 ..

반응형