묻고 답해요

useState 관련 문의드립니다.

해결됨

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

useEffect의 두번째 파라미터에는 useState로 인해 할당된 변수인 time만 쓸 수 있는건가요? function TimerComponent() { const [time, setTime] = React.useState(0); const cnt = 0; React.useEffect(function() { setTime(time+1); }, [cnt]); return ( <div> <h3>{time}초</h3> <button onClick={function() { cnt++; }}>1씩 올려주세요.</button> </div> ); } 이런식으로 사용이 안되는건가요?

• HTML/CSS
• javascript
• react
• node.js
• react-native
• 머신러닝
• express
• tensorflow

결과페이지 선택값 합산하기

미해결

[하루 10분|Web Project] HTML/JS/CSS로 나만의 심리테스트 사이트 만들기

안녕하세요! 좋은 강의 찾게 되어 보고 있는중에 문의 남깁니다. 결과 계산하기에서 value 값이 제일 높은 첫번째 항목을 결과값으로 보여주는데 많이 선택한 부분 출력 말고 정답 선택(1)시 값이 더해지게 바꾸는 방법이 있을까요? 점수 테스트처럼 바꿔서 만들어보고싶은데 강의로 따라하려다보니 만점아니면 빵점만 되서요 ㅠㅠ

• HTML/CSS
• javascript
• bootstrap

반응형 페이지 브레이크포인트에 대해 질문드려도 될까요??

미해결

퍼블리셔 취업 진짜 실전 가이드(PDF)

안녕하세요! 반응형 페이지를 만들다보면 드는 의문이 있어서요.. 물어볼곳이 없어서 질문드려요! 보통 반응형 페이지를 만들때 저는 모바일 320px 이상~ 태블릿 768px 이상~ 피씨는 그때마다 다르지만 한 1200px정도부터 잡고 시작하는데요! 320/768/1200 기준으로 디자인 작업을 하고나서 퍼블리싱을 하다보면 디자인은 딱 width 너비가 잡힌채로 하니까 이쁘게 나오는데 실제로 퍼블리싱하다보면 320px도 모바일이고 767px도 모바일이라 디자인이 애매해질때가 있거든요 ㅠㅠ 혹시 이런 부분은 실무에서 어떤식으로 해결하나요? 브레이크 포인트를 더 많이 잡고 배치를 해야하는 걸까요..?

• HTML/CSS

시계 만들기 실습 관련 질문 있습니다.

미해결

처음 만난 리액트(React)

선생님께서 보여주신 React App 시계 만들기 실습 화면에는 "오후 6:35:38" 처럼 시간 부분에 반짝거리는 효과가 나오는데, 제 화면에서는 다음과 같이 div 부분에 효과가 나오는데, 이게 18 버전이라서 다른건가요? 그게 아니라면 어떤 이유 때문에 다르게 나오는건지 궁금합니다.

• HTML/CSS
• javascript
• react

파일질라 카페24? 관련 질문입니다

미해결

면접과 취업을 부르는 '퍼블리셔 개인 포트폴리오 홈페이지' 제작

위 사진처럼 넣은 이미지들이 상대경로는 잘나오는데 절대경로는 안나온는데 상대경로만 가능한걸까요?

• HTML/CSS
• jquery
• 포트폴리오

scroll-timeline.js 파일을 cdn으로 불러 올 수 없을까요??

미해결

웹 애니메이션의 새로운 표준, Web Animations API

웹 제작 에디터(아임웹)에서 해당 기능을 사용하려고 합니다. 수업에서는 파일을 불러오는데.. 웹 에디터에서는 그런 기능을 지원하지 않아 전체를 복사해서 붙여 넣었는데 오류가 발생합니다. 외부 기능을 쓰는 web-animations 기능은 cdn으로 적용이 잘 되었습니다. 혹시 scroll-timeline.js 내용도 cdn으로 불러올 수 있는 방법이 있을까요?? 검색해도 찾을 수가 없어 문의드립니다. ^^a

• HTML/CSS
• javascript
• 웹-디자인
• 인터랙티브-웹
• frontend

검증을 사용할때

미해결

자바 ORM 표준 JPA 프로그래밍 - 기본편

만약 Member에 검증이 필요하다고 하면 검증객체를 따로 클래스로 만들어서 사용하나요? 엔티티에 덧붙여서 사용하나요?

• java
• jpa
• mvc2
• validation

단위 관련 질문

미해결

모바일 웹 퍼블리싱 포트폴리오 with Figma

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요 선생님 강의 듣고 있다가 문득 궁금한게 생겨 문의 남깁니다. 강의시 rem,vw 단위가 아닌 px단위로 퍼블리싱이 진행되는걸까요? 보통 모바일웹은 px보다는 rem이나 vw 단위를 주로 사용한다는 이야기를 들은적이 있어서 질문 남깁니다. 답변미리감사합니다

