Posts

Svelte 에서 MongoDB 연결하는 예시가 어디 딱 나와있지 않다. 그래서 여러 삽질을 통해 연결이 되었고 그 부분을 대략 정리해본다. 사실 javascript 에서 module 을 import 하고 export 하는 방법이 가장 난항이었다. 그 부분을 중점적으로 정리해본다.

Mongo 내에 데이터 베이스를 만들기 위한 방법은 단순히 use 데이터베이스이름으로 간단히 만들 수 있다. 자세한건 여기를 눌러 참고한다. 데이터베이스 생성을 위해서는 mongo CLI에 접속해야 하는데, mongosh 명령어로 간단히 접속할 수 있다.

웹사이트 개발을 위해서 Svelte 라는 프론트엔드 웹프레임워크를 배워보려 한다. React 나 Vue.js 와 같이 널리 알려진 프레임워크들은 가상 DOM 을 사용하는 반면에, Svelte는 실제 DOM을 반영하는 방식이다. 빌드시점에 Vanilla JS 로 컴파일하여 속도가 빠르고 간편하다는 장점이 있다.

PostgreSQL을 이용해서 웹페이지를 만들고 있는데, 계속 소스 볼륨이 커지다보니 git branch 를 추가하면서 개발을 하고 있다. git 브랜치 생성 및 병합방법 관련 포스팅은 여기를 클릭하여 참고한다. 소스는 잘 나누어 개발하고 있는데, DB는 실제 운영중인 DB에다 계속 테스트거래를 해볼 수는 없어서, 하나의 테스트DB 환경을 하나 더 만들어 보고자 했다.

git push를 하다가 아래와 같은 인증오류를 보았다면, github 비밀번호를 갱신할 때가 된것이다. github 사이트 로그인할 때 사용하는 계정의 비밀번호는 아니고, 특정권한을 가진 토큰정보를 갱신하다고 보면된다.

DB 에서 거래를 등록/변경할때, 어느 시점에 등록했는지를 기록하기 위해서 보통 timestamp 를 사용한다. postgresql 에서 timestamp 컬럼을 추가해본적이 없어서 시행착오를 겪긴했다. 그 내용을 남겨보도록 한다.

Thymeleaf 에 대한 설명은 이전에 포스팅을 한 적이 있다. spring 공식홈페이지에서 설명하고 있는 템플릿엔진이라 관심이 가게 되었고, 홈페이지 하나를 Thymeleaf 로 만들어 보았는데 확실히 장점이 많다. 좀 찾아보고 공부했었던, 텍스트 조립하는 방법과 조건문을 정리해본다.

페이징 처리는 웹서비스를 만들다보면 직면하는 가장 흔한 개발요건이다. 웹화면에서는 한 페이지에 보여줄 데이터는 한정적이고, 페이지를 나누어 효율적인 방법으로 최적의 조회성능을 내줘야 한다. 오늘 볼 예제는 대량의 데이터는 아니며, 간단히 10건 미만의 데이터를 기준으로 limit 를 이용한 페이징처리 쿼리정도만 정리해본다.

SQL 실행툴로서 DBeaver를 무료로 아주 잘 사용하고 있다. 무료버전은 데이터 내보내기나 가져오기를 할 때, csv 파일만 가능하다보니, 엑셀파일 확장자를 가지고 바로 데이터 적재할 수 없는 아쉬움은 있다. 그래도 웹서비스에 필요한 간단한 데이터베이스관리나 sql 실행 정도라면 이만한 무료 sql 툴이 있을까 싶다.

웹사이트를 만들면서 반응형 웹사이트(responsive site)는 꼭 고려해야할 사항이다. 웹사이트는 브라우저만 있으면 접속할 수 있는 서비스이기 때문에, 폰, 태블릿, pc 등 다양한 기기의 각기다른 해상도에서 유동적으로 레이아웃이 변동되면서 가독성 있는 레이아웃으로 표현되어야 한다. 이런 반응형 웹을 만들기위해 부트스트랩(bootstrap) 프레임워크를 사용하고 있다. 아주 간단한 예시로 정리해볼까 한다. 아래 예제들은 여기 사이트 에서 직접 확인 가능하다.