본문 바로가기
  • ANALOG CODE
  • AnalogCode
반응형

분류 전체보기56

Gitlab Pages 에 Custom Domain 연결하기 Gitlab Pages를 활용하여 Static Hosting을 무료로 할 수 있고 xxx.gitlab.io 형태의 도메인을 통해 접근이 가능하다. 추가로 여기에 내가 구입한 Custom Domain을 연결할 수가 있다. 이 글에서는 Custom Domain을 Gitlab Pages에 연결하는 방법을 설명한다. AWS Route53에서 구매한 도메인을 가지고 Gitlab Pages에 연동을 해보도록 하겠다. 최종 목표는 내가 구입한 도메인이 aaa.com이라면,https://aaa.com , https://www.aaa.com 접속할 수 있도록 연결하는 것이다. 당연히 SSL 인증서가 적용된 HTTPS로 접속이 되도록 할 것이다. Domain 구입 가장 먼저 사용할 도메인을 구입하자. 이미 도메인이 있다면.. 2023. 6. 28.
Nuxt3에서 Quasar 사용하기 Quasar는 Vue.js기반의 UI Framework이다. Quasar는 매우 다양한 Components가 있으며, 문서화도 아주 잘 되어있다. Quasar를 사용하게 된 이유와 Nuxt를 기반으로 프로젝트를 만들고 Quasar를 적용하는 방법을 설명하다. Quasar Quasar는 오픈소스 Vue.js 기반의 프레임워크이다. 우리나라에서는 Vue보다는 React의 점유율이 높기 때문에 아마도 Vue기반의 Quasar를 사용하는 케이스가 많지 않을 것이다. 만약 Vue를 사용한다면 Vuetify, BootstrapVue 등 다양한 UI 프레임워크가 있지만, Quasar는 그에 비해 지명도가 약간 떨어지는 느낌이다. 나도 그전에는 거의 못들어봤고 주로 Vuetify를 사용해왔기 때문이다. 하지만 Quas.. 2023. 6. 23.
Nuxt 3 에서 더이상 Moment.js 말고 Day.js 사용하자 지금까지 Nuxt 2를 사용하면서 날짜시간을 처리하기 위해 Moment.js를 사용하였다. 하지만 Nuxt 3로 프로젝트를 시작하면서 Nuxt3에서 Moment를 통합가능한 모듈을 찾을 수가 없었고, 대안으로 Day.js를 찾게 되었다. 이에 관련해서 자세한 내용을 정리하였다. Moment.js 개발 종료 충격적이게도 Moment.js가 legacy project 상태로 바뀌었다. 아니 이미 3년전 버전인 2.29.0부터 legacy project 였었다. 그동안 이 사실을 모르고 @nuxtjs/moment 라는 Nuxt 2에서 간단하게 moment를 통합할 수 있는 모듈이 있어서 당연한 듯이 사용했었다. Nuxt 3로 프로젝트를 만들고 Moment.js 모듈을 Nuxt에 통합하기 위해 nuxt-mome.. 2023. 6. 13.
Vue.js 강좌 3. 반응성 - 어떻게 자동으로 DOM이 변경될까? Vue의 핵심 기능 중에 하나가 바로 반응성(Reactivity)이다. 반응성이란 상태(State) 변경을 추적하여 DOM을 자동으로 업데이트시켜주는 기능이다. 반응성을 어떻게 활용하는지를 설명하고, 어떤 원리로 이게 가능한지를 설명하겠다. 반응성(Reactivity) 반응성이란 컴포넌트의 상태(State)가 바뀌었을때 자동으로 컴포넌트의 DOM을 변경해주는 것이다. 상태(State)란 쉽게 말해 컴포넌트를 그리는데 연관된 데이터이다. 이 상태 데이터가 변경되면 우리는 컴포넌트의 모습도 바꾸어 줘야 한다. Vue에서는 상태가 바뀔때마다 컴포넌트의 DOM을 우리가 일일이 바꾸어주는 코드를 짤 필요가 없다. Vue가 알아서 자동으로 업데이트를 해주기 때문이다. 이것들 반응성(Reactivity)이라고 하는 .. 2023. 6. 12.
반응형