inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

영속성 컨텍스트에 대해 질문이 있습니다.

미해결

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

https://www.inflearn.com/questions/789381/%EC%97%94%ED%8B%B0%ED%8B%B0-%EB%A7%A4%EB%8B%88%EC%A0%80-%EB%8F%99%EC%8B%9C%EC%84%B1 위에 질문과 답변을 봤을때는 엔티티매니저가 달라도 트랜잭션이 같으면 같은 영속성컨텍스트를 사용한다고 되어있습니다. 하지만 이 부분이 실제로 어떻게 이뤄질 수 있는것인지 이해되지 않습니다. 코드로 어떻게 되어져 있는지 찾아볼 수 있을까요? 제가 찾아본 내용으로는 SessionImpl이라는 엔티티매니저 구현체에 아래 처럼 엔티티매니저를 넣어서 영속성컨텍스트를 생성하는 코드를 볼 수 있었습니다. 그럼 영속성 컨텍스트는 따로 만들어지는게 아닌가? 라는 생각도 하게되었습니다. protected StatefulPersistenceContext createPersistenceContext() { return new StatefulPersistenceContext( this ); } 트랜잭션에 따라 영속성 컨텍스트가 공유되고 스레드마다 영속성 컨텍스트가 어떻게 나눠질 수 있는지 궁금합니다. 그리고 영속성컨텍스트는 프록시라도 Bean으로 등록되는데 실제 동작을 하는건 원본객체일테고 그럼 그 객체이 있는 영속성컨텍스트를 공유하게 되는것은 아닌가? 의문이 들었습니다. 질문을 정리하겠습니다. 트랜잭션에 따라 영속성 컨텍스트가 어떻게 공유될 수 있나요?(확인할 수 있는코드나 기술이 있다면 말씀해주시면 감사하겠습니다.) Bean으로 등록된 엔티티매니저가 다른 상태를 유지할 수 있는 방법이 무엇인가요? 프록시라해도 원본객체를 통해 동작하는게 아닌가요? 영속성컨텍스트는 프록시라도 Bean으로 등록되는데 실제 동작을 하는건 원본객체일테고 그럼 그 객체이 있는 영속성컨텍스트를 공유하게 되는것은 아닌가요? 바보같은 질문일 수 있지만 답변해주시면 너무 감사하겠습니다.

  • java
  • jpa
YOGURT 댓글 2 좋아요 0 조회수 878

vscode emmet 핵심 단축키 파일 관련

미해결

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

안녕하세요! vscode에서 emmet 사용법 강좌 끝에 보면 첨부파일에 핵심 단축키 정리된 파일을 다운로드 받으라고 되어 있는데, 아무리 찾아도 다운로드할 파일을 찾지 못하여... 제가 못찾는건지, 다운이 안되는 상황인건지 문의드립니다!

  • HTML/CSS
  • jquery
  • 웹-디자인
개수디 댓글 2 좋아요 1 조회수 469

code EEXIST 에러가 계속 뜨는데 어떡하죠..

해결됨

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

안녕하세요 create-react-app을 설치하고 create-react-app . 를 입력한 후에 계속 이 에러가 떠서 진행을 못하고 있습니다.ㅠ EEXIST라는 에러코드인데요.. 일단 저는 sudo npm install -g create-react-app 코드를 이용해서 설치를 했고 create-react-app -V 라는 코드를 이용해서 create-react-app의 버전이 나옴을 확인해, 설치는 제대로 되었음을 확인했습니다. 그런데 create-react-app . 이 부분을 입력할 때마다 저 에러가 뜹니다.. 어떻게 해결하면 좋을까요? 처음부터도 다시 깔아보고, uninstall install도 해보고 npx로도 해봤지만 잘 안됐습니다..

  • HTML/CSS
  • javascript
  • react
  • node.js
  • react-native
  • 머신러닝
  • express
  • tensorflow
eu13gene 댓글 2 좋아요 2 조회수 2199

엔티티매니저의 대해 질문이 있습니다!

미해결

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

