묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청 드립니다!
인프런 아이디 : skyee23@gmail.com인프런 이메일 : skyee23@gmail.com깃헙 아이디 : skyee23@gmail.com깃헙 Username : xxsank
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
권한요청 드립니다
안녕하세요, 권한 요청드립니다.- 인프런 아이디: tpdud406@gmail.com- 인프런 이메일: tpdud406@gmail.com- 깃허브 아이디: tpdud406@gmail.com- 깃허브 username: tpdud406
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
속성명의 축약 특징 리팩토링에 관한 질문
객체의 속성명과 값이 같으면하나만 쓰면 된다고 하셨는데실무에서 작업하실때 이러한 편리함때문에 변수선언의 설계를일부러 같이 객체의 속성명이랑 값이랑 같이 하는 편인가요?
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한요청 부탁드립니다.
인프런 아이디 : jongseungim5348@gmail.com인프런 이메일 : jongseungim5348@gmail.com깃헙 아이디 : jongseungim5348@gmail.com깃헙 Username : limjongseung
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청 드립니다.
권한 요청 드립니다.인프런 아이디 : choigy0331@naver.com인프런 이메일 : choigy0331@naver.com깃헙 아이디 : choigy1001깃헙 Username : Keun young
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
권한요청부탁드립니다.
인프런 아이디 : hskim1559인프런 이메일 : hskim1559@gmail.com깃헙 아이디 : hskim1559@gmail.com깃헙 Username : dalcomz
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
권한요청드립니다!
인프런 아이디 : seajin97@g.shingu.ac.kr인프런 이메일 : seajin97@g.shingu.ac.kr깃헙 아이디 : seajin97@g.shingu.ac.kr깃헙 Username : simsimhang 한번 권한 받았었는데 시간이 지나니까 권한이 사라져있습니다
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
권한요청드립니다!
권한 요청 드립니다.인프런 아이디 : koorihime@naver.com인프런 이메일 : koorihime@naver.com깃헙 아이디 : koorihime@naver.com깃헙 Username : minhyuck woo
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃허브 권한 부탁드립니다.
인프런 아이디: jhpark@nicednr.co.kr인프런 이메일: jhpark@nicednr.co.kr깃헙 아이디: leehot2665@naver.com깃헙 Username: Zero-Human
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청드립니다
인프런 아이디: gil인프런 이메일: gil@projectlien.co.kr깃헙 아이디: gilha.leee@gmail.com깃헙 Username: gilhalee깃헙 권한 요청 부탁드립니다
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 재요청 드립니다.!!
깃헙 권한 재요청 드립니다! 인프런 아이디 : jungsr417@hanwha.com인프런 이메일 : jungsr417@hanwha.com깃헙 아이디 : jungsr417깃헙 Username : jsr 감사합니다.
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
토글 부분에서 리팩토링이 되지 않아 질문드립니다.
저는 getTime() 으로 타임을 받아서 value 부분을 객체로 만들어서 넘기고 있었습니다.store에서 sort 기능을 추가하였고완료된건을 아래로 넘기는 작업을하고 완료되지않은 건은 위로 올려서 나뉘게 작업하였습니다.그런대 이전에 store을 쓰지않을때는 단순하게 토글할때 sort를 함수로 만들어서 호출하였더니 잘되었습니다.store에 함수로 만들고 호출하고 나서는 리팩토링이 되지 않습니다 ㅠㅠ새로고침했을때는 잘 작동합니다. 또한 console창에도 바뀐 로직으로 잘 뜹니다.toggleOneItem 부분 봐주시면 감사합니다fetch부분에서는 잘되어서 리스트 가져올땐 잘되었는대 ㅠㅠ 토글하면서 잘 안돼더라구요!제가 어떤것을 실수 했을까요..? import Vue from "vue"; import Vuex from "vuex"; Vue.use(Vuex); //글로벌하게 Vuex를 쓰겠다는 의미 //해당 라이브러리를 사용하기 위한 초기화 코드를 실행하는 구문 //뷰에 연결해야 vuex를 사용할 수 있다 let sortItem = []; function sortlist(state) { const trueItem = state.filter( (item) => item.completed === true ); const falseItem = state.filter( (item) => item.completed === false ); trueItem.sort(function (a, b) { return b.value.time - a.value.time; //내림차순 }); falseItem.sort(function (a, b) { return b.value.time - a.value.time; //내림차순 }); sortItem = [...falseItem, ...trueItem]; return sortItem; } const storage = { fetch() { //네트워크의 리소스를 쉽게 비동기적으로 가져오기 //app에 있는 created를 store에 붙이기 let arr = []; if (localStorage.length > 0) { for (let i = 0; i < localStorage.length; i++) { if (localStorage.key(i) !== "loglevel:webpack-dev-server") { const item = localStorage.getItem(localStorage.key(i)); arr.push(JSON.parse(item)); //arr배열을 만들어서 푸시해주기 sortlist(arr); } } } return sortItem; // {} 단위밖에서는 arr을 호출할 수 없으므로 return 반환 }, }; // //다른 컴포넌트에서 this.$store 로 사용할 수 있음 export const store = new Vuex.Store({ state: { headText: "TODO it!", //헤더에 들어갈 값 등록하기 //todoItems: [], todoItems: storage.fetch(), //위에 만들어준 값을 넣어준다 }, getters: { getTotalNum(state) { //인자는 state return state.todoItems.length; }, getTrueNum(state) { //인자는 state const trueItem = state.todoItems.filter( (item) => item.completed === true ); return trueItem.length; }, }, mutations:{ addOneItem(state, value) { //console.log(value) const obj = { completed: false, value: value }; //const를 쓰면 재선언할 수 없어 디버깅할 때 충돌을 줄일 수 있음 //오브젝트로 만들어줬기 때문에 obj를 찍게 되면 object object가 찍힘, 따라서 문자열로 변환해 주는것 localStorage.setItem(value.item, JSON.stringify(obj)); //JavaScript 값이나 객체를 JSON 문자열로 변환 if(!state.todoItems.some(element => element.value.item == value.item)){ state.todoItems.unshift(obj); }else{ alert('이미 작성된 내용입니다.'); } }, removeOneItem(state, payload) { //console.log(payload); localStorage.removeItem(payload.todoItem.value.item); //객체일때 로컬스트리지에서 삭제하기 state.todoItems.splice(payload.index, 1); //현재 리스트에서 삭제하기 }, toggleOneItem(state, payload) { //todoItem.completed = !todoItem.completed; //이벤트로 넘어온값을 바꾸는 것을 안티패턴이라고 하며 어짜피 props로 내려준 값이 변경되므로 아래와같이 변경한것 state.todoItems[payload.index].completed = !state.todoItems[payload.index].completed; //localStorage 갱신하기 localStorage.removeItem(payload.todoItem.value.item); //localStorage는 업데이트 기능이 없으므로 삭제 후 localStorage.setItem(payload.todoItem.value.item, JSON.stringify(payload.todoItem)); //새로 추가해준다, 이때 completed 값이 바꼈으므로 바뀐값이 들어오게 된다. sortlist(state.todoItems); //리팩토링이안돼네...추후에 해결할것 ㅠㅠ }, clearAllItems(state) { localStorage.clear(); state.todoItems = []; }, }, });
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청드립니다!!
인프런 아이디 : seajin97@g.shingu.ac.kr인프런 이메일 : seajin97@g.shingu.ac.kr깃헙 아이디 : seajin97@g.shingu.ac.kr깃헙 Username : simsimhang
-
미해결프로젝트로 배우는 Vue.js 3
로그인과 같이 레이아웃이 완전 다른 페이지를 만들때는 router 를 어떻게 할까요?
안녕하세요 선생님!덕분에 정말 뷰 재미있게 배우고 있습니다. 한가지 궁금한점은모든 페이지에는 헤더가 동일하다가로그인/회원가입에서만 헤더가 다르거나 완전 다른 레이아웃일 경우에는 아래 중 어떤 것이 가장 적합한지 궁금합니다. router 를 사용한 후 v-if 등을 활용해서 header를 숨김처리router 사용 / header 컴포넌트에 slot 등을 활용해서 숨김처리로그인/회원가입과 같은 특수한 페이지만 router 사용하지 않고 a링크로 url 이동어떤것이 가장 적합할까요?또한, 30페이지 정도는 a헤더를 사용하고 40페이지 정도는 b헤더를 사용해야하는 경우에는 어떤것이 적합한지 궁금합니다!
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
nom update check failed는 어떠한 이유로 뜨는 것인 지 궁금합니다.
안녕하세요 선생님 덕분에 강의 잘 수강하고 있습니다.다름이 아니라 back-end project를 실행하는데npm run dev 를 실행하면 정상적으로 서버도 돌아가고 /api/docs 경로도 잘 조회가 됩니다. 다만 저 경고문구는 왜 뜨는지 궁금합니다..!
-
미해결Vue로 Nodebird SNS 만들기
안녕하세요! 로그인 유지 질문 드립니다!
이것저것 만들어보다가 로그인 유지에 대한 필요성을 느꼈고https://www.zerocho.com/category/HTML&DOM/post/5918515b1ed39f00182d3048제로초님의 이 글을 보게 되었습니다!그런데 만약 로컬스토리지에서는 유저 정보가 있는데 백엔드에서는 유저 정보가 없는경우 (express-session 만료 등의 이유)가 있을수 있을것 같은데 이런 경우에는 실무에서 어떻게 처리가 될까요??단적인 생각으로는 백엔드의 세션 만료시 로컬스토리지의 정보(아이디 / 비번)로 세션을 재활성 시킨다거나 할수 있을것 같은데 혹시 이런 경우에는 어떻게 처리가 될까요??
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
개발을 할 때 vue-til-server 에 있는 api 코드들은 백엔드 개발자가 프론트 개발자에게 작업해서 주게되나요?
개발을 할 때 vue-til-server 에 있는 api 코드들은 백엔드 개발자가 프론트 개발자에게 작업해서 주게되나요?만약 프론트개발자가 작업해야한다면 이부분은 어떤강의로 공부하면 될까요?
-
미해결프로젝트로 배우는 Vue.js 3
vue CLI 설치 관련 문의드립니다.
현재 vue installation 페이지가 없어서 아래 페이지를 참고 하고 있습니다.https://vuejs.org/guide/quick-start.html#creating-a-vue-application 하여 node.js 설치 후 강의에 가이드해주신대로 설치하니,아래와 같은 에러가 발생합니다.어떻게 진행해야되는지 답변 부탁드립니다.
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
뒤죽박죽 올라가는 리스트 순서를 대비해 sort() API를 사용하라고 적어주셨는데 도저히 모르겠습니다..!
const storage = { fetch() { const arr = []; if(localStorage.length > 0){ for(let i = 0; i < localStorage.length; i++){ if(localStorage.key(i) !== 'loglevel:webpack-dev-server'){ arr.push(JSON.parse(localStorage.getItem(localStorage.key(i)))); } } } return arr; }, }; 답변 중 불러올 때 for 문을 돌리는데 순서 보장이 안된다고 하신 부분을 보고 위 쪽에 있는 for문을 말씀하신 건가 싶었고 그럼 이 부분에 있는 배열 arr에 sort()를 추가하는 건가? 싶었는데 제가 맞게 이해한 걸까요?sort라는 변수를 하나 추가한 뒤 arr.sort()를 넣은 후 return값에 arr대신 sort를 넣어보기도 했는데 잘못된 방 법인지 딱히 바뀌지 않더라구요.. 구글을 뒤져봐도 아직 못 찾아 좀 더 찾아보면서 질문도 함께 올려봅니다..
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
권한 재요청ㅡㅜ
초대장을 확인을 못해서 초대장이 소멸되었네요.ㅠㅠ 다시 부탁드립니다.인프런 아이디 : kik1611인프런 이메일 : kik1611@nate.com깃헙 아이디 : kik87827@gmail.com깃헙 Username : kik87827