월 22,000원
5개월 할부 시다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
babel polyfill 적용관련해서 질문드려도 될까요?
안녕하세요. 장기효님강의 모두 듣고 실제 프로젝트중 입니다. 그런데 SSR때문에 Nuxt를 이용해서 작업중인데요, 거의다 왔는데 IE11 에서 테스트 결과 몇몇 컴포넌트가 나오지 않습니다. IE에서 에러는 SCRIPT438: 개체가 'includes' 속성이나 메서드를 지원하지 않습니다. 라고 나오는데요... store.js 의 아래코드에서 에러발생합니다. if (VUEX_PROPERTIES.includes(moduleName)) { 검색해보니 바벨 폴리필 문제같아서 이것저것 시도해보고 있는데 3일째 해결이 안되고 있습니다.;;; 제가 뭘 잘못하고 있는건지 너무 답답해서 질문드립니다. 일단 저는 nuxt.config.js 파일의 build 부분에 아래처럼 설정했습니다. build: { extend(config, ctx) { config.module.rules.push({ enforce: 'pre', test: /\.(js|vue)$/, loader: 'eslint-loader', exclude: /(node_modules)/, options: { fix: true, }, }); }, babel: { presets(env, [preset, options]) { const envTargets = { client: { browsers: ['last 2 versions'], ie: 11 }, server: { node: 'current' }, }; return [ [ '@nuxt/babel-preset-app', { useBuiltIns: 'entry', targets: envTargets[env.envName], corejs: { version: 3 }, polyfills: ['es.array.iterator', 'es.promise', 'es.object.assign', 'es.promise.finally', 'es.array.includes', 'es.symbol'], }, ], ]; }, }, transpile: ['@nuxtjs/axios', 'gsap', 'swiper', 'vue-awesome-swiper', 'nuxt-fullpage.js', 'vue-datetime', 'vue-daum-postcode', 'vue-advanced-cropper'], }, 의존성은 아래처럼 설치했구요. 이것저것 해보면서 바벨관련해서 여러가지 설치한것 같아요. "dependencies": { "@babel/runtime": "^7.12.5", "@nuxtjs/axios": "^5.12.2", "@nuxtjs/moment": "^1.6.1", "babel-core": "^6.26.3", "babel-polyfill": "^6.26.0", "cookie-universal-nuxt": "^2.1.4", "gsap": "^3.5.1", "luxon": "^1.25.0", "nuxt": "^2.14.6", "nuxt-fullpage.js": "0.0.3", "regenerator-runtime": "^0.13.7", "swiper": "^5.4.5", "vue-advanced-cropper": "^0.17.9", "vue-awesome-swiper": "^4.1.1", "vue-datetime": "^1.0.0-beta.14", "vue-daum-postcode": "^0.9.0", "weekstart": "^1.0.1" }, "devDependencies": { "@babel/plugin-transform-runtime": "^7.12.10", "@babel/preset-env": "^7.12.11", "@babel/runtime-corejs3": "^7.12.5", "@nuxt/babel-preset-app": "^2.14.12", "@nuxtjs/eslint-config": "^3.1.0", "@nuxtjs/eslint-module": "^2.0.0", "babel-eslint": "^10.1.0", "babel-loader": "^8.2.2", "core-js": "^3.8.2", "eslint": "^7.10.0", "eslint-config-prettier": "^6.12.0", "eslint-plugin-nuxt": "^1.0.0", "eslint-plugin-prettier": "^3.1.4", "prettier": "^2.1.2", "whatwg-fetch": "^3.5.0" }, 제 설정에 무슨 문제가 있을까요? 오픈은 다가오는데 답답하네요.;;; 감사합니다!
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
nvm install 시 에러가 납니다.
질문 게시판 참고 및 하루종일 현상확인을 하였으나 이유를 모르겠습니다. 얼른 강의를 들어야하는데 답답하네요 ㅠㅠ 확인 부탁드립니다. 현상 해당 디렉토리에서 python (2.7.18) 설치 확인 후 (Add python.exe to Path 로 설치한 상태) nvm instll 10.16.3 할 경우 no python2.7 이란 결과와 함께 에러 노출 => python을 설치했음에도 동일한 결과 노출됩니다. 어떻게 해줘야 할 지 확인 부탁드립니다 ㅠㅠ 1. 현재 경로에서 python -v 으로 파이썬 설치 확인 2.7.18 2. npm install 시 에러 결과 $ nvm install 10.16.3 Can not determine how many core(s) are available, running in single-threaded mode. Please report an issue on GitHub to help us make nvm run faster on your computer! Local cache found: ${NVM_DIR}/.cache/src/node-v10.16.3/node-v10.16.3.tar.xz Checksums match! Using existing downloaded archive ${NVM_DIR}/.cache/src/node-v10.16.3/node-v10.16.3.tar.xz $>./configure --prefix=/c/Users/혜윤/.nvm/versions/node/v10.16.3 < which: no python2.7 in (/mingw64/bin:/usr/bin:/c/Users/혜윤/bin:/c/Python27:/c/Python27/Scripts:/c/Program Files (x86)/Wizvera/Delfino:/c/Program Files (x86)/NVIDIA Corporation/PhysX/Common:/c/Program Files (x86)/Intel/iCLS Client:/c/Program Files/Intel/iCLS Client:/c/WINDOWS/system32:/c/WINDOWS:/c/WINDOWS/System32/Wbem:/c/WINDOWS/System32/WindowsPowerShell/v1.0:/c/Program Files/Intel/Intel(R) Management Engine Components/DAL:/c/Program Files/Intel/Intel(R) Management Engine Components/IPT:/c/Program Files (x86)/Intel/Intel(R) Management Engine Components/DAL:/c/Program Files (x86)/Intel/Intel(R) Management Engine Components/IPT:/c/Program Files/Samsung/AllShare Framework DMS/1.3.23:/c/Program Files/Samsung/AllShare Framework DMS/1.3.23/64bit:/c/Program Files (x86)/Microsoft SQL Server/100/Tools/Binn:/c/Program Files/Microsoft SQL Server/100/Tools/Binn:/c/Program Files/Microsoft SQL Server/100/DTS/Binn:/c/Program Files/Intel/WiFi/bin:/c/Program Files/Common Files/Intel/WirelessCommon:/c/APM_Setup/Server/Apache/bin:/c/APM_Setup/Server/MySQL5/bin:/c/APM_Setup/Server/PHP5:/c/WINDOWS/System32/OpenSSH:/cmd:/c/Program Files/nodejs:/c/ProgramData/chocolatey/bin:/c/Program Files (x86)/Yarn/bin:/c/Program Files/Intel/WiFi/bin:/c/Program Files/Common Files/Intel/WirelessCommon:/c/Users/혜윤/AppData/Local/Microsoft/WindowsApps:/c/Users/혜윤/AppData/Local/Programs/Microsoft VS Code/bin:/c/Users/혜윤/AppData/Roaming/npm:/c/Users/혜윤/AppData/Local/Programs/Fiddler:/c/Users/혜윤/AppData/Local/Yarn/bin:/c/Users/혜윤/AppData/Python27) which: no python2 in (/mingw64/bin:/usr/bin:/c/Users/혜윤/bin:/c/Python27:/c/Python27/Scripts:/c/Program Files (x86)/Wizvera/Delfino:/c/Program Files (x86)/NVIDIA Corporation/PhysX/Common:/c/Program Files (x86)/Intel/iCLS Client:/c/Program Files/Intel/iCLS Client:/c/WINDOWS/system32:/c/WINDOWS:/c/WINDOWS/System32/Wbem:/c/WINDOWS/System32/WindowsPowerShell/v1.0:/c/Program Files/Intel/Intel(R) Management Engine Components/DAL:/c/Program Files/Intel/Intel(R) Management Engine Components/IPT:/c/Program Files (x86)/Intel/Intel(R) Management Engine Components/DAL:/c/Program Files (x86)/Intel/Intel(R) Management Engine Components/IPT:/c/Program Files/Samsung/AllShare Framework DMS/1.3.23:/c/Program Files/Samsung/AllShare Framework DMS/1.3.23/64bit:/c/Program Files (x86)/Microsoft SQL Server/100/Tools/Binn:/c/Program Files/Microsoft SQL Server/100/Tools/Binn:/c/Program Files/Microsoft SQL Server/100/DTS/Binn:/c/Program Files/Intel/WiFi/bin:/c/Program Files/Common Files/Intel/WirelessCommon:/c/APM_Setup/Server/Apache/bin:/c/APM_Setup/Server/MySQL5/bin:/c/APM_Setup/Server/PHP5:/c/WINDOWS/System32/OpenSSH:/cmd:/c/Program Files/nodejs:/c/ProgramData/chocolatey/bin:/c/Program Files (x86)/Yarn/bin:/c/Program Files/Intel/WiFi/bin:/c/Program Files/Common Files/Intel/WirelessCommon:/c/Users/혜윤/AppData/Local/Microsoft/WindowsApps:/c/Users/혜윤/AppData/Local/Programs/Microsoft VS Code/bin:/c/Users/혜윤/AppData/Roaming/npm:/c/Users/혜윤/AppData/Local/Programs/Fiddler:/c/Users/혜윤/AppData/Local/Yarn/bin:/c/Users/혜윤/AppData/Python27) ?[1m?[31mERROR?[0m: Did not find a new enough assembler, install one or build with --openssl-no-asm. Please refer to BUILDING.md nvm: install v10.16.3 failed!
- 해결됨Vue.js 끝장내기 - 실무에 필요한 모든 것
Vue.js 테스팅 심화 강의 문의
안녕하세요. Vue.js 테스팅 심화 강좌는 2020년 상반기 예정이라고 소개해주셨는데요. 2021년 1월 기준으로 아직 강좌가 열리지 않은 것이 맞을까요? 혹시 예상 일정에 대해서 알 수 있을까요? 감사합니다.
- 해결됨Vue.js 끝장내기 - 실무에 필요한 모든 것
인터셉터를 사용하는 이유에 대해서 질문 드립니다.
안녕하세요. [actions 속성을 이용한 로그인 기능 구현과 비동기 처리시 유의할 점] 강의까지 듣고 질문 드립니다. 페이지를 새로고침 하더라도 token 값을 유지할 수 있도록 Cookies를 이용하는 것은 이해를 했습니다. 그런데 인터셉터를 이용해서 HTTP 요청을 하기 전에 token 값을 싣는 과정의 필요성에 대해서 의문이 드는데요. -------- 인터셉터 이용하지 않고 아래와 같이 진행해도 되지 않나요? 1. [store/index.js] Cookies에 있는 token 값을 가져와서 Store에 저장하고 Cookies에 token이 없으면 빈 문자열로 초기화 2. [api/index.js] Store에 저장되어 있는 token 값을 가져와서 axios 인스턴스의 headers Authorization에 설정 -------- 어차피 인터셉터에서도 Store에 저장되어 있는 token값을 가져와서 API를 호출하기 직전에 headers Authorization에 설정하는 것인데 굳이 인터셉터에서 하지 않고 api/index.js 에서 설정해줘도 되지 않을까라는 생각이 듭니다. 감사합니다.
- Vue.js 끝장내기 - 실무에 필요한 모든 것
스웨거에서 posts 글을 입력하면 401에러가 발생합니다
삭제된 글입니다
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
모듈화 된 store를 다시 모듈화 할 수 있나요?
이렇게 나눈 store의 요소들을 다시 나누는게 가능할 까요? 예를 들면, 현재 store ㄴindex.js ㄴstate.js ㄴgetters.js ㄴmutations.js ㄴinit.js ㄴdraw.js 이런식으로 가능할까요? 이러한 방식을 사용하게 되면 somethig.function 이런식으로 앞에 붙여야하고, 이러한 방식을 사용하게 되면 import 할 때 목록를 { } 안에 모두 적어주어야 하는듯 한데, store에서 state, getters, mutations를 import할 때 처럼 함수명은 그대로 사용하고, 모든 함수를 한번에 import 할 수는 없을까요??
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
createPost 호출시 에러 => MongoError: E11000 duplicate key error collection
새노트 등록을 위해 createPost 호출시 MongoError 가 납니다. error 내용은 400 Bad Request 이며 자세한 사항은 아래와 같습니다.
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
로그아웃을 직접 누르지 않고 싸이트를 나가는 경우
로그아웃을 직접 누르지 않고 싸이트를 종료 시키면 쿠키에는 계속 정보가 남아서 로그인 상태가 계속 유지되는데 이를 막기 위해서는 실무에서는 보통 어떤 방법을 쓰나요? 생각할 수 있는 방법은 프론트에서 쿠키 만료시간을 쓰거나, 백엔드에서 토큰 만료시간을 정하던가 할 것 같습니다.
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
자동완성 Setting 질문
안녕하십니까.. 강의를 들으면서 실습을 하고 있는데 간혹 제대로 따라했는데 안되는 경우가 나와서 이리저리 Test 하면서 30분정도씩 시간을 까먹는 경우가 많았습니다. 그런데 그의 대부분이 철자가 상이(대, 소문자 구분)해서 발생이 되는데 자동 완성 기능을 사용하면 이런문제는 많이 줄어들것 같아서 문의 드립니다. 1. Install 하라는 Plug-in은 설치를 했는데 자동완성이 안되는 경우 case1) token 치는 중간에 강의에는 아래 빨간줄 부분이 보이는데 저는 빨간색 부분은 안보이고 나머지 부분만 보입니다 - 강의 화면 - 제화면 case 2번) import시 '@/' 치면 자동 완성을 위해서 Directory 명이 보여야 하는데, 저는 안보입니다 (그런데 어떤 경우인지는 모르지만 간헐적으로 보입니다) - import {} from '@/. case3) 나타나는 화면이 상이 - 강의 - 제 PC case 4) 강의화면 저는 안나옵니다 case 5) 아래 강좌에서 얘기하시던데 common CSS에 저장된 항목이 보여야고 한다고 하셨는데 저는 안나옵니다 제가 Test 하다보니 아래 에 Javescrip으로 되어있으면 Directory등 자동완성이 되는데 vue로 되어있으면 위에서 얘기한 자동 완성이 안되는것 같습니다
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
dropArea.html 이 네트웍에 나타나는데 ?..
기능은 정상적으로 동작합니다. 그리고 동일한 ID로 등록하면 Error가 나던데(409) 기존등록한 User 지울려면 어떻게 해야 하나요? 그런데 동작후에 약 10초후에 Network에서 아래 Message가 나타나네요 정상적인 것인가요?
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
next()에서 모달 띄우기2
저도 아랫분과 같은 질문이 있는데요 직접 해봤는데 정확히 beforeRouteEnter를 어디서 선언해야하는지 모르겠더라구요. router-view가 적혀진 template을 가지는 App.vue에 하는게 맞는거 같아서 다음과 같이 써 보았는데, 잘 작동이 되지 않는것 같습니다.
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
로그아웃 버튼 클릭 후에..(2)
인프런 - Vue.js 끝장내기 - 실무에 필요한 모든 것 | 페이지별 인증 권한 설정 (inflearn.com) 이번 강좌 첫번째 질문글에 대한 답변이 없어서 재업합니다. 저도 로그아웃 버튼을 클릭하면 당장 쿠키에는 값이 남아있고, 새로고침을 해야만 쿠키에서 사라집니다. 새로고침을 하지 않아도 사라지는 방법은 없는건가요?
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
환경구성 관련하여 질문드립니다.
안녕하세요. 강의 잘듣고 있습니다!! 강의를 듣고 이제 프로젝트 구성하여 진행하려고 합니다. 현재 구성 설계는 front end was spring boot + gradle + vue.js + webpack + vuecli back end was spring boot + gradle + jpa + oracle 아직 개념이 많이 안잡혀서요. 도움이 필요합니다!! 도와주세요 ㅠㅠ back 쪽은 위와같이 구성하여 api만들어서 호출하면될것같은데 front 쪽이 정확하게 개념이 안잡히네요 vuejs 만든 클라이언트 view 화면에서 front-end was 의 컨트롤러를 호출하고 그 컨트롤러에서 다시 back end was api 를 호출 하는 식으로 하는 구성하는게 옭은거죠? view에서 front-end was를 호출안하면 스크립트 조작이 가능한거 아닌가요? 검색해도 자료들도 잘 안나오고... vue 프로젝트에서 바로 api쪽을 호출하는 예제들만 많아서요 .. 조언 부탁드립니다. 감사합니다.
- 해결됨Vue.js 끝장내기 - 실무에 필요한 모든 것
PostAddForm.vue에서 API요청
수강 중 질문드립니다! 데이터를 생성하는 API요청을 actions에서 처리안하고 PostAddForm컴포넌트에서 요청되었는데요! 음.. Vuex state상태값을 따로 저장할게 아니면 보통 api요청을 굳이 actions에서 안하고 컴포넌트에서 하는걸까요??
- 해결됨Vue.js 끝장내기 - 실무에 필요한 모든 것
안녕하세요 수강평 이벤트 당참자인데 아직 이메일을 받지 못했습니다~ 확인부탁드립니다!
이메일 주소는 yunjam17@gmail.com 입니다.
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
토큰값 처리
토큰값을 처리하는 방법에 대해서 추가적인 질문드립니다. express 환경에서 cookie-parser를 활용해서 토큰값을 저장하고, 실제로 꺼내쓰는 부분의 소스는 vue-cookie 모듈을 활용하여 vue에서 사용하는데.. cookie-parser를 활용해서 노드서버쪽에 저장한 값이 vue클라이언트에서 활용될수가 있나요? 추가로, cookie-parser에 쿠키값을 저장하고 특정url 요청 시 토큰값이 undefined가 뜨는 경우는 왜그러는걸까요?
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
next()에서 라우트가 아닌 모달 띄우는 방법?
저는 로그인 방식을 모달로 구현해놔서요..! 우선은 잘못된 접근일 때 메인으로 가도록 설정 해 주었는데요, 혹시 모달을 따로 띄우는 방법도 있나요? ⭐️
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
prettier 설정 오류
소스 저장시 prettier에 설정한대로 자동변경이 되지않아 오류가나는데, 이전 비슷한 질문들에 대한 답변들 대로 모두 설정해보아도 여전히 동일하게 자동변경이 되지않고 오류가 나고있습니다 ㅠㅠ vue-til로 오픈 후 prettier 끄고 리로드하였고, 다른 포매터 설치된 것도 없습니다. 알려주신대로 설정도 완료하였는데도 안되네요, ,,, 문제 해결을 위해 조금더 확인 해 봐야할 부분이 없을까요?
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
안녕하세요!
cookies.js 에 있는 정규식은 어떤 의미인지 궁금해요~! 찾아보니 키 쌍으로 가져오는 그런 의미 인것 같은데, 정규식에 의해서 브라우저 쿠키에 보여지는 키(name)는 백틱안에 사용한 문자열 til_auth 와 til_user가 되는건가요? 아니면 정규식이랑 상관없이 세이브가 되고, getAuthFromCookie()는 저희가 값을 가져올 때에만 키 쌍으로 가저 오게 되는 것인가요?? <!-- 추가 질문 --> 설정을 하였는데, 새로고침시에 로그아웃이 되어요 ㅠㅠ 쿠키에도 잘 들어가있고, 현재 스테이트 에도 잘 들어가있는데 왜 새로고침하면 다시 로그아웃일때의 분기처리한 화면이 나오는걸까요 ㅜㅜ??? 키 이름을 조금 수정했고, 정규식에도 같은 이름으로 넣어 주었어요 . 로그인폼.vue 에도 아래 보시면 쿠키에 값을 담는 함수를 사용했어요. 쿠키에도 잘 담겨있는걸 확인했습니다! 아래는 스토어 index.js예요 저는 이메일, 닉네임, 패스워드 이렇게 세 값을 가저와서,, 그중 닉네임과, 패스워드에 쿠키값을 가저오도록 선언을 해주었어요. 뷰 데브툴에서도 스테이트에 올라온것도 확인했습니다! 하지만 무엇이 잘못 되있는 걸까요 ㅜㅜ??? 새로고침하면 여전히 로그인 전의 요 화면이네용 ㅜ
- 미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
env파일 관련 질문드립니다.
안녕하세요! 강의에서 본 내용처럼 env.development 파일에 url 을 정의해놓고 사용하려고 하는데 process.env.VUE_APP_API_URL 이 undefined로 떨어져서 제대로 동작하지 않네요..ㅠ 다른 설정이빠진게 있을까요?