EntityManager는 빈 스코프가 프록시로 설정된다고 알고있습니다. 하지만 결국은 원본 엔티티매니저를 사용하는것이라고 이해했습니다. 그러면 요청이 들어오면 엔티티매니저를 사용하는데 엔티티매니저 내에 영속성 컨텍스트가 있고 싱글톤으로 유지된다면 영속성컨텍스트가 다른 요청이랑 공유되는게 아닌가요? 싱글톤으로 등록되어 있는데 영속성컨텍스트가 공유되지 않는 이유가 궁금합니다. 엔티티매니저가 빈인데 어떻게 요청마다 생성되는것인지 궁금합니다.

  • java
  • jpa
YOGURT 댓글 1 좋아요 1 조회수 429

상세 페이지 구성하다 안된 수강생 입니다.캡쳐 사진 올리니 꼭좀 해결해 주세요

해결됨

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

아무리 구글링 유튜브 찾아 봐도 알수가 없네요 mock-sever 주소 크롬 주소창에 넣으면 분명히 자료가 잘 나오는데 vs코드에서 실행 하면 위에 처럼 에러가 나옵니다. 선생님 해결좀 부탁드립니다.수업을 나갈수가 없네요.

  • HTML/CSS
  • javascript
  • react
  • node.js
  • react-native
  • 머신러닝
  • express
  • tensorflow
TV캠핑카 다있다 댓글 1 좋아요 1 조회수 264

넷플릭스 공식사이트 수업 header

미해결

HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌2)

넷플릭스 공식사이트 만들기에서 header에 padding 35px 55px을 주니까 가로스크롤이 생깁니다. 어떻게하면 없앨 수 있을까요?

  • HTML/CSS
  • javascript
  • jquery
hw4688 댓글 1 좋아요 1 조회수 252

구매버튼 클릭 시 soldout 구현 부분(상품 블러 처리)

해결됨

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

