inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

변경된 input 값이 텍스트로 보이지 않습니다.

해결됨

처음 만난 리액트(React)

개발자 도구로 보면 섭씨에 값 입력 시 화씨 input에도 값이 담기고 변하는데 텍스트는 보이지 않습니다... 찾아보니 <input value="{props.temperature}"> 대신 <input defaultValue="{props.temperature}"> 를 쓰면 된대서 defaultValue를 쓰면 텍스트가 잘 나옵니다... 아래 사진은 <input defaultValue={props.temperature}>으로 수정했을 때 입니다. 왜 <input value=""> 대신 <input defaultValue="">를 사용해야 정상적으로 나오는지 궁금합니다. TemperatureInput.jsx const scaleNames = { c: "섭씨", f: "화씨", }; function TemperatureInput(props) { const handleChange = (event) => { props.onTemperatureChange(event.target.value); }; return ( <fieldset> <legend>온도를 입력해주세요(단위: {scaleNames[props.scale]})</legend> <input vaule={props.temperature} onChange={handleChange} /> </fieldset> ); } export default TemperatureInput; Calculator.jsx 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); //섭씨 or 화씨로 변환 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" temperature={celsius} onTemperatureChange={handleCelsiusChange} /> <TemperatureInput scale="f" temperature={fahrenheit} onTemperatureChange={handleFahrenheitChange} /> <BoilingVerdict celsius={parseFloat(celsius)} /> </div> ); } export default Calculator;

  • HTML/CSS
  • javascript
  • react
@_@ 댓글 1 좋아요 0 조회수 458

css float 이용하기 부분에서 :after 적용이 안됩니다

미해결

코알못에서 웹서비스 런칭까지 : 2021 제주 코딩 베이스캠프(Django)

visual studio code를 사용하고 있습니다 코드는 똑같이 사용했으나 :after를 사용해도 코드가 적용이 되지않습니다 자동완성을 사용해서 보니 ::after의 기능은 있어도 :after의 기능이 없어 ::after도 사용해봤지만 적용이 안됩니다 ㅜ visual studio code에서는 지원이 안되는 걸까요 아니면 저의 문제일까요

  • HTML/CSS
  • javascript
  • python
  • django
  • bootstrap
  • linux
  • git
  • jquery
bbin0409 댓글 1 좋아요 0 조회수 498

D유형 숏컷부분 정렬문의합니다

미해결

