66,000원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결Vue로 Nodebird SNS 만들기
질문 드립니다!
안녕하세요! 질문드립니다! 강의를 듣고있는데 actions에서 서버에 요청을 보내고 이미지를 업로드하면 다음과 같은 에러가 나옵니다. 구글링을 해보니, 이벤트는 발생시켰는데 받을 이벤트가 없을 때 저렇게 나온다고 하는데 아무리 봐도 어디가 문제인지 모르겠습니다 ㅠㅠ 의심되는 코드는 이 부분입니다. 그 전에 이미지 업로드 버튼을 만들어서 콘솔로그를 했을때는 폼데이터로 로그가 떴었는데, 저 부분을 작성한 이후부터 에러가 발생합니다. 도와주세요 ㅠㅠ
- 미해결Vue로 Nodebird SNS 만들기
안녕하세요
강의를 기반으로 카카오 strategy 를 사용해보고있는데요 궁금한점이있습니다. (저는 서버미들웨어를 사용해서 back front를 합쳤습니다) const router = require('express').Router(); const passport = require('passport'); router.get('/',passport.authenticate('kakao') , (req, res) => { // console.log(req.user); return res.redirect('/'); }); 1. 제로초님 블로그도보니까 동의화면 없이 바로 넘어가던데 원래 이런건가요? 2. passport.authenticate('kakao') 이것하고 passport.use(new KakaoStrategy({ kakao , new KakaoStrategy 부분을 꼭맞춰줘야하는거겠죠? 3. 위의 // console.log(req.user); 부분을 state로 넣어줘야하는데 어떻게 처리해야할까요 ..ㅠ
- 미해결Vue로 Nodebird SNS 만들기
궁금한점이있습니다
강사님 안녕하세요질문있습니다 ㅎㅎ보통 한화면에서 모든 crud를 처리하는 게시판에서는등록, 수정, 삭제 후리스트를 다시 뿌려줘야합니다. 강사님께서는 해당 강좌에서 등록/ 수정 / 삭제 같은 작업 후에 자바스크립트로 store에 있는 데이터 값을 조작했습니다근데 등록 / 수정 / 삭제 같은 작업 후 에 리스트를 호출하는 action을 다시 호출하는 방법을 쓰면 더 간단할 것 같은데왜 자바스크립트로 store에 있는 데이터 값을 조작하셧는지 궁금합니다.그리고 리스트를 호출하는 action을 등록/ 수정 /삭제 후 매번 호출해도 되는지 궁금합니다.
- 미해결Vue로 Nodebird SNS 만들기
새로고침시 오류
강사님 서버 구동후 새로고침을하면 백쪽에서는 데이터를 잘 로드되고있는데 프론트쪽에서 게시물 ,로그인이 됐다가 안됐다가 하는현상이 "scripts": { "dev": "nuxt", "build": "nuxt build", "_prestart" : "npm run build", "_start": "cross-env PORT=80 NODE_ENV=production pm2 start server.js", "start": "cross-env PORT=3080 nuxt start ", "lint": "eslint **/*" }, npm run dev 일떄는 저 오류가 발생하지않고 npm run start 으로서버를 키면 자꾸 저런 오류가 나오고있습니다. 혹시 어디쪽이 문제인지 알수있을까요? 백단에서 쿠키쪽은 우선 다확인해보았는데 오류는 아직 찾지 못했습니다
- 미해결Vue로 Nodebird SNS 만들기
aws 서버 새로고침시
안녕하세요 궁금한점이 있어서요 1. 새로고침시 게시글이 불러와졋다 안불러와지는현상 로그인 역시 마찬가지로 로그인한 유저가 불러와졋다가 안불러와지는현상이있습니다. url: younge.xyz 아이디 : abc@naver.com 비밀번호 : abc 이것은 nuxtServerInit 쪽문제일까요? 2 .cname 으로 www.을 붙여서 설정을 aws에서 해놓았는데요 www.younge.xyz (CNAME으로 추가한 url )에서는 cors 가 걸리는데요 또다른 aws 설정이 필요한가요? 3. 로컬에서 1번 문제를 해결하려 돌려보았는데 뜬금없는 cors 가 또 걸려서요 Request Status Preflight Request (if problematic) Initiator Context Allowed Origin (from header) login blocked login http://localhost:3080/ http://younge.xyz 요렇게나와서 back app.js 에 app.use(morgan('dev')); app.use(cors({origin:'http://localhost:3080', credentials:true} )); 로 수정을해주었는데도 몇번이나 서버를 껐다켰는데도 먹히지가않네요 이게 aws에서도 똑같은 문제로 애먹어서 몇십번 서버 껐다가 키니까 또 먹더라구요 이거 빌드된 파일들을 삭제후 다시 해야할까요? 빌드된 폴더가 있는건가요? 프론트에서는 .nuxt 폴더에 빌드된파일을 서버가 읽고 화면을 보여주는거같은데 백단은 찾기가 힘들어서요
- 미해결Vue로 Nodebird SNS 만들기
배포모드 build 시?
배포모드 build 시 생기는 파일들은 서버어디에 저장해놓는건가요? run 할시 그 빌드된 파일을 was가 읽어주는것인가요?
- 미해결Vue로 Nodebird SNS 만들기
aws 세팅시 @nuxtjs/moment 가 설치가 안되는 분들
npm install --save-dev @nuxtjs/moment 한번씩 해주시면 build 시 오류 없이 잘됩니다
- 미해결Vue로 Nodebird SNS 만들기
aws 배포중 오류가 생겨질문드립니다.
안녕하세요 aws 배포중 오류가 생겨서질문드립니다. Cannot find module 'webpack' 03:39:03 Require stack: - /home/ubuntu/node_vue/node_modules/moment-locales-webpack-plugin/index.js - /home/ubuntu/node_vue/node_modules/@nuxtjs/moment/lib/module.js - /home/ubuntu/node_vue/front/node_modules/@nuxt/core/dist/core.js Require stack: - /home/ubuntu/node_vue/node_modules/moment-locales-webpack-plugin/index.js - /home/ubuntu/node_vue/node_modules/@nuxtjs/moment/lib/module.js - node_modules/@nuxt/core/dist/core.js at Function.Module._resolveFilename (internal/modules/cjs/loader.js:902:15) at Function.Module._load (internal/modules/cjs/loader.js:746:27) at Module.require (internal/modules/cjs/loader.js:974:19) at require (internal/modules/cjs/helpers.js:93:18) at Object.<anonymous> (/home/ubuntu/node_vue/node_modules/moment-locales-webpack-plugin/index.js:3:32) at Module._compile (internal/modules/cjs/loader.js:1085:14) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10) at Module.load (internal/modules/cjs/loader.js:950:32) at Function.Module._load (internal/modules/cjs/loader.js:790:12) at Module.require (internal/modules/cjs/loader.js:974:19) at require (internal/modules/cjs/helpers.js:93:18) at WebpackBundler.<anonymous> (/home/ubuntu/node_vue/node_modules/@nuxtjs/moment/lib/module.js:28:33) at next (node_modules/@nuxt/utils/dist/utils.js:659:27) at WebpackBundler.<anonymous> (node_modules/@nuxt/utils/dist/utils.js:674:12) at WebpackClientConfig.extendConfig (node_modules/@nuxt/webpack/dist/webpack.js:1509:37) at WebpackClientConfig.config (node_modules/@nuxt/webpack/dist/webpack.js:1544:50) require stack 파일들도 물론 ubuntu 환경에서 확인해봣는데 있더라구요 ,그전에는 @moment 가 없다고 하고 다시 npm install 했는데 webpack 오류가 발생하네요 검색해도 잘나오지않는 사유라서요 이거 싹다지우고 다시해봐야할까요?
- 미해결Vue로 Nodebird SNS 만들기
회원가입시 로그인
안녕하세요 회원가입시 로그인이 바로구현이 되게 하고싶은데 //회원가입 router.post('/',isNotLoggedIn ,async (req,res,next)=> { try{ const hash = await bcrypt.hash(req.body.password, 12); //////이메일로 중복가입 체크// const exUser = await db.User.findOne({ where:{ email : req.body.email, }, }); if(exUser) { return res.status(403).json({ errorCode : 1, message : "이미 회원가입되어있습니다." }) } ///이메일 중복가입체크 끝 //// const newUser = await db.User.create({ email : req.body.email, nickName : req.body.nickName, password : hash, });//HTTP STATUS CODE await passport.authenticate('local',(err,user,info)=>{ //에러시나 info 에 정보 (실패사유) if(err){ console.error(err); return next(err); } if(info){ return res.status(401).send(info.reason); } return req.login(user,async(err)=> { if(err){ console.error(err); return next(err); } return res.json(user); }); })(req,res,next); // return res.status(201).json(newUser); }catch(err) { console.log(err); next(err); } }); 이렇게하면 프론트 store쪽에 user가 전달이되는데 백쪽에서는 로그인이 제대로 되지가않는데 더 확인해봐야할부분이 있을까요?
- 미해결Vue로 Nodebird SNS 만들기
시퀄라이즈 as 역할
안녕하세요 시퀄라이즈 모델부분을 보다 궁금한점이생겼습니다. db.Post.belongsTo(db.Post ,{as : 'Retweet'}); 여기서는 Post 테이블에 RetweetId 가 생기는데 db.Post.belongsToMany(db.User,{through: 'Like', as: 'Likers'}); 다대다 관계에서는 또 as 명으로 id 가 생기지않고 db.User.belongsToMany(db.User , {through :'Follow', as: 'Followers' , foreignKey : 'followingId' }); 이부분은 foreignkey로 컬럼이 생기는데 as는 어떨때 +id로 컬럼이 생기는 기준이 있는건가요?
- 미해결Vue로 Nodebird SNS 만들기
로컬에서 작업시
로컬에서 작업시에 새탭을 켜놓고 localhost:3000/post/12345 를 접속한상태에서 새탭을 켜서 똑같은 경로(localhost:3000/post/12345)를 접속하려고하면 탭에 loading 이 걸리는데 원래 이런건가요? 이렇게 된상태에서 한탭을 더켜서 localhost:3000 을 접속을하려고 하면 그 탭역시도 로딩이 계속되구요 이게 싱글 스레드 라서 그런건가요?? 그리고 원래 저런거라면 사용자가 사용할때에는 분명 한페이지에 여러 탭을 켜서 사용하는 경우가 있을텐데 어떻게 해결해야하는지도 궁금해요 .
- 해결됨Vue로 Nodebird SNS 만들기
배포후 start시 baseURL에 있는 주소로 접속하지 못하는 오류
안녕하세요! 학교 프로젝트를 하는 데에 강사님의 강의가 도움이 정말 많이 되었습니다. 마지막에 배포를 할 때에 학교 프로젝트이니만큼 aws로 하지는 않고 학교 아이피+포트로 서버에 접속해서 git clone해서 배포를 해야 하는데요, 빌드 후 npm run start를 하면 baseURL에 있는 주소들 말고 코드에 없는 localhost3000으로 실행됩니다. 마지막 줄에 주석처리된 코드가 학교에서 제시한 코드인데 저렇게 하니 window가 없다는 오류가 나서 강사님의 코드를 참고해서 가운데처럼 바꾸었는데요, 혹시 해결법에 대한 힌트를 주시면 감사하겠습니다! 아이피와 포트는 학교거라 가려야 할 것 같아서 가렸는데, 'https://아이피:포트'이렇게 되어있습니다!
- 미해결Vue로 Nodebird SNS 만들기
withCredentials 옵션 추가 후 CORS 에러
** 답글에 해당 현상에 대한 해결법 남겨두었습니다.** 안녕하세요, 제로초님. 강의를 들으며 따라 하고있는데 같은 부분에서 1시간째 막혀 있어서 질문 남겨봅니다. 프론트 코드에 withCredentials 옵션을 추가한 후부터 하단의 그림과 같이 CORS 에러가 나기 시작했습니다. 강의와 똑같이 백엔드에 cors 옵션을 추가했습니다. 하다하다 안되어 제로초님 깃헙의 코드를 그대로 복붙했는데도 똑같이 cors에러는 계속 나는데 왜이럴까요..? [backend > app.js 파일] 프론트에서 옵션을 withCredentials 추가한 후로 계속 나네요. 저 옵션을 빼면 로그인이 잘 됩니다. 프론트에 쿠키를 전달하려면 이 옵션을 사용해야 한다고 하여서 해보는 중입니다만 막막하네요.. 혹시 왜이런지 아실까요? [frontend > store > users.js 파일] withCredentials: true, 위 옵션을 로그인에서 제거를 한다고해도, 로그아웃 할 때도 추가하면 똑같이 cors에러떠서 로그아웃이 pending이 걸려버리더라구요..
- 미해결Vue로 Nodebird SNS 만들기
props로 내려받은 function을 그대로 사용해도 되나요?
안녕하세요 제로초님 강의를 듣다가 의문점이 들었는데요. props는 상위 컴포넌트에서 하위 컴포넌트로 속성을 내려줄때 사용하는 단방향 데이터 흐름을 위해 있는 속성으로 알고있었는데요. 1. 상위 컴포넌트에서 function을 props로 내려준다음 하위 컴포넌트에서 전달받은 function을 바로 인자를 싣어서 상위 컴포넌트로 올려줘도 괜찮은건가요? 2. 별도로 remove함수를 하위 컴포넌트에서 따로 methods 함수 추가해서 처리해주지 않고 바로 사용해도 되는건가요?? 신기하게도 하위컴포넌트에서 props로 내려받은 remove 함수가 id를 넘겨주었더니 바로 상위 컴포넌트에 연결된 함수로 이벤트가 위임해서 작동하더라구요.. (별도의 emit과정을 거치지 않더라구요) 이런 방식으로 함수를 props로 사용하는걸 처음봐서 너무 신기하네요..!
- 미해결Vue로 Nodebird SNS 만들기
팔로우/팔로잉 삭제 추가 에러
안녕하세요 제가 이틀동안 에러를 찾는데 못찾아서 질문을 남깁니다. git 에서 비교를 해봐도 잘모르겠습니다. ( 캡쳐를 너무 많이 해서 올려서 먼저 죄송하다는 말씀을 드리겠습니다. 소스를 어디부터 설명을 해야할지 몰라서 캡쳐해서 올렸습니다. ) 프론트엔드 기술들 3-1. 팔로우/팔로잉 더미 데이터를 따라하는중인데요. 저는 /profile 페이지를 호출하면 아래 캡쳐 화면처럼 팔로잉 팔로워 2개씩 떴다가 약 1초정도 1초후 이렇게 두번째 데이터들이 삭제가 됩니다. 그리고 콘솔에는 아래 처럼 에러가 찍힙니다 아래는 소스입니다. FollowList.vue users.js profile.vue
- 미해결Vue로 Nodebird SNS 만들기
nuext.config.js 파일에 달라진 부분 질문드립니다.
@nuxtjs/axios 같은 경우엔 nuxt.config.js 파일에 moudles에 작성하고, @nuxtjs/vuetify 같은 경우엔 buildModules에 작성을하는데 각각 다른 부분에서 참조를 걸어주는 이유는 무엇인가요? (설치하는 부분에서 막혀서 한참을 찾아보다가 기존의 강의와 제로초님 깃헙의 소스와 다르다는 사실을 알고 고쳤네요.. 이부분은 따로 고지가 필요할 것 같습니다.)
- 미해결Vue로 Nodebird SNS 만들기
강사님 질문있습니다
header에 Authorization 값을 심어주고 싶은데 this.$axios.setHeader('Authorization', 'Bearer');위방식으로는 네트워크탭에서 Authorization이 확인이 안됩니다 ㅠㅠ응답데이터도 안오구요.그런데 console로는 해당 값이 찍히는데 원인을 알 수 있을까요?? ㅠㅠ
- 미해결Vue로 Nodebird SNS 만들기
폴더를 기준으로 layout 지정
안녕하세요. 프론트에서 폴더를 기준으로 레이아웃을 적용하고 싶습니다. layout: 'admin' 이렇게 적용중에 있는데요, pages에서 admin폴더 안에 들어가는 모든 레이아웃은 디폴트가 아닌 admin으로 적용하고 싶습니다. pages에서 admin폴더에 있는 vue파일에 모두 layout:'admin'을 작성하는게 비효율적으로 느껴져 질문하게 되었습니다. 혹시 방법이 있을까요? 감사합니다!
- 미해결Vue로 Nodebird SNS 만들기
머테리얼 트위터의 리트윗 아이콘이 안나오는 분들께
강의에서는 아래 처럼 twitter-retweer이라고 나와있지만 그 후에 사양이 조금 변경된 것 같습니다 <v-icon>mdi-twitter-retweet</v-icon> 뷰티파이 아이콘 설명에 보시면 리트윗 아이콘 이름이 아래와 같이 변경되었습니다. 혹시 안나오는 분들은 아래를 참조해주세요. <v-icon>mdi-repeat-variant</v-icon> [제로초 강좌 질문 필독 사항입니다]질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.도움이 되는 질문을 하는 방법을 알려드립니다.https://www.youtube.com/watch?v=PUKOWrOuC0c0. 숫자 0부터 시작한 이유는 1보다 더 중요한 것이기 때문입니다. 에러가 났을 때 해결을 하는 게 중요한 게 아닙니다. 왜 여러분은 해결을 못 하고 저는 해결을 하는지, 어디서 힌트를 얻은 것이고 어떻게 해결한 건지 그걸 알아가셔야 합니다. 그렇지 못한 질문은 무의미한 질문입니다.1. 에러 메시지를 올리기 전에 반드시 스스로 번역을 해야 합니다. 번역기 요즘 잘 되어 있습니다. 에러 메시지가 에러 해결 단서의 90%를 차지합니다. 한글로 번역만 해도 대부분 풀립니다. 그냥 에러메시지를 올리고(심지어 안 올리는 분도 있습니다. 저는 독심술사가 아닙니다) 해결해달라고 하시면 아무런 도움이 안 됩니다.2. 에러 메시지를 잘라서 올리지 않아야 합니다. 입문자일수록 에러메시지에서 어떤 부분이 가장 중요한 부분인지 모르실 겁니다. 그러니 통째로 올리셔야 합니다.3. 코드도 같이 올려주세요. 다만 코드 전체를 다 올리거나, 깃헙 주소만 띡 던지지는 마세요. 여러분이 "가장" 의심스럽다고 생각하는 코드를 올려주세요.4. 이 강좌를 바탕으로 여러분이 응용을 해보다가 막히는 부분, 여러 개의 선택지 중에서 조언이 필요한 부분, 제 경험이 궁금한 부분에 대한 질문은 대환영입니다. 다만 여러분의 회사 일은 질문하지 마세요.5. 강좌 하나 끝날 때마다 남의 질문들을 읽어보세요. 여러분이 곧 만나게 될 에러들입니다.6. 위에 적은 내용을 명심하지 않으시면 백날 강좌를 봐도(제 강좌가 아니더라도) 실력이 늘지 않고 그냥 코딩쇼 관람 및 한컴타자연습을 한 셈이 될 겁니다.
- 미해결Vue로 Nodebird SNS 만들기
질문드립니다
store action에서 다른 action들은 return 처리를 안해주시고loadFollowers, loadFollowings는 return 처리를 해주셨는데 이유가 궁금합니다. loadFollowers({ commit, state }, payload) { if (!(payload && payload.offset === 0) && !state.hasMoreFollower) { return; } let offset = state.followerList.length; if (payload && payload.offset === 0) { offset = 0; } return this.$axios.get(`/user/${state.me.id}/followers?limit=3&offset=${offset}`, { withCredentials: true, }) .then((res) => { commit('loadFollowers', { data: res.data, offset, }); }) .catch((err) => { console.error(err); }); }, loadFollowings({ commit, state }, payload) { if (!(payload && payload.offset === 0) && !state.hasMoreFollowing) { return; } let offset = state.followingList.length; if (payload && payload.offset === 0) { offset = 0; } return this.$axios.get(`/user/${state.me.id}/followings?limit=3&offset=${offset}`, { withCredentials: true, }) .then((res) => { commit('loadFollowings', { data: res.data, offset, }); }) .catch((err) => { console.error(err); }); }, 그리고 this.$axios 호출을 통해 응답받은 데이터를 vue component 단에 넘겨주고 싶을 때 vuex 에 저장해서vue component 단에서 store값을 가져와서 쓰는게 좋은 방법인가요??아님 그냥 응답 데이터를 return 해서 vue component 단에서 받아서 써도 상관없는건가요??답변기다리겠습니다! ㅠㅠ