상품 상세 페이지에서 구매 버튼을 누르게 되면, 해당 상품의 soldout값이 1로 바뀌게고 적용 완료. 그 이후 자동으로 구매 버튼이 회색으로 다시 바뀌겠끔도 구현 완료 그 이후 뒷 페이지로 돌아갔을 때, 상품 목록에서 blur처리 되는 기능이 구현되지 않아 이 방법이 궁금합니다. 뒤로가기 버튼을 눌렀을 때는 해당 페이지가 새로 불러와지는 로직이 아닌가요? // Main페이지 코드 import { StatusBar } from "expo-status-bar"; import { StyleSheet, Text, View, Image, ScrollView, Dimensions, TouchableOpacity, Alert } from "react-native"; import React, {useEffect, useState} from "react"; import axios from "axios"; import dayjs from "dayjs" import relativeTime from "dayjs/plugin/relativeTime" import "dayjs/locale/ko" import Carousel from "react-native-reanimated-carousel" import { API_URL } from "../config/constants"; import AvatarImage from "../assets/icons/avatar.png"; dayjs.extend(relativeTime); dayjs.locale("ko"); export default function MainScreen(props) { const [products, setProducts] = useState([]); const [banners, setBanners] = useState([]); const getProduct = () => { axios .get(`${API_URL}/products`) .then((result) => { console.log(result); setProducts(result.data.products) }) .catch((error) => { console.error(error); }); } useEffect(() => { getProduct(); axios .get(`${API_URL}/banners`) .then((result) => { setBanners(result.data.banners); }) .catch((error) => { console.error(error); }) }, []); return ( <View style={styles.container}> <ScrollView> <Carousel data={banners} width={Dimensions.get("window").width} height={200} autoPlay={true} sliderWidth={Dimensions.get("window").width} itemWidth={Dimensions.get("window").width} itemHeight={200} renderItem={(obj) => { return ( <TouchableOpacity onPress={() => { Alert.alert("배너 클릭"); }} > <Image style={styles.bannerImage} source={{ uri: `${API_URL}/${obj.item.imageUrl}`}} resizeMode="contain" /> </TouchableOpacity> ); }} /> <Text style={styles.Headline}>판매되는 상품들</Text> <View sytle={styles.productList}> {products.map((product, index) => { return ( <TouchableOpacity onPress={() => { props.navigation.navigate("Product", { id: product.id }) }}> <View style={styles.productCard}> {product.soldout === 1 && ( <View style={styles.productBlur} /> )} <View> <Image style={styles.productImage} source={{ uri: `${API_URL}/${product.imageUrl}`, }} resizeMode={"contain"} /> </View> <View style={styles.productContents}> <Text sytle={styles.productName}> {product.name} </Text> <Text sytle={styles.productPrice}> {product.price}원 </Text> <View style={styles.productFooter}> <View style={styles.productSeller}> <Image style={styles.productAvatar} source={AvatarImage} /> <Text style={styles.productSellerName} > {product.seller} </Text> </View> <Text style={styles.productDate}> {dayjs(product.createdAt).fromNow()} </Text> </View> </View> </View> </TouchableOpacity> ); })} </View> </ScrollView> </View> ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff", padding: 32, }, productCard: { width: 320, borderColor: "rgb(230,230,230)", borderWidth: 1, borderRadius: 16, backgroundColor: "white", marginBottom: 8, }, productImage: { width: "100%", height: 210, }, productContents: { padding: 8, }, productSeller: { flexDirection: "row", alignItems: "center", }, productAvatar: { width: 24, height: 24, }, productFooter: { flexDirection: "row", justifyContent: "space-between", alignItems: "center", marginTop: 12, }, productName: { fontSize: 16, }, productPrice: { fontSize: 18, fontWeight: "600", marginTop: 8, }, productSellerName: { fontSize: 16, }, productDate: { fontSize: 16, }, productList: { alignItems: "center", }, Headline: { fontSize: 24, fontWeight: "800", marginBottom: 24, }, productBlur: { position: "absolute", top: 0, bottom: 0, left: 0, right: 0, backgroundColor : "#ffffffa6", zIndex: 999 }, bannerImage: { width: "90%", height: 200, }, safeAreaView: { flex: 1, backgroundColor: "#fff" } }); // Product 화면 코드 import axios from "axios"; import React, { useEffect, useState } from "react" import {Image, ActivityIndicator, StyleSheet, View, Text, TouchableOpacity, Alert, ScrollView} from "react-native" import { API_URL } from "../config/constants"; import Avatar from "../assets/icons/avatar.png" import dayjs from "dayjs" export default function ProductScreen(props){ const {id} = props.route.params; const [product, setProduct] = useState(null); const getProduct = () => { axios.get(`${API_URL}/products/${id}`) .then((result) => { console.log("product result : ", result.data); setProduct(result.data.product); }) .catch((error) => { console.error(error); }) } useEffect(() => { getProduct(); }, []); const onPressButton = () => { if(product.soldout !== 1) { axios.post(`${API_URL}/purchase/${id}`) .then((result) => { Alert.alert("구매가 완료되었습니다."); getProduct(); }) .catch((error) => { Alert.alert(`에러가 발생했습니다. ${error.message}`); }) } } if(!product){ return <ActivityIndicator /> } return ( <View style={styles.container}> <ScrollView> <View> <Image style={styles.productImage} source={{uri: `${API_URL}/${product.imageUrl}`}} resizeMode="contain" /> </View> <View style={styles.productSection}> <View style={styles.productSeller}> <Image style={styles.avatarImage} source={Avatar} /> <Text>{product.seller}</Text> </View> <View style={styles.divider} /> <View> <Text style={styles.productName}>{product.name}</Text> <Text style={styles.productPrice}>{product.price} 원</Text> <Text style={styles.productDate}>{dayjs(product.createAt).format("YYYY년 MM월 DD일")}</Text> <Text style={styles.productDescription}>{product.description}</Text> </View> </View> </ScrollView> <TouchableOpacity onPress={onPressButton}> <View style={product.soldout ===1 ? styles.purchaseDisabled : styles.purchaseButton}> <Text style={styles.purchaseText}>{product.soldout === 1 ? "구매완료" : "구매하기"}</Text> </View> </TouchableOpacity> </View> ) } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff" }, productImage: { width: "100%", height: 300 }, productSeller: { flexDirection: "row", alignItems: "center" }, avatarImage: { width: 50, height: 50, }, productSection: { padding: 16 }, divider: { backgroundColor: "#e9ecef", height: 1, marginVertical: 16 }, productName: { fontSize: 20, fontWeight: "400" }, productPrice: { fontSize: 18, fontWeight: "700", marginTop: 8 }, productDate: { fontSize:14, marginTop: 4, color: "rgb(204,204,204)" }, productDescription: { marginTop : 16, fontSize: 17 }, purchaseButton: { position: "absolute", bottom: 0, left: 0, right: 0, height: 60, backgroundColor: "rgb(255,80,88)", alignItems : "center", justifyContent: "center" }, purchaseText : { color: "white", fontSize: 20, }, purchaseDisabled: { position: "absolute", bottom: 0, left: 0, right: 0, height: 60, backgroundColor: "gray", alignItems : "center", justifyContent: "center" } })

  • HTML/CSS
  • javascript
  • react
  • node.js
  • react-native
  • 머신러닝
  • express
  • tensorflow
