퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)
안녕하세요, 항상 좋은 내용 감사한 마음으로 보고 있습니다. 오늘 수업에서는 boot 디렉토리에 constants.ts를 생성하고, 이 안에서 globalProperties를 선언 후 .vue 파일에서 이를 확인했습니다. <script setup> 방식에서는 this로의 접근이 불가한가요? 생각지도 못했었는데, this를 통해 globalProperties에 접근하려 하니 안되더라고요.. 그렇다면 <script setup>에서 globalProperties를 포함하여, boot 파일로 작성한 것들에 접근하려면 어떻게 해야할까요? 미리 감사드립니다.
퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)
vue에서는 한글 실시간 바인딩을 다음 코드로 합니다. <template> <h1>{{ msg }}</h1> <input type="text" :value="msg" @input="msg = $ event.target .value" /> </template> 하지만 퀘이사의 q-input에서는 @input 이벤트가 디프리케이트 되어서 동작하지 않습니다. 한글 실시간 처리를 하려면 어떻게 해야할지요? 감사합니다.
퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)
안녕하세요. 좋은 강의 감사드립니다. form-handling 페이지에서 <script setup> 내에서 router.push( {name: 'youtube'} ) 만 기입하여 바로 이동할 수 있도록 해보았습니다. (라우터설정에는 name에 youtube' 미리 수정해두었습니다.) 그런데 이동은 정상적으로 되는데, 컨텐츠영역이 나오지를 않네요. (IndexPage.vue 부분) 왜 안나오는지, 어떻게해야 나오게 되는지 좀 알 수 있을까요? 감사합니다.
퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)
boot쪽 강의 들으면서 터미널에 quasar new boot initalization 라고 썻는데 보안오류라고 뜨면서 안되네요 quasar : 이 시스템에서 스크립트를 실행할 수 없으므로 자세한 내용은 about_Execution_Policies( https://go.microsoft.com/fwlink/?LinkID=135 170)를 참조하십시오. 위치 줄:1 문자:1 + quasar new boot initalization + ~~~~~~ + CategoryInfo : 보안 오류: (:) [], PSSecurityException + FullyQualifiedErrorId : UnauthorizedAccess 이런식으로 뜨네요
퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)
양질의 강의들.. 너무나도 잘듣고있습니다. 백엔드하다가 프론트의 필요함을 절실히 느껴 선생님의 vue 1,2 그리고 Quasar 까지 풀코스로 즐기고 있습니다. 다름이 아니라, 선생님의 vscode 처럼 Quasar 내장 컴포넌트의 색이 녹색으로 변하지 않는 이슈가 있는데 해결 방법 아시면 답변 부탁드리겠습니다. 그리고 오른쪽 상단 vue 아이콘은 어떤 플러그인인지도 궁금합니다. (vscode 은 night-owl 같은것은 쓰지않고 순정으로 사용중입니다. 또한 프로젝트 한두개 더 생성해도 동일합니다 ㅠ)
퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)
좋은 강의 감사드립니다. 퀘이사를 처음 접해보면서 궁금증이 생겨 질문 하나 남깁니다. Quasar가 기본적으로 Design Framework인 걸로 저는 이해를 하고 있는데, Doc에서는 SSR 모드를 통해 ssr을 지원한다고도 하고, hydration도 지원한다는 식으로 설명이 되어 있는것 같더라고요. 얼핏 보기에는 SPA 방식에다가 Meta 태그 통해 SEO를 제어하는 방식으로 SSR 모드를 운용하는거 같은 느낌이긴 한데, 이게 되게 헷갈립니다. 비공식적으로 Nuxt에서 Quasar를 끌어다 쓰는 플러그인도 있는걸 보면 그냥 단순한 Design Framework로만 보면 되는거 같기도 한데, 또 Nuxt처럼 라우팅 방식이 바뀌는게 아니라 SPA에서 Router 사용하듯이 하니... Quasar를 Nuxt 대체품으로 생각해도 괜찮은건가요? 아니면 그냥 Bootstrap 같은 Design Framework로만 보는게 맞을까요?
퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)
npm run dev를 해도 브라우저 화면에서 안나옵니다. 그러다가 constants.js파일에서 썼던 아래의 소스를 지워보았더니 그럼 또 잘나옵니다. 제가 뭔가 잘못 넣은걸까요??? export default boot(({ app }) => { app.config.globalProperties = 'Hello Quasar!!'; }); 그리고 두번째 질문은 터미널에 npm run dev를 할때마다 http://localhost:9001/#/ , http://localhost:9002/#/,http://localhost:9003/#/ 이렇게 로컬호스트 번호가 증가하는데 제가 run을 계속해서 그런건가요??
퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)
안녕하세요. 강사님 강의 잘 보고 있습니다. quasar scss 파일 추가하고 스타일 커스터마이징 하고 싶은데 quasar.variables.scss에 기존방식처럼 app.scss에 @import url(custom.scss) 해서 넣으니... 에러가 떠서... 작업이 안되는데 혹시.. 따로 스타일 파일 추가하는 방식이 있을까요? 부탁드립니다.
퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)
안녕하세요, vue3 기본, 실전 강좌에 이어 quasar 강좌도 알차게 구성해주신 덕에 생소한 세계에 잘 진입할 수 있었습니다. 감사합니다. quasar 강좌수강 중 의문이 생겨 아래와 같이 질문드립니다. 질문 1. <q-list :style="{'min-width': 100}"> <q-list style="min-width: 100px"> 위의 두 가지는 같은 결과를 보여주는 것을 확인했습니다. :(v-bind) 의 유무가 { }(중괄호) 사용 여부에 영향을 준 것일까요? 어떤 영향을 준 것일까요? 질문 2. const leftColStyle = computed (() => ({ hidden: $ q.screen.lt. md })); 위 코드에서 { }(중괄호)을 ( )(소괄호)로 한번 더 감싼 이유는 뭘까? 질문 3. const totalCount = computed(() => response.value.headers['x-total-count']); 위 코드에서 response.value.headers['x-total-count’]에는 string값이 담겨 있는데, 이를 다시 반응형 데이터로 바꾸기 위해 computed를 사용했다는 설명을 해주셨습니다. computed는 연산을 위해 사용한다고 이해했는데, 일반 데이터를 반응형으로 바꿀 때 사용한다고 하니 어리둥절합니다. 아래와 같은 방식으로 반응형으로 변환하는 것에는 어떤 문제가 있을까요? const totalCount = ref(response.value.headers['x-total-count']) 질문 4. flex와 row, column은 동급의 개념일까요? container 안에서, container에 포함된 items들을 helper classes들을 통해 배치하는 것은 flex와 row/column이 동일하다고 생각했습니다. 차이..점을 모르겠습니다. column은 flex-direction이 column인 flex일 뿐이라는 생각이 듭니다. flex flex-center row를 사용하면 items-center, justify center를 사용해야했던 것을 flex를 사용하면 flex-center로 한 번에 정렬 가능하다는 정도의 차이도 확인했고요.
퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)
안녕하세요 좋은 강의 만들어주셔서 감사드립니다. 인스타그램 만들기를 따라해보고, 화면을 줄였을 때 (닉네임 - 프로필 편집과 설정)을 row에서 column으로 바꿔보고 싶었습니다 쉬울 것 같았는데 도저히 방법을 모르겠어서 질문드립니다 class에서 row에서 column으로 너비에 따라 바꾸는 방법이 있나요?