• HTML/CSS
• jquery
• 모바일-디자인
• figma
• 포트폴리오

넓이를 %로 적용하긴 어려울까요?

미해결

웹 애니메이션의 새로운 표준, Web Animations API

넓이를 높이를 전부 고정값으로만 사용하게 되는데 혹시 해당 부분은 100% 로 채워서는 적용이 어려울까요? 모바일까지 고려하게되면 퍼센트로 작업해야할것같은데 뭔가 넓이값이 달라지게 되면 중간중간 요소들 컨트롤이 아에 어려운 구조가 될까요?

• HTML/CSS
• javascript
• 웹-디자인
• 인터랙티브-웹
• frontend

양방향 연관관계 순환참조 질문

미해결

자바 ORM 표준 JPA 프로그래밍 - 기본편

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 안녕하세요 강의 잘 듣고 있습니다. 강의를 듣다가 궁금증이 생겨 질문 드립니다. 양방향 연관관계의 설정이 언제 필요할지 생각을 해보았는데 게시글과 댓글의 일대 다 관계에서 게시글을 조회할때 댓글이 같이 조회되는것을 원하는 경우가 있을 것 같습니다. 그렇다면 이전강의에 말씀하셨던 무한 루프(?)에 빠질 수 있을 것 같은데요. 아마 이걸 순환참조라고 말한다고 알고 있습니다. 그러면 애초에 댓글은 댓글대로 따로 조회하고 게시글을 조회할때 댓글 조회하는 방식 즉 연관관계의 주인이 아닌곳에서 리스트를 조회하려고 하는 방식은 안쓰는것이 좋은것인가요?

• java
• jpa

cascade 부모, 자식 동시 적용

미해결

자바 ORM 표준 JPA 프로그래밍 - 기본편