댓글 1 좋아요 0 조회수 325

수업 진행중 이 그랩마켓 상세 페이지 만들던중 농구공 이미지

미해결

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

안녕하세요. 그랩마켓 상세페이지 만들기 중에서 농구공 이미지 하고postman에서 만든 products/1 내용이 안나오기에 MOCK SEVER를 다시 생성해서 .GET에 복사 붙여 넣기를 했습니다.그랬더니 에러가 나면서 아무것도 안보이게 됐습니다. 그래서 lean-all-with -java 페이지로 가서 INDEX.HTML로 에 있는 axios.get ( "https://831a8e94-7b7a-4354-9e1a-eb37becbc7ad.mock.pstmn.io/products" 에 가서 보니 예전에 만들은 것들은 그대로 더군요. 그래서 이것도 지우고 새로 만든 mock주소를 넣었더니 이것도 에러가 납니디.원래 mock서버 새로 만들어서 붙여 놓으면 안되나요? 몇일동안 매달려도 안되네요.도와주세요.선생님

  • HTML/CSS
  • javascript
  • react
  • node.js
  • react-native
  • 머신러닝
  • express
  • tensorflow
TV캠핑카 다있다 댓글 1 좋아요 0 조회수 256

모달창이 안되는데 뭐가문제인걸까요 ,,,??

미해결

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

<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div class="container"> <header> <div class="header-logo"></div> <div class="navi"></div> </header> <div class="slide"> <div></div> </div> <div class="items"> <div class="news"> <div class="tab-inner"> <div class="btn"> <a href="#none"class="active">공지사항</a> <a href="#none">갤러리</a> </div> <div class="tabs"> <div class="tab1"> <a class="open-madal" href="#none">핸드폰수리일정안내입니다.<b>2022.07.24</b></a> <a href="#none">핸드폰 택배일정 안내입니다.<b>2022.07.24</b></a> <a href="#none">핸드폰 현금영수증안내입니다.<b>2022.07.24</b></a> <a href="#none">핸드폰 주문시안내입니다.<b>2022.07.24</b></a> <a href="#none">핸드폰 환불및교환 안내입니다.<b>2022.07.24</b></a> </div> <div class="tab2"> <a href="#none"><img src="images/gallery-01.jpg" alt="gallery1"></a> <a href="#none"><img src="images/gallery-02.jpg" alt="gallery2"></a> <a href="#none"><img src="images/gallery-03.jpg" alt="gallery3"></a> </div> </div> </div> </div> <div class="gallery"></div> <div class="shortcut"></div> </div> <footer> <div class="footer-logo"></div> <div class="copyright"></div> <div class="sns"></div> </footer> </div> <!--modal--> <div class="modal"> <div class="modal-content"> <h2>sns비회원주문하기 종료 안내</h2> <p>안녕하세요 just쇼핑몰 md 홍길동입니다.안타깝게도 비회원주문하기서비스가 한달뒤 종료될 예정입니다 회원가입없이 sns계정을 이용해 그동안 제품주문을 하실수있엇는데 금번 강화된 개인정보보호법 시행령 제 9조 의거, sns를 이용한상품주문/ 결제등이 근래에 많은 부안잇슈로 문제가 되고 있음에 따라 kisa의 권교조치의 일환으로 했습니다 따라서 한달뒤인 2022.05.07일 이후 모든 비회원 고객님들께서는 회원가입으로 전환후 실명인증 하여야하며 모든쇼핑몰 오픈마켓등의 전자상거래서비스의 공통된 사항이라는점 안내해드립니다. </p> <a class=close-modal href="#none">x 닫기</a> </div> </div> <script src="script/jquery-1.12.4.js"></script> <script src="script/custom.js"></script> </body> </html> @charset "UTF-8"; .container{ border: 1px solid #000; width: 1200px; margin: auto; } header{ display: flex; justify-content: space-between; } header >div{ border: 1px solid #000; height: 100px; } .header-logo{ width: 200px; } .navi{ width: 600px; } .slide{} .slide >div{ border: 1px solid #000; height: 300px; } .items{ display: flex; } .items >div{ border: 1px solid #333; height: 200px; } .news{ width: 500px; } .gallery{ width: 350px; } .shortcut{ width: 350px; } footer{ display: flex; } footer >div{ border: 1px solid #333; height: 100px; } .footer-logo{ width: 200px; } .copyright{ width: 800px; } .sns{ width: 200px; } /*tab-inner*/ .tab-inner{ width: 95%; margin: auto; } .btn{} .btn a{ display: inline-block; border: 1px solid #000; width: 120px; text-align: center; border-radius: 5px 5px 0 0; padding: 5px; margin-right: -6px; border-bottom: none; margin-bottom: -1px; background-color: #ddd; cursor: pointer; } .btn a.active{ background-color: #fff; } .tabs{} .tabs div{ border: 1px solid #000; height: 155px; padding: 0 10px; } .tab1{ } .tab1 a{ display: block; color: #000; text-decoration: none; border-bottom: 1px solid #333; padding: 4px; } .tab1 a:last-child{ border-bottom: none; } .tab1 a b{ float: right; font-weight: normal; } .tab2{ display: none; text-align: center; } .tab2 img{ width: 120px; margin-top: 20px; } /*modal*/ .modal{ background-color:rgba(0, 0, 0, 0.9)); position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: none; } .modal-content{ background-color: #fff; width: 350px; padding: 20px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); border-radius: 10px; } .modal-content h2{ background-color: #000; color: #fff; padding: 5px; text-align: center; } .modal-content p{ line-height: 1.5em; } .close-modal{ border: 1px solid#000; padding: 3px 7px; float: right; } /*modal*/ $('.open-modal').click(function(){ $('.modal').show() $('.close-modal').click(function(){ $('.modal').hide() }) }) 모달창이 안떠서요 ,,,뭐때매안뜨는지 아무리 봐도 모르겠서요..,.,.ㅜㅜㅠ

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

제 콘솔화면이 이상해요.

해결됨

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

콘솔에서 잘못 입력해서 지울 때 어떤 키를 눌러야 지워지고 다시 작성할 수 있나요? 영상에 나오는 콘솔 화면에는 바로 변수와 상수를 칠 수 있지만 제 콘솔 화면에는 영어로 Error 같은 메시지가 뜨네요. 이건 어떻게 해야 수정 할 수 있을까요?

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

EventListener 질문입니다.

미해결

자바스크립트 : 기초부터 실전까지 올인원

버튼 클릭하면 콘솔 창에 3이 나오도록 해보았는데요, 아래와 같이 입력해봤는데, 콘솔 창에 3이 안 나옵니다.. 오류가 EventLstener 라고 뜨는데요;;. 제가 뭘 잘못 입력했는지 잘 모르겠어요;;. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script> const a = 3; const Btn1 = document.getElementById("click-button"); Btn1.addEventListener("click", activation); function activation(){ console.log(a); } </script> </head> <body> <button id="click-button">누름</button> </body> </html>

  • HTML/CSS
  • javascript
한일테크 김민국 대리 댓글 1 좋아요 0 조회수 279

아랫글 질문자입니다.

미해결

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

구체적인 에러코드 알려달라 하셔서 대답글에 알려드렸는데 못보신거 같아서 다시 올려봅니다. fatal: unable to access ' https://github.com/깃유저명/깃프로젝트명.git/ ': Failed to connect to {EC2 PUBLIC IP} port 3000: Connection timed out 이라는 에러메시지 발생했으며, 위 사진에서는 git clone으로 인한 에러이지만 pull로 당겨도 동일 에러가 발생합니다. 답변 기다리는동안 틈틈히 찾아봤는데 결국 해결이 안돼서 다시 여쭤보는점 죄송합니다 ㅠㅠ

  • HTML/CSS
  • javascript
  • aws
  • git
  • mysql
  • rest-api
  • github
전예준 댓글 2 좋아요 0 조회수 261

Object 클래스의 clone() 메서드 질문

미해결

자바(Java) 알고리즘 문제풀이 입문: 코딩테스트 대비

Object 클래스의 clone() 메서드는 깊은 복사가 아니라 얕은 복사로 알고 있습니다. 강의에서의 선생님의 말씀대로 clone() 메서드는 깊은 복사가 맞나요?

  • java
  • 코딩-테스트
재영 댓글 2 좋아요 0 조회수 364

추가영상에서 span을 a태그로변경하라하셔서 했는데 이렇케 뜨는게 맞을까요?

미해결

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

<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div class="container"> <header> <div class="header-logo"></div> <div class="navi"></div> </header> <div class="slide"> <div></div> </div> <div class="items"> <div class="news"> <div class="tab-inner"> <div class="btn"> <a href="#none"class="active">공지사항</a> <a href="#none">갤러리</a> </div> <div class="tabs"> <div class="tab1"> <a href="#none">핸드폰수리일정안내입니다.<b>2022.07.24</b></a> <a href="#none">핸드폰 택배일정 안내입니다.<b>2022.07.24</b></a> <a href="#none">핸드폰 현금영수증안내입니다.<b>2022.07.24</b></a> <a href="#none">핸드폰 주문시안내입니다.<b>2022.07.24</b></a> <a href="#none">핸드폰 환불및교환 안내입니다.<b>2022.07.24</b></a> </div> <div class="tab2"> <a href="#none"><img src="images/gallery-01.jpg" alt="gallery1"></a> <a href="#none"><img src="images/gallery-02.jpg" alt="gallery2"></a> <a href="#none"><img src="images/gallery-03.jpg" alt="gallery3"></a> </div> </div> </div> </div> <div class="gallery"></div> <div class="shortcut"></div> </div> <footer> <div class="footer-logo"></div> <div class="copyright"></div> <div class="sns"></div> </footer> </div> <script src="script/jquery-1.12.4.js"></script> <script src="script/custom.js"></script> </body> </html> @charset "UTF-8"; .container{ border: 1px solid #000; width: 1200px; margin: auto; } header{ display: flex; justify-content: space-between; } header >div{ border: 1px solid #000; height: 100px; } .header-logo{ width: 200px; } .navi{ width: 600px; } .slide{} .slide >div{ border: 1px solid #000; height: 300px; } .items{ display: flex; } .items >div{ border: 1px solid #333; height: 200px; } .news{ width: 500px; } .gallery{ width: 350px; } .shortcut{ width: 350px; } footer{ display: flex; } footer >div{ border: 1px solid #333; height: 100px; } .footer-logo{ width: 200px; } .copyright{ width: 800px; } .sns{ width: 200px; } /*tab-inner*/ .tab-inner{ width: 95%; margin: auto; } .btn{} .btn a{ display: inline-block; border: 1px solid #000; width: 120px; text-align: center; border-radius: 5px 5px 0 0; padding: 5px; margin-right: -6px; border-bottom: none; margin-bottom: -1px; background-color: #ddd; cursor: pointer; } .btn a.active{ background-color: #fff; } .tabs{} .tabs div{ border: 1px solid #000; height: 155px; padding: 0 10px; } .tab1{ } .tab1 a{ display: block; color: #000; text-decoration: none; border-bottom: 1px solid #333; padding: 4px; } .tab1 a:last-child{ border-bottom: none; } .tab1 a b{ float: right; font-weight: normal; } .tab2{ display: none; text-align: center; } .tab2 img{ width: 120px; margin-top: 20px; } /*tab content*/ $('.btn a:first-child').click(function(){ $('.tab1').show() $('.tab2').hide() $(this).addClass('active') $(this).siblings().removeClass('active') }) $('.btn a:last-child').click(function(){ $('.tab2').show() $('.tab1').hide() $(this).addClass('active') $(this).siblings().removeClass('active') }) 추가영상에서 span을 a태그로변경하라하셔서 했는데 브라우저에 공지사항 갤러리 밑에 밑줄이 표시되는데 이렇케 뜨는게 맞을까요?

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

windows에서 발생하는 경로 \ 관련 문의드립니다.

미해결

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

"상품 업로드 기능 구현-2" 강의 중 잘 따라가다가 후반부에서 경로 문제로 인해 문의드립니다. 업로드 페이지에서 업로드는 잘 되나, 업로드 후 메인 페이지에서 등록된 이미지가 나오지 않아 확인해보니 "/" 대신에 콘솔에는 캡처1과 같이 "\\" 가 나오고 DB Browser에서는 캡처2와 같이 "\"가 나옵니다. : 캡처1 입니다. : 캡처2 입니다. 원인을 찾아보니 windows에서 파일 경로를 다룰 때 "\\"로 하기 때문에 생기는 문제라고 하는데요... 어떻게 해결하면 좋을지 모르겠습니다. 해결방법을 알려주시면 감사하겠습니다.

  • HTML/CSS
  • javascript
  • react
  • node.js
  • react-native
  • 머신러닝
  • express
  • tensorflow
kms930322 댓글 2 좋아요 0 조회수 355

MySql Lock을 사용하지 않는 이유

미해결

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

강의에서 설명해주시기로는 쿠폰 개수를 가져오는 것부터 쿠폰 생성까지 lock을 걸어야 한다고 설명 주셨는데 이전 강의인 재고 관리 이슈와는 다르게 row가 아닌 table에 lock을 걸기 때문에 성능 이슈가 발생한다고 보면 될까요?

  • java
  • docker
  • spring-boot
  • kafka
  • redis
데자와아 댓글 2 좋아요 0 조회수 1236

섹션2 Material 학습 중에 마우스 드래그로 돌려보는 기능?

해결됨

떠먹는 Three.js

섹션2 Material 학습 중에 있는데요, 강사님 영상에서는 마우스 드래그를 통해 오브젝트가 회전하는데, 저는 안됩니다.^^; 뭔가 세팅을 하는 게 있을 것 같은데, 아마 다 공부하고 나면 알 수 있는거겠죠?

  • HTML/CSS
  • javascript
  • three.js
rookiepepe 댓글 2 좋아요 2 조회수 518

import { Switch, Route } from "react-router-dom"; 모듈을 찾을수 없다고 뜹니다.

해결됨

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

선생님 수업 따라서 열심히 따라 왔는데 여기서 막히네요.해결 좀 부탁드립니다.제가 나이가 53인데 사다리차 운전 하면서 자영업 하는데 다른길좀 가보려고 공부하는 중이거든요. 다른 분들한테는 쉬운걸 텐데 저한테는 어렵네요.구글링 해보고 네이버 도 찾아봣는데 찾을수가 없네요.이걸 해결해야 앞으로 나갈수 있을것 같은데 도와주세요.감사합니다

  • HTML/CSS
  • javascript
  • react
  • node.js
  • react-native
  • 머신러닝
  • express
  • tensorflow
TV캠핑카 다있다 댓글 1 좋아요 0 조회수 431

styled-components

미해결

처음 만난 리액트(React)

chapter 15 실습에서 막힙니다. styled-components를 @latest 붙여서 다운받았는데도 실행이 안됩니다. 그냥 빈 하얀 화면만 뜹니다... 다른 챕터는 확인해보니까 다 되던데, 왜 styled-components 실습만 왜 안될까요? Blocks.jsx 파일 코드 import styled from "styled-components"; const Wrapper = styled.div` padding: 1rem; display: flex; flex-direction: row; align-items: flex-start; justify-content: flex-start; background-color: lightgrey; `; const Block = styled.div` padding: ${(props) => props.padding}; border: 1px solid black; border-radius: 1rem; background-color: ${(props) => props.backgroundColor}; color: white; font-size: 2rem; text-align: center; `; const blockItems = [ { label: "1", padding: "1rem", backgroundColor: "red", }, { label: "2", padding: "3rem", backgroundColor: "green", }, { label: "3", padding: "2rem", backgroundColor: "blue", }, ]; function Blocks(props) { return ( <Wrapper> {blockItems.map((blockItem) => { return ( <Block padding={blockItem.padding} backgroundColor={blockItem.backgroundColor} > {blockItem.label} </Block> ); })} </Wrapper> ); } export default Blocks; index.js 파일 코드 import React from "react"; import ReactDOM from "react-dom/client"; import "./index.css"; import App from "./App"; import reportWebVitals from "./reportWebVitals"; // import Library from "./chapter_03/Library"; // import Clock from "./chapter_04/Clock"; // import CommentList from "./chapter_05/CommentList"; // import NotificationList from "./chapter_06/NotificationList"; // import Accomodate from "./chapter_07/Accommodate"; // import ConfirmButton from "./chapter_08/ConfirmButton"; // import LandingPage from "./chapter_09/LandingPage"; // import AttendanceBook from "./chapter_10/AttendanceBook"; // import SignUp from "./chapter_11/SignUp"; // import Calculator from "./chapter_12/Calculator"; // import ProfileCard from "./chapter_13/ProfileCard"; // import DarkOrLight from "./chapter_14/DarkOrLight"; import Blocks from "./chapter_15/Blocks"; const root = ReactDOM.createRoot(document.getElementById("root")); root.render( <React.StrictMode> <Blocks /> </React.StrictMode> ); // If you want to start measuring performance in your app, pass a function // to log results (for example: reportWebVitals(console.log)) // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals reportWebVitals(); 빈 하얀 화면에서 F12 눌러서 오류 확인해보니까 이렇게 뜹니다. Warning: Each child in a list should have a unique "key" prop. Check the render method of Blocks . See https://reactjs.org/link/warning-keys for more information. at O ( http://localhost:3000/static/js/bundle.js:43804:6 ) at Blocks printWarning @ react-jsx-dev-runtime.development.js:87 2react.development.js:209 Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons: 1. You might have mismatching versions of React and the renderer (such as React DOM) 2. You might be breaking the Rules of Hooks 3. You might have more than one copy of React in the same app See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem. printWarning @ react.development.js:209 react.development.js:1618 Uncaught TypeError: Cannot read properties of null (reading 'useContext') at Object.useContext (react.development.js:1618:1) at StyledComponent.ts:124:1 at O (StyledComponent.ts:190:1) at renderWithHooks (react-dom.development.js:16305:1) at updateForwardRef (react-dom.development.js:19226:1) at beginWork (react-dom.development.js:21636:1) at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1) at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1) at invokeGuardedCallback (react-dom.development.js:4277:1) at beginWork$1 (react-dom.development.js:27451:1) 2react.development.js:209 Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons: 1. You might have mismatching versions of React and the renderer (such as React DOM) 2. You might be breaking the Rules of Hooks 3. You might have more than one copy of React in the same app See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem. printWarning @ react.development.js:209 react.development.js:1618 Uncaught TypeError: Cannot read properties of null (reading 'useContext') at Object.useContext (react.development.js:1618:1) at StyledComponent.ts:124:1 at O (StyledComponent.ts:190:1) at renderWithHooks (react-dom.development.js:16305:1) at updateForwardRef (react-dom.development.js:19226:1) at beginWork (react-dom.development.js:21636:1) at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1) at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1) at invokeGuardedCallback (react-dom.development.js:4277:1) at beginWork$1 (react-dom.development.js:27451:1) react-dom.development.js:18687 The above error occurred in the <styled.div> component: at O ( http://localhost:3000/static/js/bundle.js:43804:6 ) at Blocks Consider adding an error boundary to your tree to customize error handling behavior. Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries. logCapturedError @ react-dom.development.js:18687 react-dom.development.js:26923 Uncaught TypeError: Cannot read properties of null (reading 'useContext') at Object.useContext (react.development.js:1618:1) at StyledComponent.ts:124:1 at O (StyledComponent.ts:190:1) at renderWithHooks (react-dom.development.js:16305:1) at updateForwardRef (react-dom.development.js:19226:1) at beginWork (react-dom.development.js:21636:1) at beginWork$1 (react-dom.development.js:27426:1) at performUnitOfWork (react-dom.development.js:26557:1) at workLoopSync (react-dom.development.js:26466:1) at renderRootSync (react-dom.development.js:26434:1) 뭐가 문제일까요?

  • HTML/CSS
  • javascript
  • react
현진 댓글 1 좋아요 0 조회수 1734

인기 태그

인프런 TOP Writers

주간 인기글