묻고 답해요
131만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨Vue 3 & Firebase 10 커뮤니티 만들기 풀스택 - "활용편" (with Pinia, Quasar, Tiptap, VueUse)
env 환경변수 설정하는 방법이 궁금합니다.
안녕하세요.해당 강의 수강하면서 프로젝트 진행 중에 궁금한 점이 있어 질문드립니다.실무 환경에서 axios를 이용해 API 호출을 한다고 가정하였을 때, [local, stage, prod] 와 같은 다양한 환경에 대하여 API 호출 도메인이 달라지게 됩니다.vite를 사용하였을 때에는 .env.local, .env.stage, .env.prod와 같이 환경에 따른 변수를 지정하고, vite --mode local 과 같은 형태로 실행하는 환경을 설정할 수 있었는데요.이러한 다양한 환경에 다른 값을 지정해야할 떄에 어떻게 사용하시는지 궁금합니다.
-
해결됨Vue 3 & Firebase 10 커뮤니티 만들기 풀스택 - "활용편" (with Pinia, Quasar, Tiptap, VueUse)
IntelliJ 환경에서 UnpluginViewRoute 설치 후 route 태그를 읽지 못하고 있습니다.
인텔리제이에서 작업해야하는 환경이라 최대한 환경설정을 맞추면서 하고 있습니다 router들은 잘 반영이 되어있고 화면에서도 Default Layout 은 적용되어 있는 상태인데, route 태그를 통해 meta 및 layout을 변경하려고 할 때 적용이 되지 않습니다.혹시 이유를 알 수 있을까요?
-
미해결Vue.js 시작하기 - Age of Vue.js
computed와 watch 관련 질문 드립니다.
watch까지만 들었을 때는 오히려 명확하게 다르다고 생각했었는데, computed와 watch을 비교하는 과정 속에서 살짝 혼동이 와서 질문드립니다.제가 이해하기로 사용법에 있어서도 그렇고, computed의 경우 특정 element 'a'의 상태 변화에 따라 영향받는 다른 element 'b'의 상태를 미리 계산해서 갖고 있기 위해 수행되는 부분이고watch의 경우 'a'의 상태 변화시 수행되어야 할 함수들(콜백함수처럼)을 정의하면 된다고 생각을 했었는데, 이렇게 이해하면 될까요??
-
미해결Vue.js - Django 연동 웹 프로그래밍 (실전편)
taggit
안녕하세요 강사님, Post model 구현하는 과정에서from taggit.managers 이 부분이 저는 계속 밑줄이 뜨는데 왜 이러는 걸까요? ㅠㅠ
-
미해결Vue.js - Django 연동 웹 프로그래밍 (실전편)
질문입니다 !!
안녕하세요 강사님, 5:41 부분에서 safe=True 라고 설명해주셨는데, 이 부분이 잘 이해가 안돼서요.list 데이터 전달해주는 위의 메서드에서는 safe=False 로 두셨는데 왜 이렇게 다르게 하는지 잘 모르겠습니다..... ㅠㅠ 구글링으로 찾아봐도 잘 와닿지 않아서 질문 드립니다 ㅜㅜ
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
todoItem.item이 왜 key가 될까요?
안녕하세요 강사님!어플리케이션 탭을 보면 엄연히 key, value가 있고 value 안에 completed, item이 있는 건데...todoItem.item이 어떻게 키값이 되는건지 궁금합니다.처음 설정할 때 key값과 todoItem.item을 같게(?) 해놓으면 todoItem.item을 key 값으로 접근할 수 있나요?만약 key(id값)으로 접근하려면 어떻게 해야 하나요?초보라 질문이 많습니다 ㅠㅠ 시간되실 때 답변해주시면 감사드리겠습니다 :)
-
미해결Vue.js 시작하기 - Age of Vue.js
router 로 페이지 이동 시 항상 새로고침
안녕하세요, 캡틴판교님.덕분에 Vue 강의 잘 듣고 있습니다.한가지 질문 사항이 있는데요.메인페이지와 서브페이지를 구현했는데,메인페이지에서 스크롤을 내리면 서브페이지로 가는 router-link를 클릭했는데,메인에서 스크롤 내린만큼 서브페이지도 스크롤이 내려가 있어서이것을 어떻게 해결해야될지 의문입니다.제가 메인페이지에 애니메이션도 준게 있어서router 이동시에 항상 페이지 새로고침 되게 하고 싶습니다.(+추가로 새로고침이 아닌 메인 이동시에 애니메이션이 재 사용되게 막게끔도 하고 싶습니다..)
-
미해결호돌맨의 요절복통 개발쇼 (SpringBoot, Vue.JS, AWS)
Validation Map으로 구현된걸 List로 바꿔봤는데 이 방식이 맞을까요?
이렇게 바꿔봤는데 Body = {"code":"400","message":"잘못된 요청입니다.","validation":[{"fieldName":"content","errorMessage":"내용을 입력해주세요"},{"fieldName":"title","errorMessage":"제목 을 입력해주세요"}]} 이렇게 배열로 응답이 갈수있게 바꿔봤는데 괜찮을까요?
-
미해결Vue.js - Django 연동 웹 프로그래밍 (실전편)
질문이 있습니다.. !!
안녕하세요 강사님, post list 기능이 정상적으로 작동합니다.그런데 혹시 최신 포스팅을 목록 가장 상단에 위치하게 하고싶은데, 이건 어떤 속성을 건드려야 하나요? (수정된 건 영향을 주지 않고요 !)질문이 너무 많아서 죄송합니다 ㅜㅜ
-
미해결Vue.js - Django 연동 웹 프로그래밍 (실전편)
context 변수
안녕하세요 강사님, api/view.py 에서 context 변수가 데이터가 전달되는? 딕셔너리 변수인 것은 알겠습니다. 그런데정의를 해주지 않았는데 어떻게 딕셔너리 변수가 되며, object_list 라는 키도 따로 context 변수에 넣어주지 않았는데 어떻게 바로 context['object_list'] 로 qs 변수에 저장할 수 있나요?그리고 object_list 또한 어떻게 Post 모델에서 포스팅 목록을 가져올 수 있는 건지 이해가 안됩니다 ㅠㅠ 이런거는 다큐먼트를 봐야 이해할 수 있을까요? ㅜㅜ
-
미해결Vue.js - Django 연동 웹 프로그래밍 (실전편)
AUTH_USER_MODEL
안녕하세요 강사님,6:18 부근에서요, settings.py 에 AUTH_USER_MODEL='account.User' 을 명시해주시는데, Post 모델과 같이 다른 데이터를 받는(?) 모델은 이런 설정을 추가 안해주고, 유저 모델만 이렇게 명시를 해주어야 하는 이유가 있나요?그리고 이렇게 유저 모델 설정을 안해주면 문제가 발생할까요?
-
미해결퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)
다크 모드 처리 관련하여 질문드립니다.
안녕하세요, 퀘이사 다크 모드 사용과 관련하여 질문이 있어 글을 남기게 되었습니다.퀘이사 Documentation을 보게 되면, 다크 모드를 토글했을 때 body에 .body--light / .body--dark가 변경되어 나타나기 때문에 이를 활용하여 모드 별 스타일링을 진행하는 것을 확인했습니다. 그런데 이 부분이 다소 불편하여 (혹은 제가 제대로 사용하지 못하고 있는 상황이라) 질문드립니다.프로젝트를 진행하면서 css파일을 세분화시킬 필요성을 느끼고 있고, 이를 진행하고 있습니다.특정 Vue 파일에서만 필요한 클래스에 대한 스타일링은 해당 Vue 파일의 <style scoped lang="sass">로 처리하고 있고, 범용적으로 쓰는 것들은 app.scss에서 관리하고 있습니다.그런데 다크모드와 라이트모드일 때 scss 변수의 값이 달라지는데 이를 다른 scss파일에서 사용하는 데 문제가 있습니다.다크모드와 라이트모드의 scss 파일의 내용 예시는 아래와 같습니다. 변수명은 같고 값만 다른 상황입니다. // dark.scss $color-text-primary: #ecf3f0; $color-text-secondary: #c6cdc9; ... // light.scss $color-text-primary: #161816; $color-text-secondary: #747676; ...모드에 따라 달라지는 변수들을 적용하기 위해서 현재 제가 생각한 방식은 결국 색상 별 파일을 따로 분리하여 색상과 관련된 코드는 해당 부분에서 .body--dark, .body--light로 모든 클래스의 색상을 변경해야 되는 상황으로 이어져서 질문드립니다.// dark-mode.scss .body--dark { .border-bottom { ... } } // dark-mode.scss .body--dark { .border-bottom { ... } } Quasar.variables에 $변수를 일괄적으로 등록하는 방법을 사용한다면, 모드 별 변수 명을 다 다르게 설정하고, .body--dark / .body--light에 각 클래스 별로 변수를 사용하는 방식을 진행해야 합니다. 모드 별로 변수명을 다르게 하는게 나을지, 아니면 같게 한 다음에 편하게 처리하는 방식이 있는지 궁금합니다.2. 1번과 관련된 내용인 것 같습니다. 가능한 상황인지는 모르겠지만, quasar.variables.scss 등에서 isDark(다크모드여부)를 감지하여 $변수명: dark ? '#aaa' : '#000' 등으로 일괄 처리를 할 수 있는 방식은 없는지 알고 싶습니다.3. css파일이 세분화됨에 따라서 만약 모드에 따른 $변수를 두 파일에서 나누어서 관리한다면, app.scss 등과 같이 해당 변수가 정의되어 있지 않는 곳에서 특정 변수 명을 사용한다면 모드에 따른 scss파일을 감지하는 방식이 있는지 궁금합니다. 감사합니다!!
-
미해결Vue.js - Django 연동 웹 프로그래밍 (실전편)
npm run serve 후 빈페이지
안녕하세요 강사님, 말씀해주신대로 버전을 맞추어서 진행해보았더니 (영상에 맞추어 다운그레이드 하였습니다.) 빌드가 성공적으로 되었습니다. 그런데 npm run serve 를 해보니 빈페이지가 나와서요 ㅠㅠ 구글링 해보니 라우터 얘기가 많은데, 이전에 vue 가볍게 따로 공부했을 때 router 설치는 했었지만 이 프로젝트에서는 아직 따로 다루지는 않았는데 이게 관련이 있을 수 있나요?어디서 문제가 생긴지 어떻게 알 수 있을까요? npm run serve 하면 오류가 뜨지는 않습니다.아래는 제 프로젝트 빌드 후 생성된 파일들 입니다.아래는 vue.config.js 코드 입니다.module.exports = { transpileDependencies: [ 'vuetify' ], devServer: { index: 'home.html', proxy: { '^/api': { target: 'http://127.0.0.1:8000', }, '^/admin': { target: 'http://127.0.0.1:8000', } } }, pages: { home: { template: 'public/index.html', entry: 'src/pages/main_home.js', filename: 'home.html', title: 'Home', minify: false, }, my_blog: { template: 'public/index.html', entry: 'src/pages/main_my_blog.js', filename: 'my_blog.html', title: 'My_blog', minify: false, }, post_detail: { template: 'public/index.html', entry: 'src/pages/main_post_detail.js', filename: 'post_detail.html', title: 'Post_detail', minify: false, }, login: { template: 'public/index.html', entry: 'src/pages/main_login.js', filename: 'login.html', title: 'Login', minify: false, }, sign_up: { template: 'public/index.html', entry: 'src/pages/main_sign_up.js', filename: 'sign_up.html', title: 'Sign_up', minify: false, }, }, css: { extract: { ignoreOrder: true }, }, }
-
해결됨Vue3 완벽 마스터: 기초부터 실전까지 - "기본편"
vue framework 관련
안녕하세요 vue를 공부하다가 궁금한 점이 있습니다.컴포넌트는 사용할 때 마다 새로운 인스턴스가 생성된다고 하셨는데 이 인스턴스들을 관리(생성, 소멸 등)하는 vue framework(백엔드의 spring framework 같은) 인스턴스는 따로 존재하지 않나요?
-
미해결호돌맨의 요절복통 개발쇼 (SpringBoot, Vue.JS, AWS)
안녕하세요!
혹시 시즌3 자료는 받을수 없을까요?!
-
미해결Vue.js 시작하기 - Age of Vue.js
아주 기본적인 질문(링크가 어딨나요? ㅠ)
강의 중간 중간에 참고 문서 링크가 있다고 하셨는데, 링크는 어디를 보면 될까요? 잘 못 찾겠습니다. ㅠㅠ
-
미해결호돌맨의 요절복통 개발쇼 (SpringBoot, Vue.JS, AWS)
SecurityFilterChain 서블릿 매핑 오류 관련...
@Beanpublic SecurityFilterChain securityFilterChain(HttpSecurity http) throws Exception{return http.authorizeHttpRequests().requestMatchers("/auth/login").permitAll() .anyRequest().authenticated() .and().csrf(AbstractHttpConfigurer::disable) .build(); }기존의 강의에 나온 위 코드를 실행하게 되면, This is because there is more than one mappable servlet in your servlet context: {org.springframework.web.servlet.DispatcherServlet=[/], org.h2.server.web.JakartaWebServlet=[/h2-console/*]}.위와 같은 DispatcherServlet과 h2-console의 서블릿이 하나 이상 매핑되어 나는 오류라고 나옵니다.@Bean public SecurityFilterChain securityFilterChain(HttpSecurity http, HandlerMappingIntrospector introspector) throws Exception{ http.authorizeHttpRequests((authz) -> { try { authz .requestMatchers(new MvcRequestMatcher(introspector,"/auth/login")).permitAll() //애는 권한 없이도 허용 .anyRequest().authenticated() //나머지는 인증해 .and() //csrf쪽으로는 builder가 이어지지 않기 때문에 and로 이어준다. .csrf(AbstractHttpConfigurer::disable); } catch (Exception e) { throw new RuntimeException(e); } }); return http.build(); }그래서 검색 결과 위와 같이 작성하게 되면 정상적으로 실행되게 됩니다.- 질문제가 코드를 기존에 SecurityFilterChain 외 잘못 작성한 부분이 존재해서 위와 같이 코드를 작성해야 하는 것인지, 아니면 그 사이에 이렇게 작성되도록 변경된 것인지 앞으로도 지속적으로 검색해보겠지만... 현재까진 답을 찾지 못해 질문드립니다.2. h2-console의 경우 데이터베이스 관련 서블릿이고, DispatcherServlet은 웹 애플리케이션의 컨트롤러 역할을 하는 서블릿인걸로 알고 있는데 용도가 다른 두 서블릿의 매핑 혼동이 일어나는 이유가 궁금합니다...*무지한 한 생명체의 질문은 천천히 쾌차하시고 삶의 여유를 되찾으신 다음 답변해주시면 감사하겠습니다!
-
미해결Vue3 완벽 마스터: 기초부터 실전까지 - "실전편"
텔레포트 할때, 영상에서 페이지네이션 active 부분
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요 선생님 모달을 텔레포트 후 오픈 했을때, 페이지네이션 액티브 부분이 조금 이상해서요,, 영상에서도 그렇구요 어떤게 문제인지 어떻게 해결해야할지 궁금해서 문의 남깁니다 .
-
미해결Vue3 완벽 마스터: 기초부터 실전까지 - "기본편"
질문드립니다.
안녕하세요~ 처음에 v-base3 눌러서 만들면<template> <div> </div> </template> <script> export default { setup () { return {} } } </script> <style lang="scss" scoped> </style>이렇게 , 이런 콤마 하나도 없이 나오던데, 강사님은 어떻게 콤마가 있는건가요?
-
해결됨Vue 3 시작하기
컴포넌트간의 데이터 이동에 대해
안녕하세요.동일 레벨 컴포넌트간에 데이터를 주고 받는 방법에 대해 레벨1 -루트레벨2 - 컴포넌트a, 컴포넌트b인경우컴포넌트a -> 루트 -> 컴포넌트b 라고 수업내용에서 배웠습니다.그렇다면 계층이 더 깊은 경우는 어떻게 되나요?예를 들어 컴포넌트 구조가 레벨1 -루트레벨2 - 컴포넌트a-1, 컴포넌트b-1레벨3 - 컴포넌트a-2, 컴포넌트b-2인경우 (트리구조 비슷한?)컴포넌트 a-2에서 b-2로 전달하려면 컴포넌트a-2 -> 컴포넌트a-1 -> 루트 -> 컴포넌트b-1 -> 컴포넌트b-2 이런식으로 루트를 통해야 되나요? 그리고 a-2옆에 같은 레벨의 a-3이 있다면,이또한 루트까지 데이터를 올린다음 내려 받아야 할까요? 이런 느낌입니다.