[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? 예 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? 예 [질문 내용] 안녕하세요, cascade 설정과정에서 궁굼증이 생겨 문의드립니다. 부모 객체와 자식객체 양쪽다 CascadeType. ALL 옵션을 주고, 부모쪽에 orphanRemoval = true 옵션을 준 상태에서 Parent parent = new Parent(); Child child = new Child(); Child child2 = new Child(); parent.addChild(child); parent.addChild(child2); Team findParent = em.find(Parent.class, 1L); findParent.getChild().remove(0); 와 같이 진행 했을때, child가 삭제됨 child가 삭제되며 cascade 옵션에 의해 부모인 team을 삭제함 team을 삭제하기 전 cascade 옵션에 의해 자식에 포함된 child를 모두 삭제함 team이 삭제됨 이렇게 이해했고 실제로 parent, child, child2 모두 삭제 되었습니다. 그런데 Parent parent = new Parent(); Child child = new Child(); Child child2 = new Child(); Child child3 = new Child(); ... Child childN = new Child(); parent.addChild(child); parent.addChild(child2); parent.addChild(child3); ... parent.addChild(childN); Team findParent = em.find(Parent.class, 1L); findParent.getChild().remove(0); 이렇게 자식을 3개 이상 넣어줬을경우 자식객체 2개만 삭제(remove에 넣어주는 index에 따라 2개 삭제될 자식이 결정됨)되고 나머지 자식과 부모는 남아있는걸로 확인되는데... 어떤 매커니즘때문에 이런 현상이 나오는걸까요?..

• java
• jpa

코틀린 Companion object

미해결

자바 개발자를 위한 코틀린 입문(Java to Kotlin Starter Guide)

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요! 선생님! 수업을 잘 듣고있는 백엔드 취준생 입니다! 자바를 공부하다가 코틀린도 공부하면 좋을꺼 같아서 같이 공부하고있는데요.. 혹시 좀더 코틀린을 딥하게 파보고 싶은데 추천하시는 사이트 혹시 있으실까요??

• java
• kotlin
• 객체지향

구글 앱스 스크립트는 파일로 다운이 어려운가요?

미해결

현재 구글 앱스 스크랩트를 활용해 특정한 셀의 내용을 다운받는 스크립트를 짜고 있습니다. 자꾸 작동이 되지 않아서 챗gpt에 물어보니 그러려면 자바와 연동을 하든 뭘 하든 구글 앱스 스크립트 내에서는 안된다고 하는데 이거 정말 안되는걸까요?ㅠㅠ

• googleappsscript
• java

강사님 다중요소제어 stagger 질문있습니다

해결됨

웹 애니메이션을 위한 GSAP 가이드 Part.01

vs코드에서 코드를 치면서 보는중인데 새로고침하면 첫번째 요소가 이미 위로 올라간상태로 시작되어서 어색한데 이 부분은 어떻게 해결 가능할까요? duration을 좀 줘보고 해봐도 첫번째 박스는 위로 좀 올라간상태에서 시작하네요 delay: 0.6 정도주면 대충 맞긴한대 delay 주는 방법밖에는 없겠죠? gsap.to(".stage .box", { y: -50, stagger: 0.2, });

• HTML/CSS
• javascript
• 인터랙티브-웹
• gsap

atom 서비스 종료, emmet 설치안됨

미해결

SVG 마스터

안녕하세요. SVG 강의를 이번에 구매하게 되면서 이제 막 준비단계를 하고 있는데요. 강의에선 atom을 설치하고 emmet 패키지를 다운로드 하라고 되어있더라고요. 근데 emmet을 install에 검색해도 안뜨고 구글이던 유튜브에 쳐도 emmet을 다르게 설치하는 방법이 나오지도 않고요. 찾다보니 atom이 22년 12월에 종료 되었다는걸 알게 되었는데 계속 atom으로 공부해도 되는지 모르겠어요. 패키지 설치가 안되니 진도가 나가지지도 않고요 ㅜ 어떻게 해야되나요?

• HTML/CSS
• svg

12강 실습 (섭씨 화씨)

미해결

처음 만난 리액트(React)

안녕하세요 12강 실습코드를 그대로 작성했는데 섭씨온도를 적었을때 화씨온도로 자동으로 변환되어 나타나지 않습니다. 화씨온도를 먼저 적었을때도 마찬가지고요. 코드 한번 봐주실 수 있나요? 감사합니다. Calculator import React, {useState} from "react"; import TemperatureInput from "./Temperatureinput"; function BoilingVerdict(props){ if(props.celsius >= 100){ return <p>물이 끓습니다.</p>; } return <p>물이 끓지 않습니다.</p>; } function toCelsius(fahrenheit){ return ((fahrenheit-32)*5)/9; } function toFahrenheit(celsius){ return (celsius*9)/5+32; } function tryConvert(temperature,convert){ const input = parseFloat(temperature); if(Number.isNaN(input)){ return ""; } const output = convert(input); const rounded = Math.round(output*1000)/1000; return rounded.toString(); } function Calculator(props){ const [temperature, setTemperature] = useState(""); const[scale,setScale]=useState("c"); const handleCelsiusChange = (temperature) => { setTemperature(temperature); setScale("c"); }; const handleFahrenheitChange = (temperature) => { setTemperature(temperature); setScale("f"); }; const celsius = scale === "f" ? tryConvert(temperature, toCelsius):temperature; const fahrenheit = scale === "c" ? tryConvert(temperature, toFahrenheit):temperature; return ( <div> <TemperatureInput scale="c" temperatrue = {celsius} onTemperatureChange={handleCelsiusChange}/> <TemperatureInput scale="f" temperatrue = {fahrenheit} onTemperatureChange={handleFahrenheitChange}/> <BoilingVerdict celsius={parseFloat(celsius)} /> </div> ); } export default Calculator; Temperatureinput const scaleNames = { c:'섭씨', f:'화씨', }; function TemperatureInput(props){ const handleChange = (event) => { props.onTemperatureChange(event.target.value); }; return ( <fieldset> <legend> 온도를 입력해주세요(단위:{scaleNames[props.scale]}); </legend> <input value={props.temperature} onChange={handleChange} /> </fieldset> ); } export default TemperatureInput;

• HTML/CSS
• javascript
• react

왜 쿠폰수가 너무 많을까요?

미해결

실습으로 배우는 선착순 이벤트 시스템

분명 현재 없는 상태이고 결과가 자꾸 이상하게 나와서 sout 처리를 잠시 해보았습니다 package com.example.api.service; import com.example.api.domain.Coupon; import com.example.api.repository.CouponCountRepository; import com.example.api.repository.CouponRepository; import org.springframework.stereotype.Service; @Service public class ApplyService { private final CouponRepository couponRepository; private final CouponCountRepository couponCountRepository; public ApplyService(CouponRepository couponRepository, CouponCountRepository couponCountRepository) { this.couponRepository = couponRepository; this.couponCountRepository = couponCountRepository; } public void applyV1(Long userId) { Long count = couponRepository.count(); if(count > 100) { return; } couponRepository.save(new Coupon(userId)); } public void applyV2(Long userId) { Long count = couponCountRepository.increment(); System.out.println(count); if(count > 100) { return; } couponRepository.save(new Coupon(userId)); } } @SpringBootTest class ApplyServiceTest { @Autowired private ApplyService applyService; @Autowired private CouponRepository couponRepository; @Test public void applyOnce() { applyService.applyV1(1L); long count = couponRepository.count(); Assertions.assertEquals(1L, count); } @Test public void 여러명응모V1() throws InterruptedException { int threadCount = 1000; ExecutorService executorService = Executors.newFixedThreadPool(32); CountDownLatch latch = new CountDownLatch(threadCount); for(int i=0; i<threadCount; i++){ long userId = i; executorService.submit(() -> { try { applyService.applyV1(userId); } catch(Exception e) { System.out.println(e); }finally { latch.countDown(); } }); } latch.await(); long count = couponRepository.count(); assertThat(count).isEqualTo(100); } @Test public void 여러명응모V2() throws InterruptedException { int threadCount = 1000; ExecutorService executorService = Executors.newFixedThreadPool(32); CountDownLatch latch = new CountDownLatch(threadCount); for(int i=0; i<threadCount; i++){ long userId = i; executorService.submit(() -> { try { applyService.applyV2(userId); } catch(Exception e) { System.out.println(e); }finally { latch.countDown(); } }); } latch.await(); long count = couponRepository.count(); org.assertj.core.api.Assertions.assertThat(count).isEqualTo(100); } } 그런데 여러명응모V2 test를 실행시에 count를 출력시 다음과 같은 수가 나옵니다. 20003 20011 20012 20013 20015 20016 20017 20018 20020 20022 ??? 한번 할때마다 1000씩 쿠폰의 수가 증가중인데요;;; 조회했을때는 empty라 나오는데 이렇게 되는 연유를 잘 모르갰습니다. 테스트 코드라서 rollback이 되야할거 같은데 그렇지 않는것도 잘 모르겟네요;; ㅠㅠ

• java
• docker
• spring-boot
• kafka
• redis

SpringDataJpa를 쓸때 수정 기능

미해결

스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술

test 학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? 예 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? 예 [질문 내용] test 강의 내용으로 게시판 만들기를 병행하고 있습니다. 이번 강의에서 Spring Data Jpa로 변경을 하였는데 게시글 수정과 같은 수정 기능은 인터페이스인 SpringDataJpaMemberRepository에서 작성하나요? 아니면 Service단에서 Repository의 find를 통해서 수정하도록 작성하나요? SpringDataJpa에서 find, delete는 있는데 수정은 어떻게 이뤄지는지 궁금합니다..d

• java
• spring
• mvc
• spring-boot

도메인 객체와 엔티티 객체 분리 시 객체 그래프 탐색 관련 질문

해결됨

자바 ORM 표준 JPA 프로그래밍 - 기본편

안녕하세요. 김영한 선생님의 강의를 참 잘 보고 있는 학생입니다. SQL 중심적인 개발의 문제점 편에서, 객체지향 프로그래밍에서 객체는 자유롭게 객체 그래프를 탐색할 수 있어야하 지만 SQL로 개발하는 경우에는 처음 실행하는 SQL에 따라 탐색 범위가 결정된다 는 문제가 있다고 말씀하셨습니다. 그리고 엄격한 도메인 주도 설계의 관점에서는 '도메인 객체'와 '엔티티 객체'를 분리 해야 한다고 알고 있습니다. 비즈니스 로직을 다루는 도메인 객체가 JPA 라고 하는 기술에 의존하는 것은 영 즐거운 일은 아니기 때문이죠.. ( https://stackoverflow.com/questions/24703756/having-separate-domain-model-and-persistence-model-in-ddd ) 그렇기 때문에 도메인 객체와 엔티티 객체를 분리하게 된다면 Repository 계층에서 예를 들어 findById 를 했을 경우 엔티티 객체를 도메인 객체로 매핑해서 돌려주어야 합니다. 그런데 이럴 경우, 기존의 SQL로 개발하는 경우와 비슷한 문제가 발생하게 되는 것 같습니다. 매핑을 어디까지해서 돌려주어야 하느냐는 점이죠. Member 를 조회했을 때, 객체 그래프 안에 있는 Category까지 싹싹 다 조회해와서 매핑을 해주기도 곤란한 노릇이고, MemberWithTeam , MemberWithOrderAndOrderItem... 와 같은 객체를 따로 따로 만드는 것도 요상해보입니다. 그렇다고 객체 그래프를 다 끊어놓자니 그것도 객체지향적이지 않은 것 같아보이구요.. 이런 상황에서는 어떤 식으로 도메인 객체를 설계하는지, 엔티티 객체의 매핑은 어떤 방법으로 이루어지는지가 너무 궁금합니다.

• java
• jpa
• ddd

javascript 연습문제

해결됨

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

javascript 연습문제를 더 풀어보고 싶은데 연습문제만 있는 곳이 있나요?

• HTML/CSS
• javascript
• react
• node.js
• react-native
• 머신러닝
• express
• tensorflow