173만명의 커뮤니티!! 함께 토론해봐요.
미해결
Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃허브 페이지에 권한 요청 글 올렸는데 확인이 안된 것 같아 이곳에 다시 글 남깁니다! 인프런 아이디 : songhaeun111@gmail.com 인프런 이메일 : songhaeun111@gmail.com 깃헙 아이디 : java.she123@gmail.com 깃헙 Username : yaho111
미해결
타입스크립트 입문 - 기초부터 실전까지
똑같이 따라 해봤다고 생각했는데 다시 켜보니..이런 일이 벌어졋습니다 ㅠㅠ 뭐가 문제인지 알고싶습니다 ㅠㅠ
미해결
Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
'개발 환경 설정 및 깃헙 리포지토리 클론' 강의에서 개발환경 구성 시 아래 강의 참고하라고 하셨는데 현재는 없나보네요~ 어떤 것 참고해서 구성하면 될까요? <누구다 다루기 쉬운 Vue.js 프론트 개발 - 3시간 안에 배우기 강좌의 Node.js, Chrome, Vue.js 크롬 플러그인, Github 설치>
미해결
Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
인프런 아이디 : @leejs 인프런 이메일 : leejs@hdc-labs.com 깃헙 아이디 : asooso1212@gmail.com 깃헙 Username : asooso12
미해결
풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]
- 본 강의 영상 학습 관련 문의에 대해 답변을 드립니다. (어떤 챕터 몇분 몇초를 꼭 기재부탁드립니다) - 이외의 문의등은 평생강의이므로 양해를 부탁드립니다 - 현업과 병행하는 관계로 주말/휴가 제외 최대한 3일내로 답변을 드리려 노력하고 있습니다 - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 자료이메일 요청에 대한 답변이 없어서 두번 요청드렸는데요! 드라이브 승인이 된걸까요? 인프런아이디 el입니다.
미해결
Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
인프런 아이디 : skswngusslab@gmail.com 인프런 이메일 : skswngusslab@gmail.com 깃헙 아이디: skswngussla@naver.com 깃헙 Username : lyd1040
미해결
실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] plugins { id 'org.springframework.boot' version '2.6.5' id 'io.spring.dependency-management' version '1.0.11.RELEASE' id 'java' id "com.ewerk.gradle.plugins.querydsl" version "1.0.10" } group = 'com.example' version = '0.0.1-SNAPSHOT' sourceCompatibility = '11' ext["hibernate.version"] = " 5.6.5.Final " configurations { compileOnly { extendsFrom annotationProcessor } } repositories { mavenCentral() } dependencies { implementation 'org.springframework.boot:spring-boot-starter-thymeleaf' implementation 'org.springframework.boot:spring-boot-starter-web' implementation 'javax.validation:validation-api' implementation 'com.fasterxml.jackson.datatype:jackson-datatype-hibernate5' //JdbcTemplate 추가 //implementation 'org.springframework.boot:spring-boot-starter-jdbc' //MyBatis 추가 implementation 'org.mybatis.spring.boot:mybatis-spring-boot-starter:2.2.0' //JPA, 스프링 데이터 JPA 추가 implementation 'org.springframework.boot:spring-boot-starter-data-jpa' //Querydsl 추가 implementation 'com.querydsl:querydsl-jpa' annotationProcessor "com.querydsl:querydsl-apt:$ { dependencyManagement.importedProperties['querydsl.version'] } :jpa" annotationProcessor "jakarta.annotation:jakarta.annotation-api" annotationProcessor "jakarta.persistence:jakarta.persistence-api" //H2 데이터베이스 추가 runtimeOnly 'com.h2database:h2' compileOnly 'org.projectlombok:lombok' annotationProcessor 'org.projectlombok:lombok' testImplementation 'org.springframework.boot:spring-boot-starter-test' //테스트에서 lombok 사용 testCompileOnly 'org.projectlombok:lombok' testAnnotationProcessor 'org.projectlombok:lombok' } tasks.named('test') { useJUnitPlatform() } //querydsl 추가 //def querydslDir = '$buildDir/generated' def querydslDir = "src/main/generated" //clean { // delete file(generated) //} querydsl { library = "com.querydsl:querydsl-apt" jpa = true querydslSourcesDir = querydslDir } sourceSets { main { java { srcDirs = ['src/main/java', querydslDir] } } } compileQuerydsl { options.annotationProcessorPath = configurations.querydsl } configurations { querydsl.extendsFrom compileClasspath } 강사님이 올려주신 내용 + 구글링 + 직접 수정했습니다. 간혹, 빌드는 되는데 generated 파일에 QClass 안보이시는 분들은 queryDsl 저장되는 경로에 $buildDir 대신 'src/main/'으로 해보세요
미해결
프로젝트로 배우는 React.js
import { useParams } from "react-router-dom"; const ShowPage = () =>{ const {id} = useParams(); console.log(id); return <div>Show Page</div>; }; export default ShowPage;
미해결
실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
주문 서비스 개발 부분 강의를 듣다가 궁금한 점이 있어 질문드립니다. 주문 취소(OrderService.cancelOrder) 부분에서order.cancel() 만 작성하면 JPA 특징으로 인해, 데이터 업데이트 관련 쿼리 로직 없이 자동으로 업데이트 된다고 하셨는데요. 주문 생성(OrderService.order)의 EntityManager 가 사용된 orderRepository.save (order); 와 혼동이 와서 질문 남깁니다. 주문 취소 order.cancel() 메서드를 타면서 엔티티의 값(status, count 등) 변경 내역이 자동으로 업데이트 되는 것이라고 하면, 주문 생성도 Order.createOrder(member, delivery, orderItem); 를 타면서 엔티티의 값들을 설정하기 때문에 orderRepository.save (order); 를 사용하지 않아도 되는게 아닌가 라는 생각이 듭니다. 제가 JPA 를 잘 몰라서 혼란이 오는 것 같은데.. 쿼리는 직접 작성하지 않아도 업데이트/저장/삭제 등 DB 조작이 일어나려면 EntityManager 를 통해야 된다고 생각하고 있었습니다. 주문 취소는 EntityManager 없이 업데이트 되고, 주문 생성은 EntityManager의 persist() 를 사용해서 저장하는 것 이 2가지 차이점에 대해서 설명 부탁드립니다! 감사합니다 :)
미해결
타입스크립트 입문 - 기초부터 실전까지
.eslintrc.js, package.json 같은 파일들은 직접 작성한건가요? 아니면 관련 커맨드 쳐서 생성되는 건가요? 만약 직접 작성하신거면, 저희가 직접 프로젝트 만들 때는 공식문서를 보면서 어떤걸 적어야 하는지 따로 공부해야 하나요? 꽤나 복잡해보이네요
해결됨
실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화
[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예) [질문 내용] 현재 스프링 부트 3.1 로 강의를 따라가고 있습니다. default_batch_fetch_size:10 을 설정해서 나가는 쿼리가 줄어드는 것을 확인했습니다만, 쿼리가 두 개가 아니고 총 세 개가 나왔습니다. 023-06-13T23:24:02.666+09:00 DEBUG 68750 --- [nio-8080-exec-5] org.hibernate.SQL : select o1_0.order_id, d1_0.delivery_id, d1_0.city, d1_0.street, d1_0.zipcode, d1_0.status, m1_0.memeber_id, m1_0.city, m1_0.street, m1_0.zipcode, m1_0.name, o1_0.order_date, o1_0.status from orders o1_0 join member m1_0 on m1_0.memeber_id=o1_0.member_id join delivery d1_0 on d1_0.delivery_id=o1_0.delivery_id offset ? rows fetch first ? rows only 2023-06-13T23:24:02.676+09:00 INFO 68750 --- [nio-8080-exec-5] p6spy : #1686666242676 | took 2ms | statement | connection 8| url jdbc:h2:tcp://localhost/~/springbootjpa select o1_0.order_id,d1_0.delivery_id,d1_0.city,d1_0.street,d1_0.zipcode,d1_0.status,m1_0.memeber_id,m1_0.city,m1_0.street,m1_0.zipcode,m1_0.name,o1_0.order_date,o1_0.status from orders o1_0 join member m1_0 on m1_0.memeber_id=o1_0.member_id join delivery d1_0 on d1_0.delivery_id=o1_0.delivery_id offset ? rows fetch first ? rows only select o1_0.order_id,d1_0.delivery_id,d1_0.city,d1_0.street,d1_0.zipcode,d1_0.status,m1_0.memeber_id,m1_0.city,m1_0.street,m1_0.zipcode,m1_0.name,o1_0.order_date,o1_0.status from orders o1_0 join member m1_0 on m1_0.memeber_id=o1_0.member_id join delivery d1_0 on d1_0.delivery_id=o1_0.delivery_id offset 0 rows fetch first 100 rows only; 2023-06-13T23:24:02.681+09:00 DEBUG 68750 --- [nio-8080-exec-5] org.hibernate.SQL : select o1_0.order_id, o1_0.order_item_id, o1_0.count, o1_0.item_id, o1_0.order_price from order_item o1_0 where array_contains(?,o1_0.order_id) 2023-06-13T23:24:02.689+09:00 INFO 68750 --- [nio-8080-exec-5] p6spy : #1686666242689 | took 0ms | statement | connection 8| url jdbc:h2:tcp://localhost/~/springbootjpa select o1_0.order_id,o1_0.order_item_id,o1_0.count,o1_0.item_id,o1_0.order_price from order_item o1_0 where array_contains(?,o1_0.order_id) select o1_0.order_id,o1_0.order_item_id,o1_0.count,o1_0.item_id,o1_0.order_price from order_item o1_0 where array_contains('ar2: ARRAY [CAST(1 AS BIGINT), CAST(2 AS BIGINT), NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL]',o1_0.order_id); 2023-06-13T23:24:02.690+09:00 DEBUG 68750 --- [nio-8080-exec-5] org.hibernate.SQL : select i1_0.item_id, i1_0.dtype, i1_0.category_item_id, i1_0.name, i1_0.price, i1_0.stock_quantity, i1_0.author, i1_0.isbn, i1_0.artist, i1_0.etc from item i1_0 where array_contains(?,i1_0.item_id) 2023-06-13T23:24:02.691+09:00 INFO 68750 --- [nio-8080-exec-5] p6spy : #1686666242691 | took 0ms | statement | connection 8| url jdbc:h2:tcp://localhost/~/springbootjpa select i1_0.item_id,i1_0.dtype,i1_0.category_item_id,i1_0.name,i1_0.price,i1_0.stock_quantity,i1_0.author,i1_0.isbn,i1_0.artist,i1_0.etc from item i1_0 where array_contains(?,i1_0.item_id) select i1_0.item_id,i1_0.dtype,i1_0.category_item_id,i1_0.name,i1_0.price,i1_0.stock_quantity,i1_0.author,i1_0.isbn,i1_0.artist,i1_0.etc from item i1_0 where array_contains('ar3: ARRAY [CAST(1 AS BIGINT), CAST(2 AS BIGINT), CAST(3 AS BIGINT), CAST(4 AS BIGINT), NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL, NULL]',i1_0.item_id); 수강 중에 제가 따라 작성한 코드를 스프링부트 2.4.1에 그대로 옮겨보니 강의 내용대로 where in 쿼리가 나오는 것을 확인했습니다. 스프링부트 버전 차이에서 나오는 쿼리가 달라진 것 같은데, 제 생각이 맞을까요? 답변 확인 : 빠르게 답변해주셔서 감사합니다!! 덕분에 array_contains 로 최적화된 이유를 쉽게 이해할 수 있었습니다. (Hibernate에서 최적화를 했었었군요!) 아 그리고 강의 내용에서 쿼리 세 개 나온다는 것을 확인했습니다(잘못 본 것에 대해 질문글에서 수정을 해놨어야 했는데 빼놓지 않았었네요 ㅠㅠ) 다시 한번 상세한 답변 정말 감사드립니다.
미해결
타입스크립트 입문 - 기초부터 실전까지
좋은 강의 감사드립니다 강사님~^^ 강의를 처음 따라오다가 보니 자동 완성이 되는 부분이 있고 안되는 부분이 있네요. 타입스크립트의 장점을 이해하는데는 무리가 없었지만 혹여나 이 부분에 대해 관심 있으신 분들은 아래 스샷을 참고하시길 바라겠습니다^^ (전) (후)
미해결
Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
TodoList.vue코드 <template> <div> <ul> <!-- <li v-for="(todoItem, index) in todoItems" v-bind:key="todoItem.item" class="shadow"> {{todoItem}} <i class="checkBtn fa-solid fa-check" v-bind:class="{checkBtnCompleted: todoItem.completed}" v-on:click="toggleComplete(todoItem, index)"></i> v-bind:class="{A:a}" A클래스의 a속성이 false면 안나타남, true면 나타남 --> <!-- <span v-bind:class="{textCompleted: todoItem.completed}"> {{ todoItem.item }} </span> <span class="removeBtn" v-on:click="removeTodo(todoItem, index)"> <i class="fa-solid fa-trash-can"></i> </span> </li>> --> <li v-for="(todoItem, index) in todoItems" v-bind:key="todoItem" class="shadow"> <i class="checkBtn fa-solid fa-check" v-bind:class="{ checkBtnCompleted: todoItem.completed }" v-on:click="toggleComplete(todoItem, index)"></i> {{ todoItem.item }} {{ index }} <!-- //v-bind:class="{A:a}" A클래스의 a속성이 false면 안나타남, true면 나타남 --> <span v-bind:class="{ textCompleted: todoItem.completed }"> {{ todoItem}} </span> <span class="removeBtn" v-on:click="removeTodo"> <i class="fa-solid fa-trash-can"></i> </span> </li> </ul> </div> </template> <script> export default { data: function () { return { todoItems: [] } }, methods: { removeTodo: function (todoItem, index) { console.log('remove items'); console.log(todoItem, index); localStorage.removeItem(todoItem); this.todoItems.splice(index, 1); }, toggleComplete: function (todoItem, index) { todoItem.completed = !todoItem.completed; console.log(index); console.log(todoItem.item); //로컬스토리지 갱신 localStorage.removeItem(todoItem.item); localStorage.setItem(todoItem.item, JSON.stringify(todoItem)); } }, created: function () { if (localStorage.length > 0) { for (var i = 0; i < localStorage.length; i++) { if (localStorage.key(i) !== 'loglevel:webpack-dev-server') { console.log(JSON.parse(localStorage.getItem(localStorage.key(i)))); this.todoItems.push(localStorage.key(i)); } } } } } </script> <style scoped> ul { list-style-type: none; padding-left: 0px; margin-top: 0; text-align: left; } li { display: flex; min-height: 50px; height: 50px; line-height: 50px; margin: 0.5rem 0; padding: 0 0.9rem; background: white; border-radius: 5px; } .removeBtn { margin-left: auto; color: #de4343; } .checkBtn { line-height: 45px; color: #62acde; margin-right: 5px; } .checkBtnCompleted { color: #b3adad; } .textCompleted { text-decoration: line-through; color: #b3adad; } </style> TodoInput.vue코드 <template> <div class="inputBox shadow"> <input type= "text" v-model="todoItems" v-on:keyup.enter="addTodo"> <span class="addContainer" v-on:click="addTodo"> <i class="fas fa-plus addBBtn"></i> </span> </div> </template> <script> export default { data: function(){ return{ todoItems: "" } }, methods:{ addTodo: function(){ if(this.todoItems !== ''){ //저장하는 로직 //localStorage.setItem(key, value); //localStorage.setItem(this.newTodoItem, this.newTodoItem); var obj = {completed: false, item: this.todoItems}; //localStorage.setItem(this.newTodoItem,obj); localStorage.setItem(this.todoItems, JSON.stringify(obj)); //obj 객체 > string화 this.clearInput(); } }, clearInput: function(){ this.todoItems = ''; } } } </script> <style scoped> input:focus{ outline: none; } .inputBox { background: white; height: 50px; line-height: 50px; border-radius: 5px; } .inputBox input { border-style: none; font-size: 0.9rem; } .addContainer { float: right; background: linear-gradient(to right, #6478FB, #8763FB); display: block; width: 3rem; border-radius: 0 5px 5px 0; } .addBtn { color: white; vertical-align: middle; } </style>
미해결
실전! Querydsl
안녕하세요. where 조건을 동적으로 생성해주는 부분에 대해서는 충분히 이해가 되었습니다. 그런데 혹시 특정 condition 값에 따라 join을 해줘야하는 테이블이 다른 경우라면 어떻게 처리되어야 할지 모르겠어서 글을 남기게 되었습니다. condition조건에 teamName이 있을 때만 team을 조인해주고 싶은데 join 구문을 동적으로 처리할 수 있는 좋은 방법이 어떤 것인지 질문드립니다. 😭 감사합니다.
미해결
프로젝트로 배우는 React.js
BlogList.js까지는 강의와 동일하게 에러처리가 되었으나 ShowPage.js에서 에러 처리 후 확인을 하면 글 수정후 => DB끄고 => edit버튼을 누른 상태입니다. 깃 허브에서 ShowPage.js파일 소스를 그대로 복사 붙이기 해도 그렇습니다. 제가 어느 부분을 놓쳐서 이런건지? 어디가 잘못된 것인지? ... 잘 모르겠습니다.^^ ㅠㅠ
미해결
타입스크립트 입문 - 기초부터 실전까지
유니온 타입에서 | : 교집합 & : 합집합 으로 이해하면 되겠네요. ^^
해결됨
프로젝트로 배우는 React.js
강의를 보면서 적용을 했는데 toast가 2개씩 뜨고 2개씩 사라집니다.. 이 경우 어떻게 해야할까요?? .then(() => { addToast({ type: "success", text: "Successfully created", }); history.push("/admin"); }) .catch((e) => { addToast({ text: "We could not create blog", type: "danger", }); });
해결됨
실전! Querydsl
[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예) [질문 내용] 수정, 삭제 벌크 연산의 6:20 부분에서 update쿼리로 인한 영속성컨텍스트 문제를 설명해주셨는데요. 전 강의에서 em.flush()실행되는 조건들을 설명해주실 때, 직접 호출 시 트랜잭션 커밋 시 JPQL쿼리 실행 시 em.flush()가 실행된다고 설명해주신 것으로 기억하고 있습니다. querydsl도 결국 JPQL기반으로 작동된다고 알고 있는데, querydsl을 통한 select쿼리 실행을 하면 자동으로 em.flush()가 실행되지 않고, 직접 해주어야 하는 메커니즘이 궁금합니다!
미해결
스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술
안녕하세요, build.gradle의 빌드 실패가 나서 문의드립니다. JDK 버전은 다음과 같이 17.0.6입니다. 그리고 인텔리제이 설정은 다음과 같습니다. java 컴파일러 설정 2. 빌드 도구 설정 3. 프로젝트 설정 마지막으로 처음 프로젝트를 다운로드 받았던 설정은 다음과 같습니다.(spring boot 3.0.7 버전 사용) 처음 build.gradle을 실행할 때부터 에러 로그 하나도 없이 그냥 빌드 실패했다는 에러가 뜹니다. 컴퓨터를 여러번 껐다가 켜봐도 여전히 같은 에러가 뜹니다. 인텔리제이와 스프링이 완전 처음이라서 이 에러를 어떻게 해결해야 하는지 모르겠습니다. 커뮤니티의 다른 글들을 참고해봐도 딱히 도움이 되지는 않는 것 같습니다. 도와주시면 너무 감사하겠습니다.
해결됨
타입스크립트 입문 - 기초부터 실전까지
// 딕셔너리 패턴 interface StringRegexDictionary { // 규칙 // 왼쪽에 오는 것은 문자열 속성 + 값은 정규표현식이 와야 함 [key: string]: RegExp; } var obj: StringRegexDictionary = { cssFile: /\.css$/, jsFile: /\.js$/, } 위의 코드에서 질문있습니다! 위의 코드는, 해당 강의에서 입력한 코드의 일부분입니다. 강사님께서 인터페이스대로라면, key값이 string으로 되어있어야 한다고 했는데, 그러면 cssFile, jsFile이 아니라, "cssFile", "jsFile"이어야 하는거 아닌가요? 답변해주시면 감사하겠습니다.
