172만명의 커뮤니티!! 함께 토론해봐요.
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
jQuery에서 '클릭한다'는 동작의 실행 코드로 맨 위에서는 focus를 사용했고, 아래에서는 click을 사용하신 것은 input에 사용할때와 아닐 때의 차이인 것인가요?
미해결
따라하며 배우는 HTML, CSS
강사님의 영상 약 11분 10초 대를 보면 go live를 한 후 h1태그를 추가 한 후에 새로고침 하면 웹 창에서 추가된 h1이 보이는데 제가 하면 아래와 같은 오류가 뜨면서 추가되지 않습니다. 어떻게 하면 될까요? Live Reload is not possible without a head or body tag.
해결됨
김영한의 실전 자바 - 기본편
안녕하세요 영한님! 실전 자바 기본편 잘 보고 있습니다. 혹시 추후에 자바 중급 고급편에 가변객체 불변객체 사용이유(스레드와 연관되면서..)와 리플렉션(스프링과 연결되면서...)이 혹시 나오는지 궁금합니다
미해결
Java 마이크로서비스(MSA) 프로젝트 실습
안녕하세요~ 강의를 듣다가 제가 뭔가 잘못한건지 actuator에 refresh가 동작하지 않아 질문글을 남깁니다. 강의 2-10번 DB 비밀번호 암호화까지 문제 없이 잘 진행하다 재가동 없이 설정파일 갱신하는 부분을 진행하는데 item-service에서 build.gradle에 의존성 추가하고 bootstrap.yml에 설정 옵션 추가했는데 config-server 설정 파일 변경 후 postman 에서 refresh 요청을 날려도 response body 에는 [] 빈 배열만 찍히고 별다른 문구가 없고 변경된 설정이 적용되지 않더라고요 강의를 봐도 크게 설정하는 부분이 많은건 아니어서 잘 적용된 것 같은데 작동하지 않는 원인이 콘솔에 찍히지 않아서 헤메고 있습니다. build.gradle 의존성과 bootstrap.yml 에 설정 추가하고 config-server 실행시키고 item-service 실행시킨 후 설정 파일에 변경점을 주고 localhost:5000 번으로 /actuator/refresh 요청을 날렸습니다. 그리고 물품등록 요청을 보내서 200코드 성공했는데 별도의 logs 폴더에 api-local2.log는 생기지 않았습니다. 강의와 다르게 한건 인텔리제이로 프로젝트 구성한 것과 스프링부트 마이너 버전만 달라서 크게 문제가 있지는 않을 것 같은데.. 2-10 강의까지 해본 깃 주소도 올려봅니다. https://github.com/doyoun8813/Microservice
미해결
비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
노션 링크가 어디있나요 ? 찾기가 어렵네요..
해결됨
김영한의 실전 자바 - 기본편
안녕하세요 영한님! 질문은 처음 드리는거 같습니다~ 기본형과 참조형 '문제와 풀이' 시간에 ProductOrder를 리팩토링하는 부분에서 질문이 있습니다. 리팩토링 하는 과정에서 for문 안에서 수행하던 print와 totalAmount를 계산하는 로직을 각각 메서드로 나누었는데요, 이렇게 되면 한번만 수행되던 반복문이 메서드로 나누면서 각각 수행되어 2번이 되는데 이런 부분은 for문이 한번 더 돌게되어 오는 성능이슈보다, 깔끔하게 리팩토링 되는 부분이 더 이점이 큰 부분일까요? 사실 현업에서 업무를 할때도, for안에서 여러가지 로직이 수행되면 한번에 파악하기가 어려워서 나눠야지 싶어서 나누었지만, 한번만 돌던 반복문이 여러번 돌게 될 수 있어서 망설여지는 부분이 있었습니다. 이 부분 질문드립니다! 감사합니다~
해결됨
CSS Flex와 Grid 제대로 익히기
flex-basis에서 auto로 설정하는 것과 0으로 설정하는 것의 차이가 무엇인지 궁금합니다. 따로 코드를 짜서 실행하면 autof로 설정했을 때와 0으로 설정했을 때 결과물이 똑같아서 차이가 궁금합니다.
미해결
자바 코딩테스트 - it 대기업 유제
import java.util.HashMap; import java.util.Map; import java.util.PriorityQueue; class 방향바꾸기 { public int solution(int[][] board) { int answer = 0; /** * n * m 격자판 지도정보 * 격자판에는 각 1,2,3,4 의 값이 존재 * 1: 오른쪽의 인접한 격자로 이동 * 2. 왼쪽의 인접한 격자로 이동 * 3: 아래로 이동 * 4: 위로 이동 * 0,0부터 오른쪽 아래 맨 끝으로 이동하려고함 * board가 주어지면 목표지점까지 가기위해 방향을 바꾸는 최소 격자 개수 * 한 격자의 방향은 원하는 방향으로 한번만 바꾸기 가능 * * * */ //다익스트라로 인접 순회 할때마다 내가 그 격자를 바라보고있는지 확인 //내가 그 격자를 바라보고있으면 1추가 안함 , 바라보지 않으면 1 추가 int[] dx = {-1, 0, 1, 0}; int[] dy = {0, -1, 0, 1}; PriorityQueue<Candidate> queue = new PriorityQueue(); Map<String, Integer> minPosMap = new HashMap<>(); for (int i = 0; i < board.length; i++) { for (int j = 0; j < board[i].length; j++) { minPosMap.put(j + ":" + i, Integer.MAX_VALUE); } } Pos first = new Pos(0, 0); //첫번째 시작을 넣는다. queue.add(new Candidate(first, 0)); while (!queue.isEmpty()) { int size = queue.size(); for (int i = 0; i < size; i++) { Candidate candidate = queue.poll(); Pos pos = candidate.pos; if (pos.x == board[0].length - 1 && pos.y == board.length - 1) { // print(board, minPosMap); return candidate.cnt; } for (int j = 0; j < 4; j++) { int moveX = dx[j] + pos.x; int moveY = dy[j] + pos.y; if (moveX < 0 || moveY < 0 || moveX >= board[0].length || moveY >= board.length) continue; //현재 Pos 가 moveX, moveY 를 바라보고 있는지 체크 boolean isLookAt = isLookAt(board[pos.y][pos.x], pos, moveX, moveY); //바라보면 cnt 그대로 바라보지 않으면 cnt++ //내가 추가할 값이 기존에 있는 값보다 작아야함 Pos newPos = new Pos(moveX, moveY); int cnt; if (isLookAt) { cnt = candidate.cnt; } else { cnt = candidate.cnt + 1; } Integer baseCnt = minPosMap.get(newPos.getName()); if (cnt < baseCnt) { minPosMap.put(newPos.getName(), cnt); Candidate newCandi = new Candidate(newPos, cnt); queue.add(newCandi); } } } } return answer; } private static void print(int[][] board, Map<String, Integer> minPosMap) { int cnt = 0; for (Integer value : minPosMap.values()) { System.out.print(value + " "); cnt++; if (cnt % board[0].length == 0) System.out.println(); } } private boolean isLookAt(int direction, Pos pos, int moveX, int moveY) { int x = pos.x; int y = pos.y; // * 1: 오른쪽의 인접한 격자로 이동 // * 2. 왼쪽의 인접한 격자로 이동 // * 3: 아래로 이동 // * 4: 위로 이동 int[][] directionCalculate = {{0, 1}, {0, -1}, {1, 0}, {-1, 0}}; return y + directionCalculate[direction - 1][0] == moveY && x + directionCalculate[direction - 1][1] == moveX; } class Pos { int x; int y; public Pos(int x, int y) { this.x = x; this.y = y; } public String getName() { return x + ":" + y; } } class Candidate implements Comparable<Candidate> { Pos pos; int cnt; public Candidate(Pos pos, int cnt) { this.pos = pos; this.cnt = cnt; } @Override public int compareTo(Candidate o) { return cnt - o.cnt; } } public static void main(String[] args) { 방향바꾸기 T = new 방향바꾸기(); System.out.println(T.solution(new int[][]{{3, 1, 3}, {1, 4, 2}, {4, 2, 3}})); System.out.println(T.solution(new int[][]{{3, 2, 1, 3}, {1, 1, 4, 2}, {3, 4, 2, 1}, {1, 2, 2, 4}})); System.out.println(T.solution(new int[][]{{3, 2, 1, 3, 1, 2}, {2, 1, 1, 1, 4, 2}, {2, 2, 2, 1, 2, 2}, {1, 3, 3, 4, 4, 4}, {1, 2, 2, 3, 3, 4}})); System.out.println(T.solution(new int[][]{{3, 2, 1, 3, 1, 2, 2, 2}, {2, 1, 1, 1, 4, 2, 1, 1}, {2, 2, 2, 1, 2, 2, 3, 4}, {1, 3, 3, 4, 4, 4, 3, 1}, {1, 2, 2, 3, 3, 4, 3, 4}, {1, 2, 2, 3, 3, 1, 1, 1}})); System.out.println(T.solution(new int[][]{{1, 2, 3, 2, 1, 3, 1, 2, 2, 2}, {1, 2, 2, 1, 1, 1, 4, 2, 1, 1}, {3, 2, 2, 2, 2, 1, 2, 2, 3, 4}, {3, 3, 1, 3, 3, 4, 4, 4, 3, 1}, {1, 1, 1, 2, 2, 3, 3, 4, 3, 4}, {1, 1, 1, 2, 2, 3, 3, 1, 1, 1}})); } } AI로 답변을 달아주시는 것 같은데 이번에도 확인 부탁드립니다. 해설을 보면 강사님이랑 풀이방식은 비슷한것같습니다.
해결됨
비전공자를 위한 진짜 입문 올인원 개발 부트캠프
expo를 global로 설치하고 init까지 한 후 npm start를 했을 때 일단 아래처럼 에러가 발생합니다. Unable to find expo in this project - have you run yarn / npm install yet? -> 이건 npm install을 해서 해결 했습니다. 그런데 그 후에도 또 아래와 같은 에러가 발생합니다. PS D:\Programming\study\Inflearn\FullStack\project\grab-market-mobile> npm start > grab-market-mobile@1.0.0 start > expo start Starting project at D:\Programming\study\Inflearn\FullStack\project\grab-market-mobile Starting Metro Bundler FetchError: request to https://api.expo.dev/v2/sdks/49.0.0/native-modules failed, reason: self signed certificate in certificate chain FetchError: request to https://api.expo.dev/v2/sdks/49.0.0/native-modules failed, reason: self signed certificate in certificate chain at ClientRequest.<anonymous> (D:\Programming\study\Inflearn\FullStack\project\grab-market-mobile\node_modules\node-fetch\lib\index.js:1501:11) at ClientRequest.emit (node:events:513:28) at TLSSocket.socketErrorListener (node:_http_client:494:9) at TLSSocket.emit (node:events:513:28) at emitErrorNT (node:internal/streams/destroy:157:8) at emitErrorCloseNT (node:internal/streams/destroy:122:3) at processTicksAndRejections (node:internal/process/task_queues:83:21) 이건 어떻게 해결해야 하나요?
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
입력란과 버튼의 크기를 배분하기 위해 flex를 사용할 때, 부모 요소는 반드시 display: flex를 사용해야 하는 것인가요? flex와 display:flex가 상관관계가 있는 것인지 궁금합니다.
미해결
SCSS(SASS)+FLEX 실전 반응형 웹 프로젝트 with Figma
spoqa han sans neo글씨체 다운받았는데 피그마 할 때 text밑에 fonts에서 no matching font로 나오네요. 아예 검색자체가 안되는데 무슨 문제인가요??
해결됨
비전공자를 위한 진짜 입문 올인원 개발 부트캠프
안녕하세요. react-native-reanimated-carousel 사용 시, carousel의 prop으로 width를 정의했는데도, 제목 처럼 "width must be speified for horizontal carousels" 오류가 발생합니다. 어떻게 해결할 수 있을까요?? 강의 클론코딩 했는데, 위 오류에 앞서 "PanGestureHandler must be used as a descendant of GestureHandlerRootView" 오류가 발생했었는데, 인터넷 검색 결과로 <SafeAreaView> 바깥에 <GestureHandlerRootView> 선언하여 해결했는데, 이 영향도 일까요?? 코드 첨부합니다. import { StatusBar } from "expo-status-bar"; import { API_URL } from "./config/constant"; import avatarImg from "./assets/icons/avatar.png"; import React from "react"; import { StyleSheet, Text, View, Image, ScrollView, Dimensions, TouchableOpacity, Alert, SafeAreaView, } from "react-native"; import Carousel from "react-native-reanimated-carousel"; import { GestureHandlerRootView } from "react-native-gesture-handler"; import axios from "axios"; import dayjs from "dayjs"; import relativeTime from "dayjs/plugin/relativeTime"; import "dayjs/locale/ko"; dayjs.extend(relativeTime); dayjs.locale("ko"); export default function App() { const [products, setProducts] = React.useState([]); const [banners, setBanners] = React.useState([]); React.useEffect(() => { axios .get(`${API_URL}/products`) .then(function (result) { const products = result.data.products; setProducts(products); }) .catch(function (error) {}); axios .get(`${API_URL}/banners`) .then(function (result) { const banners = result.data.banners; setBanners(banners); }) .catch(function (error) {}); }, []); return ( <GestureHandlerRootView> <SafeAreaView style={styles.safeAreaView}> <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) => { retrun( <TouchableOpacity onPress={() => { Alert.alert("배너 클릭"); }} > <Image style={styles.bannerImage} source={{ uri: `${API_URL}/${obj.item.img_url}` }} /> </TouchableOpacity> ); }} </Carousel> <Text style={styles.headline}>판매되는 상품들</Text> <View style={styles.productList}> {products.map((product, index) => { return ( <View key={index} style={styles.productCard}> {product.status === "02" && ( <View style={styles.productBlur} /> )} <View> <Image style={styles.productImg} source={{ uri: `${API_URL}/${product.img_url}`, }} resizeMode={"contain"} /> </View> <View style={styles.productContents}> <Text style={styles.productName}>{product.name}</Text> <Text style={styles.productPrice}>{product.price}원</Text> <View style={styles.productFooter}> <View style={styles.productSeller}> <Image style={styles.productAvatar} source={avatarImg} /> <Text style={styles.productSellerName}> {product.seller} </Text> </View> <Text style={styles.productDate}> {dayjs(product.created_at).fromNow()} </Text> </View> </View> </View> ); })} </View> </ScrollView> </View> </SafeAreaView> </GestureHandlerRootView> ); } const styles = StyleSheet.create({ headline: { fontSize: 24, fontWeight: "800", marginTop: 10, marginBottom: 10, }, container: { flex: 1, backgroundColor: "#fff", paddingTop: 32, margin: 10, }, productCard: { width: "100%", borderColor: "rgb(230,230,230)", borderWidth: 1, borderRadius: 16, backgroundColor: "white", marginBottom: 10, }, productBlur: { position: "absolute", top: 0, bottom: 0, right: 0, left: 0, backgroundColor: "#ffffffaa", zIndex: 999, }, productImg: { width: "100%", height: 210, }, productContents: { padding: 8, }, productSeller: { flexDirection: "row", }, productAvatar: { width: 24, height: 24, }, productFooter: { flexDirection: "row", justifyContent: "space-between", alignItems: "center", marginTop: 12, }, productName: { fontSize: 14, }, productPrice: { fontSize: 16, fontWeight: "600", marginTop: 8, }, productSellerName: { fontSize: 14, }, productDate: { fontSize: 14, }, productList: { alignItems: "center", }, bannerImage: { width: "100%", height: 200, }, safeAreaView: { flex: 1, backgroundColor: "#fff", }, });
해결됨
처음 만난 리액트(React)
Contex가 하위 컴포넌트들에서 해당 변수에 바로 접근이 가능하게 만들어주는 것은 이해가 되었습니다. 하지만 한 가지 의문점이 있습니다. 저의 짧은 지식으로는 redux같은 전역 상태 관리 라이브러리를 이용하면 모든 컴포넌트가 접근할 수 있는 store라는 공간이 생기는 것으로 알고 있습니다. 그래서 redux를 사용한다면 contex는 굳이 사용할 필요가 없는 것으로 생각됩니다. redux같은 전역 상태 관리 라이브러리를 이용할 때에도 context를 사용하는 경우가 있는지 궁금합니다. 그리고 이전 질문에서 엄밀히 말하면 context가 상태 관리는 아니라고 하셨는데 상태 관리와 context의 차이점을 잘 모르겠습니다.. 간략하게나마 차이점을 설명들을 수 있을까요?
해결됨
처음 만난 리액트(React)
useRef() Hook의 다음 코드에서 질문이 있습니다. useRef는 DOM에 접근하기 위해 사용하는 Hook으로 이해하면 될까요? 예시 코드에서 <input type="text" ref={inputElem} /> inputElem을 해당 input태그에 접근하기 위해 useRef를 사용하는 것이 맞나요? useRef() Hook이 데이터 변경을 감지하지 못해서 HTML 코드에 있는 ref의 변경을 감지할 수 있는 useCallback() Hook을 대신 사용하는게 맞나요? 그럼 useCallback을 useRef를 대체하여 사용가능한 건가요?
해결됨
김영한의 실전 자바 - 기본편
선생님, 안녕하세요. 내부에서만 사용하는 매서드는 private으로 캡슐화 해두는 것이 좋은 구현이라고 알고 있고, 이번 수업에서도 그런 내용을 확인할 수 있었는데요, private 매서드들도 테스트 코드를 작성해서 테스트 해보고싶은 경우가 자주 발생합니다... 이런 경우 고민을 하다가 몇 가지 방법이 있겠으나 ... 그냥 public 으로 열어버리고 테스트 코드를 두곤 했는데요, 이런 경우에 선생님은 실무에서 어떻게 하셨는지, 가장 좋은 practice가 무엇인지 알고 싶습니다. 항상 감사합니다..^^
미해결
자바 ORM 표준 JPA 프로그래밍 - 기본편
Hibernate 6에서는 강의에서 처럼 Dialect를 통한 함수 등록이 불가능합니다. https://start.spring.io/ 로 Spring Boot 3버전으로 만드신 분들은 문제를 겪으실 거라고 생각합니다. 등록법 FunctionContributer 의 구현체를 만들어 준다. package custom; import org.hibernate.boot.model.FunctionContributions; import org.hibernate.boot.model.FunctionContributor; import org.hibernate.dialect.function.StandardSQLFunction; import org.hibernate.type.StandardBasicTypes; public class CustomFunctionContributor implements FunctionContributor { @Override public void contributeFunctions(FunctionContributions functionContributions) { functionContributions.getFunctionRegistry() .register("group_concat", new StandardSQLFunction("group_concat", StandardBasicTypes.STRING)); } } src/main/resources/META-INF/services/org.hibernate.boot.model.FunctionContributor 파일을 생성한다. 해당 파일에 직접 구현한 CustomFunctionContributor를 등록한다. 패키지명.컨트리뷰터이름 형태로 등록!! custom.CustomFunctionContributor 이렇게 하시면, 강의에서처럼 group_concat함수를 사용하실 수 있습니다. Dialect는 변경 안하셔도 됩니다. reference https://aregall.tech/hibernate-6-custom-functions
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
안녕하세요. 도형 만들어 지지 않아 질문 드립니다. 사진 올리기, 색깔 등등 다른 것은 다 되는데 이상하게 border와 같은 테두리, 도형을 만들면 화면에 보이지 않습니다. 아래의 코드 방식으로 작성했을 때는 적용이 됩니다. 표기 방식만 다른 것인데 무엇이 문제인가요?
미해결
모바일 웹 퍼블리싱 포트폴리오 with Figma
안녕하세요 선생님! 개인 포트폴리오 홈페이지 만들다 궁금한 점이 있어 여쭤봅니다 :) 해당 강의에서 만든 작업물을 변형하여 개인 포트폴리오 홈페이지에 넣으려고 하는데 Header랑 GNB 부분을 제이쿼리 load 메서드로 연결해서 그런지 a태그로 모바일 웹 작업물을 연결하면 Header랑 GNB 부분이 안 뜨더라구요ㅜㅜ 혹시 이런 경우에는 어떻게 하면 되는 걸까요? 항상 알차고 좋은 강의 감사합니다!
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
강의 영상에서는 .tabs에 relative, 100vh .items에 absolute top, left 이렇게 강의 해주셨는데 제가 다르게도 한번 해보았습니다. 이렇게 하니 코드가 조금이나마 짧은것 같아서요~ 동작은 똑같이 하는데 이렇게 해도 실무에 적용하는데 구조적으로 문제 없는지 궁금해서 질문 드려봅니다. 항상 좋은강의 감사합니다 선생님!
미해결
자바스크립트 제대로 배워볼래?
.js로 아래와 같은 자바스크립트 파일을 작성했습니다. export function log(message) { console.log(message); } export function error(message) { console.error(message); } 해당 자바스크립트 파일을 html에 삽입하기 위해 src에 넣고, type을 module로 지정했습니다. 후에 log함수를 이용하려고 아래 코드를 작성했는데, "Uncaught ReferenceError: log is not defined at 3-14.html:9:7" 이라고 에러가 납니다. <!DOCTYPE html> <html> <head> <title>Document</title> </head> <body> <script src="./scripts/3-13.Module.js" type="module"></script> <script> log("메세지 출력"); // Uncaught ReferenceError: log is not defined at 3-14.html:9:7 에러 출력 </script> </body> </html> 여기서 질문이 2가지가 있는데, 위의 코드 에러를 해결하려면 어떻게 해야하나요? 모듈을 삽입하는 방법으로 script 안에 type을 모듈로 정의하고 import를 통해 삽입하는 방법과, src에 자바스크립트를 사용하여 삽입하는 2가지 방법이 존재한다고 이해했습니다. 그럼 후자의 방법은 단순히 src만 입력해 해당 자바스크립트 안에 있는 모든 함수, 변수를 사용하는 방법을 말하는 걸로 이해하면 될까요? 답변주시면 감사하겠습니다.! 항상 강의 잘 듣고 있습니다. 좋은 강의 내주셔서 정말 감사합니다 . ㅎㅎ 😃