[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드

위사진은 강의에쓰인 사진이고 밑에사진은 제가만드는곳인데 숏컷부분이 강의사진처럼 길게 오른쪽까지 안퍼지고 저렇게밖에 안되는데 어떻케 해야지 끝과끝 중앙으로 보기좋게 설정하나요 ?

  • HTML/CSS
  • jquery
  • 웹-디자인
jkjk7088 댓글 1 좋아요 1 조회수 234

선생님 피그마 질문입니다.

해결됨

[코드캠프] 시작은 프리캠프

저는 이렇게 강의화면처럼code부분이 뜨질 않는데 어떻게 하면 나오게 할 수 있나요>?

  • HTML/CSS
  • javascript
지 민 댓글 1 좋아요 0 조회수 255

23분29초 질문있습니다!

해결됨

[코드캠프] 시작은 프리캠프

body에서 컨텐트박스는 1 보더박스는 3으로 설정했는데, head의 style 안에 박스사이징 하는 부분을 건들였을 때 왜 박스2의 크기가 박스1의 크기를 따라가는 건가요?

  • HTML/CSS
  • javascript
지 민 댓글 2 좋아요 0 조회수 220

penJDK 64-Bit Server VM warning: Options -Xverify:none and -noverify were deprecated in JDK 13 and will likely be removed in a future release. 오류

미해결

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

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요. OpenJDK 64-Bit Server VM warning: Options -Xverify:none and -noverify were deprecated in JDK 13 and will likely be removed in a future release. 이러한 오류가 뜨는데, 실행하는데는 문제가 없습니다. 이 오류를 고쳐야 할 것 같은데, 어떻게 고쳐야할까요?

  • java
  • spring
  • mvc
  • spring-boot
댓글 1 좋아요 0 조회수 380

실무에서 사용자 정의 함수를 많이 사용하나요?

해결됨

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

실무에서 DB방언을 상속받아 사용자 정의 함수를 등록해서 사용하는 경우가 많은지 궁금합니다!

  • java
  • jpa
spacebar 댓글 1 좋아요 0 조회수 366

14분 15초경 질문있습니다.

해결됨

[코드캠프] 시작은 프리캠프

rel="stylesheet"에서 스타일시트는 뭐를 의미 하나요? 자동완성도 안되던데 왜 패스워드 부분의 색을 바꾸는건지 궁금합니다.

  • HTML/CSS
  • javascript
지 민 댓글 1 좋아요 0 조회수 191

브라우저별 호환성 접두어

미해결

초보자를 위한 Sass 기초 강의 & 자몽톡 클론코딩

저는 6분 50초대 보면 선생님께서 브라우저별 호환성까지 고려해서 접두어까지 저절로 붙은 스타일이 알아서 완성 됐다고 하시는데 저는 이렇게만 뜨는데 왜그런걸까요? .one { width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; background-color: orange; } .two { width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; background-color: orange; }/*# sourceMappingURL=main.css.map */

  • HTML/CSS
  • sass
  • 클론코딩
윤종호 댓글 1 좋아요 0 조회수 299

Axios 맛집 목록 API 데이터 요청 에러

미해결

비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지

이런게 뜨는데,,, 백 작업한쪽 nodemon 해서 서버 켰는데 왜 이런 에러가 뜰까요??? 이 전 까지는 문제 없었는데 이유를 알 수 있을까요?

  • HTML/CSS
  • javascript
  • aws
  • git
  • mysql
  • rest-api
  • github
SeungJoo 댓글 2 좋아요 0 조회수 514

안녕하세요 강사님 이전 재고 관리 강의와 차이에 대해 궁금합니다.

미해결

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

쿠폰 생성 발급 로직도 컬럼에 쿠폰의 개수를 지정해놓으면 이전 강의랑 똑같은 거 같은데 왜 이번 강의는 쿠폰 엔티티를 새로 생성해서 그 개수를 체크하는 건지 궁금합니다. 이전 컬럼에 개수를 두어 관리하는 거랑 지금처럼 엔티티를 생성하는 방식의 차이점이 너무 궁금해요 항상 감사합니다.

  • java
  • docker
  • spring-boot
  • kafka
  • redis
진짜 잘하고싶다 댓글 2 좋아요 0 조회수 583

html 타이틀부분 18분30초

해결됨

[코드캠프] 시작은 프리캠프

<title>Jimin world</title>이라고 하니까 정의되지 않았다고 뜨던데 이유가 뭔가용?

  • HTML/CSS
  • javascript
지 민 댓글 1 좋아요 0 조회수 326

nth-child(2n+1)에 대해 궁금해요

해결됨

따라하며 배우는 HTML, CSS

nth child는 몇 번째 자식 요소를 선택할 것 인지는 이해했습니다만 질문이 있습니다. Q1. nth-child(2n+1)은 왜 홀수 선택이 되는 건가요? nth-child(2n+1)이 홀수가 되는 이유를 좀 더 풀어서 설명해주시면 좋겠습니다! Q2. nth-chlid(2)와 nth-child(2n)의 차이가 궁금해요. nth-child(5)가 5번째부터 선택되는 거라면 nth-child(5n)이런식으로도 표현할 수 있나요? 이 경우 5의 배수를 선택하는 건가요? 괄호 안에 들어가는 부분이 뭔지 좀 더 설명해주심 좋겠습니다!!

  • HTML/CSS
연수 댓글 1 좋아요 0 조회수 522

쿠폰 카운트를 Redis에 의존하고 있는데요

미해결

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

만약 Redis에 장애가 발생한다면 2차 장치로 DB Count에 의존할 수 밖에 없는걸까요? 실무에선 어떻게 대응하시는지 궁금합니다!

  • java
  • docker
  • spring-boot
  • kafka
  • redis
목동 개발자 댓글 2 좋아요 4 조회수 1075

MySql 8버전

미해결

비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지

커뮤니티에 있는 my sql 8버전 명령어를 사용했는데 이렇게만 뜨는데 어떻게 하면 될까요?? ㅠ 그리고 aws에서 18버전이 없어서 20버전으로 했는데 20버전이 혹시 mysql 8버전만 지원하는지 궁금합니다.

  • HTML/CSS
  • javascript
  • aws
  • git
  • mysql
  • rest-api
  • github
SeungJoo 댓글 2 좋아요 0 조회수 400

MySQL 사용에 대한 조언 질문있습니다.

해결됨

Java/Spring 주니어 개발자를 위한 오답노트

안녕하세요 주니어 개발자 길라잡이가 되주셔서 감사합니다. fulltext index에 대해서 질문이 있습니다. 임계점이 올경우 튜닝으로도 해결할 수 없는 문제라고 말씀해주셨는데요 경험담이라고 해주셨는데 그 경험담을 듣고 싶어서 질문을 남겨봅니다. 공식 문서에서 찾아보니까 https://dev.mysql.com/doc/refman/8.0/en/innodb-fulltext-index.html#innodb-fulltext-index-deletion 동시 경합이 발생할 수 있다고 작성이 되어있는데 이 문제로 발생한건가요 ? 아니면 다른 인덱스와 다르게 인덱스 용량 때문에 발생한 문제이신건가요 ? FULLTEXT INDEX의 한계 검색을 해도 다 좋은점만 나오더라구요..

  • java
  • spring
  • 객체지향
  • 소프트웨어-테스트
티벳로보 댓글 2 좋아요 0 조회수 887

summernote를 적용하고 이미지를 업로그하면 모바일에서 볼때는 이미지가 크게 나오는데 어떻게 해야 되나요?

미해결

Do It! 장고+부트스트랩: 파이썬 웹개발의 정석

안녕하세요. 섬머노트 적용하는 방법을 알려주셔서 게시판을 만들었는데요. 컴퓨터로 볼때는 이미지가 화면에 꽉 차게 나오던데요. 모바일로 게시판에 접속하면 이미지파일이 엄청 크게 나오더라고요. 이미지 크기가 변경이 안되고 그대로인것같은데요. 이미지도 반응형으로 만들려면 어떻게 해야 되나요? 검색하면 이미지를 반응형으로 만드는 방법이 있긴한데요. 섬머노트에는 어떻게 해야될지 모르겠더라고요. 화면이 작아지면 이미지 크기고 작아지게 할려면 어떻게 해야 되나요?

  • HTML/CSS
  • javascript
  • python
  • django
  • bootstrap
  • aws
  • docker
  • tdd
하용우 댓글 2 좋아요 0 조회수 941

fetchPointTransactionsOfBuying API에서 특정 정보만 불러와지지 않습니다.

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

안녕하세요 강사님. 마이페이지 내 포인트 화면의 구매내역 조회기능을 구현 중에 있습니다. fetchPointTransactionsOfBuying API 로 구매내역을 조회하는데 판매자의 이름이 불러와지지 않습니다.. const FETCH_POINT_TRANSACTIONS_OF_BUYING = gql` query fetchPointTransactionsOfBuying($search: String, $page: Int) { fetchPointTransactionsOfBuying(search: $search, page: $page) { _id impUid amount balance status statusDetail useditem { _id name price seller { _id # name # email } buyer { _id name email } soldAt } createdAt } } `; useditem.seller._id 까지는 조회가 되는데 name 과 email 은 조회가 되지않습니다. 혹시나 해서 buyer 정보를 불러왔는데 buyer 도 _id 만 조회가 되고 name 과 email 는 조회가 되지 않습니다. 위와 같은 오류가 나오는데 제가 모르는 부분이 있는건지 데이터에 문제가 있는건지 잘 모르겠습니다.. !

  • react
  • node.js
  • seo
  • graphql
  • next.js
summery 댓글 2 좋아요 0 조회수 348

JPA 최적화 강의 수강 후, 개인 프로젝트 수행하면서 생긴 질문입니다.

해결됨

실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화

안녕하세요. JPA 최적화 강의를 수강하고, 개인적으로 DDD를 책으로 공부해본 후에 개인 토이 프로젝트를 진행하던 중, 뜻밖에 의문이 생겼는데 여쭐 곳이 없어서 이렇게 질문 올리게 되었습니다. 맨 땅에 헤딩으로 이런저런 강의, 책, 다른 분들의 소스를 참고 하려다보니 여러 개념이 뒤섞여서 혼동이 옵니다.. ㅠㅠ 현재 프로젝트에서는 크게 에그리거트를 CUSTOMER, EXTERNAL, SECURITYMEDIA 3개로 나누어 설계했는데요. 강의에서도, 책에서도 DOMAIN 계층에 있는 서비스는 해당 도메인에 대한 순수한 CRUD를 수행하는 것으로 보았습니다. DDD 책에서는 여러 에그리거트가 필요로 하는 기능을 구현할 때는 도메인 서비스로 구현하라고 이야기 했구요. 처음에는 책에서 조언하는 대로 도메인 서비스로 구현해보고자 하다가, 좀처럼 구현이 안되어서 다른 분들이 구현한 소스를 참조하다 보니 application(응용)영역을 FACADE라는 상위 계층을 두는 것을 방식을 알게 되었습니다. 소스를 따라가보니 각 애그리거트의 DOMAIN 영역에 있는 서비스를 주입하여, 각 도메인 영역에 있는 서비스를 적절히 호출하기에 책에서 본 도메인 서비스와 같은 역할을 하겠구나 하여,, 해당 프로젝트 구성 방식을 따라 개발해보기로 했습니다. 그런데 개발을 하다보니,, 참조하는 소스에서 메소드 단위의 트랜잭션의 적용을 facade 영역이 아닌, 도메인 영역의 서비스 구현체에서 하는 것을 알게 되었습니다. 제가 개발하고자 기능은 여러 애그리거트를 생성, 변경하는 하나의 행위가 하나의 트랜잭션으로 묶여야 하는데 말이죠. 이러한 이유 때문에 현재 소스는 FACADE에서는 하나의 도메인 영역의 서비스를 주입하여 하나의 메소드를 호출하도록 되어있고, 도메인 영역에 있는 해당 서비스의 구현체에서 여러 애그리거트의 서비스, 레포지토리를 주입받아 하나의 메소드에서 트랜잭션 단위로 수행하도록 구현되어있습니다.. @Service @RequiredArgsConstructor public class SecurityMediaFacade { private final SecurityMediaService securityMediaService; public SecurityMediaInfo.Main registerOtp(SecurityMediaCommand.RegisterSecurityMediaRequest req) { //디지털otp 발급 // 디지털 otp 발행 return securityMediaService.issueSecurityMedia(req, SecurityMediaType.DIGITAL_OTP); } ... } public interface SecurityMediaService { public SecurityMediaInfo.Main issueSecurityMedia(SecurityMediaCommand.RegisterSecurityMediaRequest req, SecurityMediaType type); ... } @Slf4j @Service @RequiredArgsConstructor public class SecurityMediaServiceImpl implements SecurityMediaService { private final CustomerReader customerReader; private final SecurityMediaStore securityMediaStore; private final TokenStore tokenStore; private final ExternalClientService externalClientService; @Override @Transactional public SecurityMediaInfo.Main issueSecurityMedia(SecurityMediaCommand.RegisterSecurityMediaRequest req, SecurityMediaType type) { // 요청고객 찾기 Customer customer = customerReader.findCustomerByRnn(req.getRnn()); SecurityMedia newOtp = null; if(!customer.existActiveSecurityMedia()) { // otp 신규 SecurityMedia initOtp = req.toEntity(SecurityMediaType.DIGITAL_OTP, customer); newOtp = securityMediaStore.store(initOtp); // 토큰 발급 요청 Token newToken = externalClientService.getToken(customer, newOtp); newOtp.addToken(newToken); tokenStore.store(newToken); } return new SecurityMediaInfo.Main(newOtp); } 위에는 프로젝트의 구성인데.. 첫 단추부터 잘못 끼운 것도 같아서 시작 단계인 지금에서라도 좀 개선을 해보려고 하는데요. 사실 도메인 서비스가 제가 의도로 하는 여러 애그리거트의 서비스 기능을 묶어서 하는 건지 아무리 읽어봐도 혼선이 옵니다. 혹시 DDD 책에서 이벤트라는 개념이 나오는데 도메인 서비스가 아니라, 이 이벤트를 통해 다른 애그리거트의 응용 서비스를 호출하도록 핸들링 하는게 올바른 방법일까요? 지금과 같은 구조를 유지해도 된다면.. facade 영역의 메소드를 트랜잭션으로 묶고, 각 도메인 계층의 서비스들에서 선언된 해당 도메인에 대한 crud 메소드를 적절히 호출해가면서 facade 영역에서 비즈니스 로직을 처리해도 될까요? 너무 글이 장황하고 기네요.. ㅠㅠ 혹시 도움을 주신다면 너무나도 감사드리겠습니다.

  • java
  • spring
  • spring-boot
  • jpa
인생은회전목마 댓글 1 좋아요 0 조회수 510

인기 태그

인프런 TOP Writers

주간 인기글