월 15,400원
5개월 할부 시다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
79강 main.js
저는 main.js 코드가 캡틴판교선생님과 왜 다를까요? cli설치하고vue create로 프로젝트 만들때 버전이나 뭐 그런거 다 똑같이 했거든요,. 그래서 vue.use(ChartPlugin)을 사용할 수가 없습니다. 그래서 선생님과 동일하게 코트를 바꿔봤어요. 그리고 돌려봤는데..이런 에러 이런 에러가 떨어집니다..
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
안녕하세요. 질문이 있습니다.
안녕하세요. 질문이 있습니다. 74강 chart 프로젝트 생성부분입니다. chart.js import에러가 나네요 , chart.js 모듈은 설치해서 패키지.json에 있습니다(두번째 사진) 2. 그리고 저도 eslint때문에 이런 에러가 나는데요 config.js 만들어서 이거 넣어줄라고 했더니 이미 vue.config.js파일이 있더라구요? cli로 프로젝트 만들때 생성된 것 같아요 module.exports = { devServer: { overlay: false } } 그 안에 보면 이미 이렇게 작성이 되어있어요 그래서 제가 알려주신 코드 추가하면 이렇게 에러가 나오는데 이렇게 하는게 아닌가요?
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
actions와 mutations 에 정의한 함수들의 인자
강사님 제가 vuex에 대해 이해하지 못하고 있는 것 같아요ㅠㅠ actions에 정의한 FETCH_NEWS()나 FETCH_JOBS()가 받는 인자 context( 또는 { commit }) 는 어디서 온 건가요? mutations에 정의한 SET_NEWS(), SET_JOBS()의 두번째 인자는 commit 에서 같이 넘겨줘서 이해가 되는데, 첫번째 인자 state는 어디에서 온 건가요? 이것들은 그냥 actions와 mutations를 정의할 때 필수적으로 첫번째 인자로 넘겨주어야 하는 건가요?
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
bus.$emit('') 방식에 대해 질문이 있습니다
강의에서 조금 벗어난 질문이지 않을까 싶어서 혼자서 찾아보다가 결국 도움을 요청드려봅니다,, vue3 composition API 방식으로 해당 프로젝트를 다시 작성하고 있는 중입니다. 해당 강의의 bus.$emit('start:spinner"); 부분을 vue3 로 다시 작성중인 상태입니다. import 한 bus 로 이벤트를 emit 하는 부분에 있어서 bus.emit 을 사용하면 emit 이 사용되지 않았다는 에러가 뜨는데 이 부분을 혹시 어떻게 바꿔줘야 할까요..? 다른글에 답변해주신 글을 보니 이번 강의에서는 bus를 활용하지 않아도 무방하지만, 앞으로 이용할 일이 있을거같아서 질문드려봅니다. .
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
eslint
아래 첨부한 사진처럼 vue.config.js를 만들어서 exports를 입력했을 때, 서버는 돌아가지만 다른 eslint의 조건을 만족하지 못 하는 파일들에서 빨간색으로 오류가 떠있는 현상이 발견됩니다. lintOnSave:false는 서버에서만 eslint를 동작하지 않게하는 문법인건가요? 아니면 파일들도 오류없이 떠야 정상인가요?
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
actions에서 state접근하기
actions에서 state에 접근할 수 없다고 하셨는데요~ context에 보면 state를 가지고 있어서 context.state.news 로 접근이 가능하였습니다. 접근은 가능하지만 이렇게 사용하는게 좋지 않은건가요? 이렇게 접근하는경우 단점이나 문제점은 뭐가있을까요?
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
권한 요청 드립니다
- 인프런 아이디 : hyoni0712@gmail.com - 인프런 이메일 : hyoni0712@gmail.com - 깃헙 아이디 : hyoni0712@gmail.com - 깃헙 Username : hyoniiii
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
404에러
좋은 강의 감사드립니다!!! 제가 직접 express와 mongoDB를 이용해서 간단한 서버와 DB통신을 하고 있습니다. local에서 사용할 때는 문제가 없었는데 Netlify를 이용하려고 하니까 계속 404에러가 뜨고 있습니다. 위 이미지에서와 같이 제 리포지토리의 폴더는 두 개로 구성되어있고 이에 따라 이렇게 빌드 세팅을 진행하였습니다. console로 에러가 나는 지점을 찾아볼 때, 프론트에서 요청을 할 때 위 이미지의 return login.post('/', userData); 에서 에러가 나고 있는 것 같습니다. 그래서 제가 생각하기에 에러의 원인이 Netlify에서 build한 후에 서버관련 로직들을 인지하지 못하는 거 같습니다. 어떻게 해야할지 조언 부탁드리겠습니다. 감사합니다.
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
git 리포 권한 요청드립니다
- 인프런 아이디 : nrudev@naver.com - 인프런 이메일 : nrudev@naver.com - 깃헙 아이디 : nrudev812@gmail.com - 깃헙 Username : nrudev
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
콘솔 에러 문의
아래 그림과 같이 콘솔창에서 에러가 발생합니다. 하지만 VSCode에서 찾아본 결과 sub 함수를 정의하지 않은 것으로 확인 됩니다. 혹시 이러한 문제가 왜 발견되는지 알려주실 수 있으실까요?
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
spinner 타입에러가 납니다.
app.js: 1032 Uncaught TypeError: vue__WEBPACK_IMPORTED_MODULE_0__.default is not a constructor 이렇게 에러가 뜨는데... 어떻게 해결해야 할까요?
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
권한요청
인프런 아이디 : eony1010@gmail.com인프런 이메일 : eony1010@gmail.com깃헙 아이디 : eony1010@naver.com깃헙 Username : jieony 안녕하세요. 강의 잘 듣고 있습니다. gist에 글 남겼고 권한 추가 해주셨다고 했는데 접근이 안 돼서 다시 요청드립니다. 참고로 깃헙 계정 로그인한 상태로 접근했습니다..🥲 감사합니다.
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
해당 부분 git branch 문의
Vuex 적용하는 부분부터 실습 따라하고 싶은데 git branch 어디로 이동 후 실습 진행하면 될까요?
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
권한요청 드려요
인프런 아이디 : sdw74@vaiv.kr 인프런 이메일 : sdw74@vaiv.kr 깃헙 아이디 : sdy74@naver.com 깃헙 Username : sdw74
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
컴포넌트 간 통신은 어느 정도가 적당할까요?
예전에 다른 곳에서 읽기를, 부모 컴포넌트와 자녀 컴포넌트 간 통신을 너무 많이 하게 되면 둘을 분리하는 의미가 퇴색되기 때문에 둘의 독립성을 보장해주는 게 좋다... 라는 내용을 접했던 것 같은데요. 강사님의 강의를 vue중급 강의부터 들어오면서 보면 컴포넌트를 최대한 쪼개고 연산은 최대한 중앙으로 집중시키려고 하시는 것 같아서요. 근데 또 부모 자식간의 직접 적인 통신이 아닌 store를 이용한 간접적인 통신은 또 앞 문단의 지적과는 다른 차원의 문제이지 않나 싶어서요! 컴포넌트를 어느 정도로 분리하고, 각자의 역할과 통신을 어느 정도로 지향하는게 이상적이라 생각하시나요?
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
크롬 뷰 개발자 탭에서 Vuex를 찾을수 없는경우는 어떤경우가 있는지 알수있을까요?
크롬 개발자도구 탭에서 components 탭만 보여지고 Vuex탭은 따로 보여지는 부분이없는데, 혹 어느부분을 손대야할지 알 수 있을까요?
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
mixin에서 기존 fetch내용을 주석처리 해야 하나요?
영상의 진행과 제 실행결과가 좀 달라 질문드립니다. 영상 내용에서, /news 라우트에 beforeEnter() 안에 fetch 하는 내용을 집어넣으면서, ListMixin안에 있던 fetch하는 코드를 제거하신 건지 아닌지 영상에서는 명확하지가 않습니다. 영상 속에서는 웹페이지가 ask->news로 라우트를 변경할 때는 아무것도 변화가 없고, ask->jobs로 라우트를 변경할 때는 잘 변경됩니다. 영상 속에서 ListMixin의 fetch하는 코드를 제거한 건지 그대로 두고 진행한 건지 헷갈려서 저는 두 가지 모두로 진행해봤는데요, 어느 경우에도 영상과 같은 결과가 나오지 않았습니다. 우선 내비게이션 가드는 위와 같이 news에만 적용한 상태이고, ask와 job는 건들지 않았습니다. next();를 끝에 첨가하지 않은 상태입니다. 1. ListMixin의 fetch하는 코드를 제거하지 않은 경우 위와 같이, ask-> news로 넘어갈 때 news 컴포넌트는 로딩이 되지 않지만(여전히 ask가 검정색입니다.) 아래의 list-item은 news 를 fetch한 결과대로 바뀌어 있습니다. 영상 속에서는 아예 ask가 로딩되어 있을 때 모습 그대로였는데 말이죠. 제 생각에는 next(); 가 없어 아직 news 라우트로 넘어가진 않았지만 그 앞의 fetch()는 이미 진행이 되어 store의 list의 내용이 변경이 되었기 때문에 그것이 바로 반영된 것인 것 같습니다. ask->jobs로 넘어갈 때는 영상과 동일합니다. 2. ListMixin에서 fetch하는 코드를 제거한 경우 ㅇ ask->news로 넘어갈 때는 영상과 동일하게 아예 ask일때 모습그대로 변화가 없지만, 위 사진과 같이 ask->job로 넘어갈 때는 라우트는 완전 jobs로 변경이 되었지만, list-item들이 여전히 ask의 것입니다. beforeEnter는 routes/index.js에서 /news에만 적용되어있고, ListMixin에서조차 fetch하는 코드가 사라져서 jobs의 정보를 불러오지 못해 store.state.list의 내용이 바뀌지 않은 것이라고 생각했습니다. 그러나 영상에서는 ask->jobs로 넘어갈 때는 아무런 문제가 없죠. 정리하면, 영상 내에서와 같은 상황이 도저히 안 만들어집니다. ListMixin 속 fetch하는 코드를 없애지 않은 경우와 없앤 경우 둘다 시도해보아도 영상과 같은 상황은 나오지 않았습니다. 왜인지 알려주시면 감사하겠습니다!
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
부모/자녀 컴포넌트 간 created가 실행되는 순서
강의 잘 듣는 중입니다. 영상의 흐름을 따라 코드를 작성했는데, 페이지를 아예재로딩 했을 때는 spinner가 보이지 않고(startspinner, endspinner 이벤트로그도 안 뜹니다), 로딩 후에 다른 route로 넘어갈 때(ex:news->jobs) spinner가 보이더군요. 제 생각에는 자녀 컴포넌트인 newsview, askview, jobsview의 created가 부모 컴포넌트인 app의 created보다 먼저 실행되어서, app의 created 내용인 bus.$on이 자녀 컴포넌트가 보낸 이벤트를 받지 못해서 그런 것 아닐까? 라는 생각인데. 그래서 처음 로딩 할 때는 자녀의 이벤트를 받지 못했지만 이후에 route를 이동할 때는 이벤트를 인식하고 spinner가 보이는거구요. 이게 맞는 이해인지 궁금합니다.
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
mapGetters를 사용하면 자꾸 console에서 이와같은 에러가 나요
38강에서 dispatch로 vuex의 state데이터 가져오는데 거기서 mapper로 사용하려고 하면 꼭 저 console에 에러가 나는데 왜그럴까요? 구글링해도 안나오네요, 화면에 데이터는 잘 가져오는데 콘솔에러가 나요 vuex버전문제인가요? 3.0.1버전입니다.
- 미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
공통컴포넌트구현 computed 강의 질문
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키computed: { listItems() { const name = this.$route.name; if (name === "news") { return this.$store.state.news; } else if (name === "ask") { return this.$store.state.asks; } else if (name === "jobs") { return this.$store.state.jobs; } }, }, };며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 이렇게 코드를 쳤는데 똑같이 저는 에러가 뜨네요 error Expected to return a value in "listItems" computed property 컴퓨티드 속성은 리턴 값이 있어야 한다는거 같은데 return을 해주고 있는데도 에러가 뜨네요 어떻게 해결 하면 좋을까요?