묻고 답해요
131만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결vue.js 실전 프로젝트(트위터 클론)
배포 후 로그인 불가 현상
6월에 완성하고 파이어베이스 배포했을때는 정상적으로 작동을 했었는데 오늘 확인차 로그인을 해보려고 하니 이런 에러 메세지가 뜨면서 로그인 자체가 되질 않네요. 이전에 저장됐던 로그인 정보 파이어베이스 db에서 모두 삭제하고 새로 회원가입 후 로그인 했을때 현상입니다,.. 다른 아이디로 회원가입하고 로그인해도 똑같은 현상이 발생하네요.
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃허브에서 강사님의 소스가 보이지 않습니다.
아래 화면캡처와 같이 깃허브에 강사님이 작성하신 스크립트가 보이지 않습니다. 실습 시 참조하기 위해 반드시 필요합니다. 기초강의때처럼 소스를 다운받을 수 있을까요?
-
미해결Vue3 완벽 마스터: 기초부터 실전까지 - "실전편"
목록에서 상세페이지로 넘어갈때 데이터가 안넘어가요
json-server &axios편에서 목록페이지에서 상세페이지로 갈때 데이터가 안따라와요 ㅜㅜ 로그 기록보면 아래와 같은 에러가 나오는데요 props를 인자로 못받고있는것 같은데요 해결책좀 알려주세요 GET http://localhost:5000/posts/undefined 404 (Not Found)
-
미해결웹 게임을 만들며 배우는 Vue
webpack-dev-server 설정 후 에러 발생 처리 도와주세요.
강의자님이 세팅하신 대로 webpack-dev-server 관련 세팅을 한 뒤 npm run dev를 하니 아래와 같이 생성자를 생성할 수 없다는 에러가 뜨고 있습니다.이런 경우 어떻게 해야 할까요?세팅 상태에러 내용
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃허브 권한 요청 드립니다.
- 인프런 아이디: renoyar@naver.com- 인프런 이메일: renoyar@naver.com- 깃허브 아이디: skshhj@gmail.com- 깃허브 username: RENOYAR
-
해결됨Vue.js 시작하기 - Age of Vue.js
App.vue 파일 내용 변경 에러
강의를 따라서 helloworld.vue 도 지우고,App.vue 내용도 지우고 진행했습니다.그런데, 계속 오류가 뜨길래 확인해보니 변경사항 경고창이었습니다.VsCode를 껐다가 다시 켜봐도 여전히 저 알림들이 뜹니다.<template>, <script>, <style> 모두요.뭐 때문인지 알수있을까요?
-
해결됨Vue.js 시작하기 - Age of Vue.js
package.json 파일을 찾을수 없는 오류메세지
vs code 알림팝업으로,[ Vetur can't find 'package.json' in 파일경로 ][ Vetur can't find 'tsconfig.json' or 'jsconfig.json' in 파일 경로 ]가 나옵니다.하지만, package.json 파일과 jsconfig.json 파일을 갖고 있습니다.그리고 해당 파일경로는 vue-cli 폴더를 갖고 있는폴더이며, 해당 경로에는 없지만 그 안에 있는 vue-cli 폴더에는 있는데, 왜 인식이 안되는지 모르겠어요.
-
미해결호돌맨의 요절복통 개발쇼 (SpringBoot, Vue.JS, AWS)
Validation Map -> 어떻게 변경하는게 좋은지 궁금합니다.
안녕하십니까. 데이터 검증2 를 듣다가 궁금한점이 생겨서 질문을 남기게 되었습니다. @Getter @RequiredArgsConstructor public class ErrorResponse { private final String code; private final String message; private final List<Validation> validations = new ArrayList<>(); public void addValidation(String fieldName, String errorMessage) { this.validations.add(new Validation(fieldName, errorMessage)); } private record Validation(String fieldName, String errorMessage) { } } @Test @DisplayName("/posts 요청시 title 값 필수.") void test2() throws Exception { mockMvc.perform(post("/posts") .contentType(MediaType.APPLICATION_JSON) .content("{}") ) .andExpect(status().isBadRequest()) .andExpect(jsonPath("$.code").value("400")) .andExpect(jsonPath("$.message").value("잘못된 요청입니다.")) .andExpect(jsonPath("$.validations[0].errorMessage").value("title을 입력해주세요.")) .andExpect(jsonPath("$.validations[1].errorMessage").value("content를 입력해주세요.")) .andDo(print()); } 일단 Map -> List<Validation> 방식으로 수정해보았는데요@Setter @Getter @ToString public class PostCreate { @NotBlank(message = "title을 입력해주세요.") private String title; @NotBlank(message = "content를 입력해주세요.") private String content; }테스트 코드에서 0번째 에러메시지가 title을 입력해주세요 가 될 줄 알았는데 content를 입력해주세요 가 나와서 실패했습니다. (PostCreate 필드 순서대로 validations에 담길 줄 알았는데 예상되로 나오지 않았습니다.) -> 테스트 할 때마다 결과가 뒤죽박죽 이네요. 이러한 경우 어떻게 테스트 하는지 궁금합니다.또한 이렇게 만약 여러 error field가 잡히거나, 에러 메시지가 바뀌는 경우가 생기면 테스트 코드 수정이 빈번해 질 것 같은데 어떻게 해결할 수 있을지 궁금합니다.마지막으로 List<Validation> 방법 말고 조금 더 많이 쓰이는 ? 혹은 괜찮은 방법 있으면 추천해주시면 감사하겠습니다.
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
safari 개발자 도구에 대한 질문입니다
safari 개발자 도구를 이용해서 디버깅하던 중에 vuex를 확인할 일이 있어서 찾아보는데 아무리 봐도 보이지가 않습니다chrome 개발자 도구에서는 vuex를 시각적으로 볼 수 있게 지원하는것 같은데 혹시 safari는 지원하지 않는건가요?
-
미해결Vue3 완벽 마스터: 기초부터 실전까지 - "기본편"
객체안에 배열있을때
객체안에 배열 안에 있는 값들을 나열하고싶을때는 어떻게 하나요?
-
미해결Vue 3 & Firebase 10 커뮤니티 만들기 풀스택 - "활용편" (with Pinia, Quasar, Tiptap, VueUse)
vite로 프로젝트를 만들어서 진행해도 문제 없을까요?
안녕하세요~당연히 강의 내용을 따라가는게 맞긴 합니다만, 제가 백엔드 개발자라 인텔리제이 IDE를 쓰는게 편해서 강의를 인텔리제이로 진행중입니다vite로 프로젝트를 만들면 인텔리제이에서 뷰로 인식해서 여러 vscode에서 따로 설치해야하는 플러그인 기능을 기본으로 제공해주더군요근데 퀘이사로 프로젝트를 생성하면 이같은 기능이 동작하지 않네요 정리하자면 vite로 프로젝트를 만들어서 퀘이사를 설치해도 후반부 강의에 문제 없을까요?
-
미해결Vue.js 시작하기 - Age of Vue.js
.vue파일 열기
localhost:8080으로 들어갔는데 이런 페이지 밖에 안 뜨네요.. 제가 .vue파일에 만든것은 안뜨고 어떻게 해야 할까요?ㅠㅠ
-
해결됨Vue.js 시작하기 - Age of Vue.js
vue event 탭이 보이지 않습니다.
크롬브라우저에서 vue event 탭이 보이지 않습니다.
-
해결됨Vue.js 시작하기 - Age of Vue.js
학생할인
학생할인에서 이미지 파일올리는 부분이 문제가 있어서 안 올려지네요.. 할인이 끝난 건가요?
-
미해결Vue3 완벽 마스터: 기초부터 실전까지 - "실전편"
PINIA 로드 시점 관련 문의 드려요
pinia로 구성하여 axios통하여 데이터를 가져오는 간단한 게시판을 구성을 한상태인데요.상단 검색 영역과 하단 게시판 리스트 영역을 분리하여 부모 컴포넌트에서 두가지 컴포넌트를 불러오고 상단의 검색한 검색 조건을 로컬 스토리지에 넣어두었다. 게시판에 진입시에 로컬스토리지에 검색조건이 남아있으면 자동으로 검색 조건 통하여 axios로 데이터를 호출하여 뿌려주고 있는데요 여기서 콘솔에 보면 pinia 관련 store installed 되기 전 보다 먼저 로컬스토리지 검색조건을 가져와 axios를 호출 하려 하다 보니 실제 axios 호출관련 부분은 store에 구성되어있어서 게시판 데이터를 가져오지를 못하네요. settimeout으로 약간 시간차를 두어 store installed 이러우진 후에는 정상적으로 검색을 해서 데이터를 가져오는데요 settimeout을 사용하지 않고 처리를 할 수 있는 방법이 있을끼요?
-
해결됨Vue.js 시작하기 - Age of Vue.js
vue cli 설치 오류
vue cli 설치 오류가 뜹니다.노드는 v20.10.0, npm은 10.2.3 버전으로 다운 받았습니다.vue cli 설치를 진행하면 처음에,[..................] | idealTree:npm: sill idealTree buildDeps메세지가 나오다가, 에러메세지가 뜹니다.현재 에러 메시지는,npm ERR! code EPROTOnpm ERR! syscall writenpm ERR! errno EPROTOnpm ERR! request to https://registry.npmjs.org/@vue%2fcli failed, reason: write EPROTO C8230000:error:0A00010B:SSL routines:ssl3_get_record:wrong version number:c:\ws\deps\openssl\openssl\ssl\record\ssl3_record.c:355:npm ERR!npm ERR! A complete log of this run can be found in:~~~(로그파일 확인 경로)이런 오류메세지가 계속 나옵니다.(굵게 표시한 'C8230000'번호만 바뀌네요)cmd와 파워쉘 모두 관리자 권한으로 진행해봤습니다.사내망이라 처음엔 프록시 문제가 나와서, 프록시 문제도 따로 해결했고, 다른 동료는 설치가 되는데 저만 저런 오류가 나오고 안되네요ㅠㅠ구글 검색도 같은 오류는 없어서 방법을 못찾고 있습니다.
-
해결됨Vue.js 시작하기 - Age of Vue.js
라우터 종류 관련 문의
저는 강사님 책과 같이 병행하며 학습중입니다.책과 관련된 질문을 해도 괜찮을까요?책에선 기본라우터외에 네스티드라우터, 네임드뷰라우터가추가로 설명되어있습니다.거기서 네스티드는 부모와 자식관계로 한 화면에 여러개의 컴포넌트를 나타낼수있고,네임드뷰는 같은 레벨로 여러개의 컴포넌트를 한번에 표시할 수 있다고 나와있습니다.관계로는 다르다는걸 알겠는데, 결국 한 화면에 여러개의컴포넌트를 나타내는 것 자체는 같아서,어떤 상황에서 각각 사용되는지 궁금합니다.
-
미해결Vue3 완벽 마스터: 기초부터 실전까지 - "실전편"
게시글 묶음(?)별 선택 질문
안녕하세요.현시점 섹션5. vue3 내장 컴포넌트 -> Modal까지 시청했습니다.다른건 이상없이 다 되는데.. 3개씩 보기? 6개씩 보기 선택시 반응이 없습니다.공부겸 해결해보고 싶은데 어디파일로 가서 해결해 볼 수 있을까요?components > posts > PostFilter.vue 파일에서 해결해보면 될까요?
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
vuex와 컴포넌트 설계 관련 질문
안녕하세요, 강의를 잘 수강하고 실무에서도 잘 사용하고 있습니다. 다름이 아니라 몇가지 질문들이 있어서 드립니다. 1) action에서 반드시 mutation을 호출할 필요는 없는 것이죠? view에서 action을 통하여 api를 호출하여 비동기로 데이터를 받은 다음, action을 호출한 method에서 데이터를 처리하고 mutation을 다시 호출하여 state에 넣어도 되는 것이죠? 2) 1번 질문의 연장 질문입니다. action에서 비동기로 받은 데이터를 return을 받는 방법은 일반적인 method에서 return 시키는 방법처럼은 없는 것인가요? 검색해보면 전부 promise를 사용하는 방식인거 같아서요. 3) 제가 이해하기론 view에서는 getter를 이용해서 state의 데이터를 받는 것이라고 이해했습니다.그렇다면 우리가 어떤 컴포넌트의 v-model에 getter를 직접 연결해도 괜찮은가요?실제로 vuex에는 데이터가 잘 반영이 되는데, 이렇게 되면 getter가 mutation의 역할도 같이 해버리는 것 같아서요.찾아보면 value=mapState + @input을 통하여 method에서 mutation을 호출하여 분리하여 처리하라고 하는거 같은데, view에서 바로 state를 붙게되면 또 getter의 의미가 퇴색되는거 같아서 그렇습니다. 4) 특정 메뉴의 컴포넌트의 depth도 깊고 child도 많은 상황이라 vuex를 사용하려합니다. 그런데, 버튼을 클릭하면 특정 컴포넌트를 추가하고 또 삭제도 가능한 상황입니다. v-for를 통하여 vuex에 있는 list에 해당 컴포넌트의 데이터를 추가하고 삭제하면서 관리를 합니다. 다만, 특정 컴포넌트에서 vuex에 있는 데이터에 바로 접근하려면 항상 본인의 index를 props로 내려받아서 list[this.index].object 이런식으로 접근해야하는데, v-for와 vuex를 동시에 사용하는 상황에서 효과적으로 컴포넌트를 설계하는 방식이 있을까요? 5) action과 mutation의 동작 범위action과 mutation은 각각 비동기/동기로 데이터를 처리하는 것으로 이해하고 있습니다.그렇다면 우리가 action과 mutation에도 많은 녀석들이 생성될 텐데요.action과 mutation안에서 단순히 api로 데이터를 비동기로 호출하거나 또는 동기로 state에 데이터를 저장하는 그런 동작 외에 어떤 데이터를 처리하거나 하는 Logic단같은 코드나 함수를 추가해도 되는 것일까요?아니면 그런 코드들은 view에서 생성하고 거기서만 처리하고 action과 mutation에는 단순 데이터를 호출하고 저장하고 하는 그런 코드만 작성하여 최소한으로 해두어야하는 것일까요? 6) 현재 저희는 typescript로 넘어가지 않고 아직 javascript를 사용하고 있습니다.간간히 javascript의 class를 사용하고 간단한 디자인 패턴도 넣어서 같이 구현하곤 하는데요.혹시 다른 객체지향언어(C#, Java)와 같이 class와 상속/조합 과 같은 설계를 많이 사용하시나요?아니면 그런걸 지원하긴 하지만 거의 안쓰시나요?또한, 전략/팩토리/옵저버 등과 같은 간단한 디자인패턴도 사용하시는지? 아니면 브릿지 등과 같은 고급 패턴도 typescript/javascript에서 구현을 해서 사용을 하는 경우도 있는지 이런 부분이 생기면 최대한 backend단으로 넘겨서 처리시키시는지 front에서의 처리를 어느정도로 하는지 궁금합니다. 말솜씨가 안좋아서 저의 질문이 잘 전달되었는지는 모르겠습니다.혹시나 확인하시고 여유가 되신다면 답변을 부탁드립니다 :)
-
미해결[웹 개발 풀스택 코스] Vue.js 프로젝트 투입 일주일 전 - 기초에서 실무까지
Event 다음 extra 부분 질문 있습니다.
안녕하세요, 수업 잘 듣고 있습니다.다름이 아니라 event 수업 듣고 다음으로 넘어왔는데 3_extra부분에 RenderingIf랑 RenderingShow부분 없이 바로 Computed 부분으로 스킵되어 있는데, event부분과 비슷한 내용이거나 별로 중요하지 않아서 일부러 넣지 않으셨는지 궁금합니다.