44,000원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결Vue.js 시작하기 - Age of Vue.js
리액트와의 비교학습 중...
안녕하세요.리액트의 함수컴포넌트와 훅스에 익숙한데... 뷰를 사용할 일이 있어 빠르게 학습 중입니다..ㅠㅠ그러다보니 리액트와의 유사점, 차이점을 중점으로 학습중인데요..강의를 듣던 중 갑자기 의문이 들었는데, watch : 리액트의 useCallbackcomputed : 리액트의 useMemo이렇게 비슷하다고 이해했는데 맞는 이해가 맞을까요?!거기에 더해서 watch로 data를 변경하려면 다시 data 객체를 변경해야 하는데 computed는 값을 바로 돌려주기 때문에 성능적 이득이 있다라고 이해했습니다...틀린 점이 있다면 알려주세요 T_T감사합니다.
- 해결됨Vue.js 시작하기 - Age of Vue.js
vue cli 설치 질문..
1주일전에 질문 한 내용이 아직 답변이 없어서 해결을 하지 못하고있습니다. 제가 할 수 있는 방법들을 최대한 해봤는데 해결하지 못하고 있는 상태라 너무 답답합니다.. 도움좀 주시면 감사하겠습니다..ㅠ
- 해결됨Vue.js 시작하기 - Age of Vue.js
vue cli 설치 하는데 오류 해결을 못하고 있습니다.
node, npm 설치 잘 되여있는데 vue cli만 설치할려면 저런 오류가 뜹니다.cmd/cmder/powershell 들을 관리자 권한으로 실행해서 명령어를 쳐봐도 달라지는건 없었습니다.npm uninstall -g @vue/cli 하고 다시 명령어를 쳐도 똑같이 나옵니다powershell 권한 수정 그런것도 해보고 환경변수 설정도 다 해보고 Cmder.exe 도 다운받아서 npm install -g @vue/cli 명령어 치면 계속 오류만 뜹니다.해결방법을 알려주시면 감사하겠습니다..
- 미해결Vue.js 시작하기 - Age of Vue.js
학생할인 코드
학생할인코드 적용하여, 다른 강의도 들으려고 했는 데,이미 초과된 분량이라고 적용이 안되어서, 그냥 정가에 샀는 데, 할인 기간이 혹시 끝난걸까요?
- 미해결Vue.js 시작하기 - Age of Vue.js
VUE CLI INSTALL 오류
안녕하세요 검색을 해도 아래와 같은 오류에 대한 가이드가 없어서 문의드립니다. verbose cli C:\Program Files\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js 1 info using npm@8.19.3 2 info using node@v18.13.0 3 timing npm:load:whichnode Completed in 2ms 4 timing config:load:defaults Completed in 2ms 5 timing config:load:file:C:\Program Files\nodejs\node_modules\npm\npmrc Completed in 15ms 6 timing config:load:builtin Completed in 16ms 7 timing config:load:cli Completed in 2ms 8 timing config:load:env Completed in 2ms 9 timing config:load:file:C:\GitHubTemp\.npmrc Completed in 0ms 10 timing config:load:project Completed in 3ms 11 timing config:load:file:C:\Users\y1126.kim\.npmrc Completed in 0ms 12 timing config:load:user Completed in 1ms 13 timing config:load:file:C:\Users\y1126.kim\AppData\Roaming\npm\etc\npmrc Completed in 0ms 14 timing config:load:global Completed in 1ms 15 timing config:load:validate Completed in 0ms 16 timing config:load:credentials Completed in 1ms 17 timing config:load:setEnvs Completed in 1ms 18 timing config:load Completed in 30ms 19 timing npm:load:configload Completed in 30ms 20 timing npm:load:mkdirpcache Completed in 2ms 21 timing npm:load:mkdirplogs Completed in 1ms 22 verbose title npm i @vue/cli-service 23 verbose argv "i" "@vue/cli-service" 24 timing npm:load:setTitle Completed in 2ms 25 timing config:load:flatten Completed in 4ms 26 timing npm:load:display Completed in 7ms 27 verbose logfile logs-max:10 dir:C:\Users\y1126.kim\AppData\Local\npm-cache\_logs 28 verbose logfile C:\Users\y1126.kim\AppData\Local\npm-cache\_logs\2023-03-27T04_58_26_832Z-debug-0.log 29 timing npm:load:logFile Completed in 22ms 30 timing npm:load:timers Completed in 0ms 31 timing npm:load:configScope Completed in 0ms 32 timing npm:load Completed in 66ms 33 timing arborist:ctor Completed in 3ms 34 silly logfile start cleaning logs, removing 2 files 35 silly logfile done cleaning log files 36 timing arborist:ctor Completed in 0ms 37 timing idealTree:init Completed in 58ms 38 timing idealTree:userRequests Completed in 4ms 39 silly idealTree buildDeps 40 silly fetch manifest @vue/cli-service@* 41 silly placeDep ROOT @vue/cli-service@ OK for: want: * 42 timing idealTree:#root Completed in 133202ms 43 timing idealTree:node_modules/@vue/cli-service Completed in 0ms 44 timing idealTree:buildDeps Completed in 133203ms 45 timing idealTree:fixDepFlags Completed in 0ms 46 timing idealTree Completed in 133267ms 47 timing command:i Completed in 133306ms 48 verbose type system 49 verbose stack FetchError: request to https://registry.npmjs.org/@vue%2fcli-service failed, reason: connect ETIMEDOUT 104.16.19.35:443 49 verbose stack at ClientRequest.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\minipass-fetch\lib\index.js:130:14) 49 verbose stack at ClientRequest.emit (node:events:513:28) 49 verbose stack at TLSSocket.socketErrorListener (node:_http_client:496:9) 49 verbose stack at TLSSocket.emit (node:events:525:35) 49 verbose stack at emitErrorNT (node:internal/streams/destroy:151:8) 49 verbose stack at emitErrorCloseNT (node:internal/streams/destroy:116:3) 49 verbose stack at process.processTicksAndRejections (node:internal/process/task_queues:82:21) 50 verbose cwd C:\GitHubTemp 51 verbose Windows_NT 10.0.19042 52 verbose node v18.13.0 53 verbose npm v8.19.3 54 error code ETIMEDOUT 55 error syscall connect 56 error errno ETIMEDOUT 57 error network request to https://registry.npmjs.org/@vue%2fcli-service failed, reason: connect ETIMEDOUT 104.16.19.35:443 58 error network This is a problem related to network connectivity. 58 error network In most cases you are behind a proxy or have bad network settings. 58 error network 58 error network If you are behind a proxy, please make sure that the 58 error network 'proxy' config is set properly. See: 'npm help config' 59 verbose exit 1 60 timing npm Completed in 134110ms 61 verbose unfinished npm timer reify 1679893107628 62 verbose unfinished npm timer reify:loadTrees 1679893107659 63 verbose code 1 64 error A complete log of this run can be found in: 64 error C:\Users\y1126.kim\AppData\Local\npm-cache\_logs\2023-03-27T04_58_26_832Z-debug-0.log
- 미해결Vue.js 시작하기 - Age of Vue.js
화면에 내용이 보이지 않는 오류 발생
<div id="app"> <app-header></app-header><app-content></app-content><app-footer></app-footer></div><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> //전역 컴포넌트 Vue.component('app-header',{ template:'<h1>Header</h1>' }); Vue.component('app-content',{ template:'<div>content</div>' }); 이렇게 적어서 live server로 확인해보면 화면에 아무것도 안뜨는데, script 코드 문제일까요..?
- 미해결Vue.js 시작하기 - Age of Vue.js
공식문서와 차이
공식문서와 내용이 많이 다른 것 같은데해당 강의로 vue를 배워도 큰 문제는 없는 것인가요? ㅠㅜ
- 해결됨Vue.js 시작하기 - Age of Vue.js
main.js 파일의 import 부분에서 오류가 납니다.
main.js 파일의 import 부분에서 오류가 납니다. 이미 사전에 동일한 질문이 있길래 똑같이 적용시켜보려했지만 윈도우 10 환경이라 그런지저에게는 우측하단에 ESLint를 변경하는 버튼이 없더라고요.. 어떻게 해결해야 할까요..?
- 해결됨Vue.js 시작하기 - Age of Vue.js
v-on:이벤트명="메서드" 질문입니다
1) logText라는 메서드가 있을 때 v-on:pass = "logText()"v-on:pass = "logText"은 똑같이 동작하는데 그 이유가 뭔가요? 2) v-on:pass = "this.logText"도 안 되고 v-on:pass="console.log(1)" 도 안되는데 다른 예제들을 보니까 메서드 말고도 "" 안에 들어가던데요정확히 이 v-on:이벤트명 = "" 의 "" 안에는 뭐가 들어갈 수 있는 건가요?
- 미해결Vue.js 시작하기 - Age of Vue.js
왜 click 이벤트를 인지 못하나요?
app-header에 v-on:click="logText"를 추가하면 콘솔창에 'hi'가 두번 찍힐거라 예상했는데 hi가 한번밖에 안 찍히네요. 실험해보니까 app-header에서 this.$emit으로 전달한 pass이벤트만 인지되고 있고 click이벤트는 무시되고 있는 거 같은데 이유가 뭔가요?<body> <div id="app"> <app-header v-on:click="logText" v-on:pass="logText"></app-header> </div> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> var appHeader = { template: '<button v-on:click="passEvent">click me</button>', methods: { passEvent: function() { this.$emit('pass'); } } } var vm = new Vue({ el: '#app', components: { 'app-header': appHeader, }, methods: { logText: function() { console.log('hi'); } }, }); </script> </body>
- 미해결Vue.js 시작하기 - Age of Vue.js
v-model 속성과 submit 이벤트 처리에서 질문 있습니다!
event.preventDefault();를 사용했는데 콘솔창에 test 1234가 남지 않고 여전히 새로 고침이 됩니다. 구글링을 해봤지만 답을 찾는데 시간이 너무 소모되서 질문게시판에 올립니다 ㅠ아래는 제가 작성한 App.vue와 콘솔창 캡처본입니다
- 해결됨Vue.js 시작하기 - Age of Vue.js
콘솔에서 Uncaught ReferenceError가 뜹니다
현재 'Reactivity 코드 라이브러리화 하기'를 수강중인데Open with live server를 통해 콘솔에서 확인해보니viewModel.str을 할당되는건 정상적으로 되는데vue-way.html:38 Uncaught ReferenceError: Value is not defined at render (vue-way.html:38:29) at Object.set (vue-way.html:32:21) at <anonymous>:1:15 이런 에러가 자꾸 뜹니다정상적으로 실행되는건 확인했지만 자꾸 신경쓰이는데 혹시 vue-way.html에서 어느 부분을 수정해야 이 에러를 해결할 수 있을까요?
- 미해결Vue.js 시작하기 - Age of Vue.js
학생 할인 코드 게시물에 댓글에는 답장이 없으셔서 ㅠㅠ
학생 할인 코드를 받으려고 하는데요. 학생증 사진과 내용을 넣고 쿠폰 받는 페이지로 넘어가면 쿠폰 코드 오류라고 뜹니다... 돌아버리겠습니다. 어차피 vue js 다 들을거라서 중급도 수강하려 하는데 방법이 없나요? 그리고 또 궁금한 것은 강의마다 쿠폰 발급이 가능한가요? 수업과 관련 없는 내용이지만 답변 부탁드리겠습니다..
- 해결됨Vue.js 시작하기 - Age of Vue.js
vue tool에서 컴포넌트탭만 있고 다른탭은 보이지 않습니다
안녕하세요..다름아니라 기본틀 문제라문의드립니다.vue tool에서 컴포넌트탭만 있고 다른탭은 보이지 않습니다.event발생 시 값을 봐야하는데강의를 따라가는데 문제가 있어 문의 드립니다.
- 미해결Vue.js 시작하기 - Age of Vue.js
'axios is defined but never used 오류
import axios from 'axios';를 입력하니 아래 오류가 떳습니다.'axios is defined but never used 다른 글을 참고 하여 vue.config.js에 추가해도 안되네요// vue.config.js module.exports = { devServer: { client: { overlay: false } }package.json에 추가해도 안됩니다. "rules": { "no-unused-vars": "off" } 하단에 2known issues 에 이런 오류창이 뜨는데 이것때문일까요 ?ㅜ
- 미해결Vue.js 시작하기 - Age of Vue.js
vue event가 없습니다.
vue는 있는데 events tab이 없습니다. 이게 맞는건가요?
- 미해결Vue.js 시작하기 - Age of Vue.js
안녕하세요! 질문드릴게 좀 있습니다
강의 잘듣고 있습니다, 하나 궁금한점 있어 문의 드립니다. Vue.js 애플리케이션 빌드 후 아파치 웹서버에 배포 후 새로고침 하니까 404 페이지가 뜹니다. 이 문제를 어떻게 해결 할 수 있을까요?
- 미해결Vue.js 시작하기 - Age of Vue.js
MAC VUE CLI설치 오류
username@SHY-Macui-MacBookPro ~ % npm install -g @vue/clinpm ERR! code ENOTEMPTYnpm ERR! syscall renamenpm ERR! path /Users/username/.npm-global/lib/node_modules/@vue/clinpm ERR! dest /Users/username/.npm-global/lib/node_modules/@vue/.cli-Dh8F17aCnpm ERR! errno -66npm ERR! ENOTEMPTY: directory not empty, rename '/Users/username/.npm-global/lib/node_modules/@vue/cli' -> '/Users/username/.npm-global/lib/node_modules/@vue/.cli-Dh8F17aC' npm ERR! A complete log of this run can be found in:npm ERR! /Users/username/.npm/_logs/2022-11-25T08_12_29_546Z-debug-0.log=======================================================vue cli 설치를 했는데 버전 확인이 안되고 프로젝트도 안만들어집니다.폴더에 직접 찾아가면 있긴해요 구글링으로도 해결이 안되서 문의 드립니다.
- 미해결Vue.js 시작하기 - Age of Vue.js
emit의 목적
완강 후 개념들을 확실히 숙지하려고 코드, 문법, 메소드등을 직접 기록하면서다시 강의를 보는 중입니다. <body> <div id="app"> <p>{{num}}</p> <!-- <app-header v-on: 하위 컴포넌트에서 발생한 이벤트 이름="상위컴포넌트의 메서드 이름" ></app-header> --> <app-header v-on:pass="logText"></app-header> <app-content v-on:increase="increaseNumber"></app-content> </div> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> var appHeader = { template: '<button v-on:click="passEvent">click me</button>', methods: { passEvent: function() { this.$emit('pass'); } } }; var appContent = { template: '<button v-on:click="addNumber">add</button>', methods: { addNumber: function() { this.$emit('increase'); } } } var vm = new Vue({ el: '#app', components: { 'app-header': appHeader, 'app-content': appContent }, methods: { logText: function() { console.log('hi'); }, increaseNumber: function() { this.num = this.num + 1; } }, data: { num:10 } }); </script> </body> 위 코드에서 기능적인 메소드들은 상위컴포넌트 vm에 logText와 increaseNumber로 정의 되있으니 하위컴포넌트인appHeader와 appContent가 없어도 문법만 맞추면 해당 기능들을 구현하는데는 문제가 없을거라고 느껴집니다.그렇게 생각이 드니 여기서 emit의 기능은 이벤트의 이름을 정의해주는 것 같은데emit을 활용하는 방법을 더 알고싶습니다,이벤트의 이름을 정의하는 기능만 있다고 생각하면 뭔가 허전해서요실제로 혹시 프로젝트에서 emit은 어떤 용도로 사용될까요?
- 미해결Vue.js 시작하기 - Age of Vue.js
프로젝트를 해보고 싶습니다
기초 강의 완강했는데 배운 기능들을 되도록 많이 활용해서 프로젝트를하며 배운 걸 제 것으로 만들어보고 싶습니다.근데 프로젝트를 하는게 아직은 막막해서 뭘 해야할지 모르겠는데 혹시 추천해주실 프로젝트 없을까요?