172만명의 커뮤니티!! 함께 토론해봐요.
해결됨
[React 1부] 만들고 비교하며 학습하는 React
안녕하세요. 강사님께서 TabLabel을 아래와 같이 작성하셨는데, Key에 []가 들어가 있는 경우는 처음 보아서요. const TabLabel = { [TabType.KEYWORD]: "추천 검색어", [TabType.HISTORY]: "최근 검색어", }; Key를 배열로 선언하신 것인가요? 이와 관련된 문법은 어디서 찾아볼 수 있을까요?
해결됨
[React 1부] 만들고 비교하며 학습하는 React
안녕하세요. storage를 동적으로 변경하는 경우 현재 기준으로 어떤 부분의 코드를 변경하는 것이 좋을지 문의드립니다. 현재 코드에서는 아래와 같이 정적인 데이터(storage.js)를 main.js에서 주입해주는데요. // main.js import Store from "./store.js"; import storage from "./storage.js"; function main() { const store = new Store(storage); new Controller(store, views); } 만약 storage 데이터를 ajax를 통해 동적으로 받아온다면, main.js와 Controller.js는 그대로 두고 Storage.js와 storage.js 파일만 변경하면 되나요? 즉, 아래 코드 주석처럼 하면 될까요? 또한, AJAX 요청은 Controller와 Storage 중 어느 부분에 작성하는 것이 일반적인가요? // Controller.js // 변경 없음 export default class Controller { constructor(store, { searchFormView, searchResultView }) { this.store = store; this.searchFormView = searchFormView; this.searchResultView = searchResultView; this.subscribeViewEvents(); } subscribeViewEvents() { this.searchFormView .on("@submit", (event) => this.search(event.detail.value)) // } search(searchKeyword) { this.store.search(searchKeyword); } } // storage.js // 데이터를 빈 배열로 변경 const storage = { keywordData: [], historyData: [], productData: [], }; export default storage; // Store.js export default class Store { constructor(storage) { if (!storage) throw "no storage"; this.storage = storage; this.searchKeyword = ""; this.searchResult = []; } search(keyword) { this.searchKeyword = keyword; this.searchResult = // 여기서 AJAX 요청을 통해 storage.js의 상태 관리? 아니면 Controller에서 AJAX 요청? } }
미해결
실전! Querydsl
[질문 내용] 아래처럼 List<MemberTeamDto> 를 쿼리해올때, 최적화를 위해 count query 를 따로 작성하셨는데, 왜 result.size() 로 바로 total count 값을 가져오면 안되는건지 궁금합니다! 이유가 무엇인가요? List<MemberTeamDto> result = queryFactory .select(new QMemberTeamDto( member.id.as("memberId"), member.username, member.age, team.id.as("teamId"), team.name.as("teamName"))) .from(member) .leftJoin(member.team, team) .where( usernameEq(condition.getUsername()), teamNameEq(condition.getTeamName()), ageGoe(condition.getAgeGoe()), ageLoe(condition.getAgeLoe()) ) .offset(pageable.getOffset()) .limit(pageable.getPageSize()) .fetch();
미해결
실전! Querydsl
1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] @Modifying 을 어노테이션으로 단다면, em.flush(),clear() 코드없이 동일한 동작을 수행하게 되나요? 스프링 데이터 JPA에서는 Repository위에 달았는데요. 뒷 강의에서 Spring data JPA와 QueryDSL을 병행해서 사용하기 위해 custom Repository를 만든다고 배웠습니다. 이 custom Repository의 함수에 @Modifying을 달아도 동일하게 동작하는지 궁금합니다. 정리하자면 QueryDSL에서도 @Modifying이 적용되는지 궁금합니다.
해결됨
스프링 시큐리티 OAuth2
안녕하세요 ! git branch 마다 README 파일이 있는건 아니라서 강의에 해당하는 git branch 를 찾기가 매우 힘듭니다. 혹시 강의와 브렌치의 매핑이 정리된 자료가 있나요 ?
미해결
실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] item 을 추상 클래스로 만든 이유가 뭘까요?
미해결
(2025 최신 업데이트)리액트 : 프론트엔드 개발자로 가는 마지막 단계
const getCurrentLocation = () => { navigator.geolocation.getCurrentPosition((position)=>{ console.log('위치', position.coords.latitude, position.coords.longitude); // 위치 37.4838677 126.902839 getWeatherByCurrentLocation(position.coords.latitude, position.coords.longitude); }); } const getWeatherByCurrentLocation = async(latitude, longitude) => { let apiKey = '0619cf6a981bec8d01375e5576139e86'; let apiUrl = `https://api.openweathermap.org/data/3.0/onecall?lat=${latitude}&lon=${longitude}&appid=${apiKey}`; let response = await fetch(apiUrl); let data = await response.json(); console.log('data', data); } useEffect(()=>{getCurrentLocation()}, []); 이렇게 작성해서 돌려보니 이런식으로 401에러가 납니다....원인을 잘 모르겠어요!ㅠㅠ
해결됨
풀스택 리액트 라이브코딩 - 간단한 쇼핑몰 만들기
안녕하세요 리액트로 웹개발 시작한 6개월차 신입개발자 입니다. 강의 정말 잘 보고있는데 너무 감사하게도 우연히 저희 안건과 개발환경이 많이 겹쳐서 큰 도움받고있습니다! 현재 안건에서 쓰는 리액트버전이 15.6.1인데 이번에 최신버전 v18.2.0로 업데이트하는 미션 이 떨어졌는데어떻게 헤쳐나가야할지 너무 답답해서 고민끝에 질문드립니다... 현재 안건의 스펙입니다. ・안건종류: 데이트 매칭 어플 ・메인언어: react ・상태관리: redux ・프레임워크 : koa ・미들웨어: redux-thunk ======== 개요 ======== 일단 검색으로는 잘 정리된곳 찾기가 어려워서 리액트공식문서와 책 위주로 참고해서 정리중인데요, 우선 큰 틀을 짜고 문제점들을 세분화하면서 틀을 좁혀가려고합니다.. react, react-dom 최신버전 인스톨후 에러를 우선순위별로 리스트화 하기 ・ ReactDOM.render is no longer supported in React 18. Use createRoot instead. ・Warning: componentWillMount has been renamed, and is not recommended for use. ・ componentWillReceiveProps has been renamed ・You have triggered an unhandledRejection, you may have forgotten to catch a Promise rejection 공동작업을 위한 규칙 리스트화 하기 ・class 컴포넌트 → function 컴포넌트로 변경 ・life cycle → useEffect 로 처리, 또는 커스텀 hook ・react-redux 의 connect 함수 → useSelector, useDispatch Hooks로 리덕스와 컴포넌트 연동 ・state 업데이트시 불변성을위한 spread 연산자, immer 사용 ・코드 스플리팅: 라우팅에 React.lazy or Suspense 적용 ・react-redux 디렉토리 구조: 일반구조(component, container, reducer)-> ducks 패턴 사용해서 파일 모듈화 의존중인 라이브러리및 패키지 업데이트 2와 3을 진행하며 기타 에러를 해결 ======== 질문 ======== 3번의 [공동작업을 위한 규칙 리스트화]의 경우, 검색과 에러기준으로 만들고있는데 너무 부족한것같습니다. 프로젝트 버전 업그레이드시, 기준이 되는 컨텐츠가 있는지 궁금합니다. 현재 리액트 구버전 15부터 16,17,18 최신버전까지의 모든 업데이트 변경점을 체크해서 일일이 적용해야하는지(←React공식문서블로그에서), 단순히 15->18로 점프해서 바뀐사항만 적용해도되는지 현재 구버전에서 사용중인 각종 패키지, 라이브러리 업데이트는 어떤 방향으로 진행해야할지-> 이부분이 제일 손대기 어려울정도로 막막합니다. 리액트버전업뎃처럼 똑같이 최신버전인스톨, 에러체크, 버전별 변경점 체크후 적용및 수정 하면 될까요? 입사 3개월차에 선배나 가이드없이 진행중이라 정말 고민끝에 질문드립니다… 혹시 시간나실때 답변이나 조언해주시면 정말 감사하겠습니다……(살려주세요…..) 잘부탁드려요 ! (제발 구원의 손길을 ㅠㅠㅠ) package.json (react만 최신인스톨) "dependencies": { "@paypal/paypal-js": "4.1.0", "babel-runtime": "^6.25.0", "chart.js": "^2.6.0", "classnames": "^2.2.3", "es6-promise": "^4.1.1", "exif-js": "^2.2.1", "firebase": "^7.7.0", "history": "^3.3.0", "koa": "^1.2.0", "koa-static": "^2.0.0", "lodash.reverse": "^4.0.1", "lodash.sortby": "^4.5.0", "lodash.throttle": "^4.0.0", "lodash.uniqby": "^4.5.0", "moment": "^2.17.0", "moment-timezone": "^0.5.13", "node-fetch": "^2.6.6", "normalizr": "^2.3.0", "object-assign": "^4.0.1", "pm2": "^2.6.1", "prop-types": "^15.5.10", "react": "^18.2.0", "react-chartjs-2": "^2.5.6", "react-dom": "^18.2.0", "react-ga": "^2.1.2", "react-helmet": "^5.1.3", "react-infinite-scroller": "^1.2.4", "react-redux": "^5.0.2", "react-router": "^3.0.5", "react-router-redux": "^4.0.1", "react-router-scroll": "^0.4.1", "react-scroll": "1.5.4", "react-slick": "^0.14.5", "react-swipeable": "^4.0.1", "react-textarea-autosize": "^5.0.6", "redux": "^3.7.2", "redux-actions": "^2.2.1", "redux-api-middleware": "^1.0.3", "redux-logger": "^3.0.6", "redux-thunk": "^2.4.0" }, "devDependencies": { "babel-cli": "^6.7.5", "babel-eslint": "^8.2.3", "babel-plugin-espower": "^2.3.1", "babel-plugin-module-resolver": "^4.1.0", "babel-plugin-transform-async-to-generator": "^6.24.1", "babel-plugin-transform-class-properties": "^6.6.0", "babel-plugin-transform-export-extensions": "^6.22.0", "babel-plugin-transform-object-rest-spread": "^6.23.0", "babel-plugin-transform-runtime": "^6.15.0", "babel-preset-es2015": "^6.6.0", "babel-preset-react": "^6.3.13", "babel-register": "^6.7.2", "babelify": "^7.3.0", "browserify": "^13.0.0", "css-mqpacker": "^6.0.1", "csswring": "^6.0.0", "envify": "^4.1.0", "eslint": "^4.19.1", "eslint-config-tapplint": "^2.0.1", "eslint-config-tapplint-react": "^1.0.0", "eslint-plugin-react": "7.4.0", "gulp": "^3.9.0", "gulp-consolidate": "^0.2.0", "gulp-htmlmin": "^3.0.0", "gulp-iconfont": "^8.0.0", "gulp-imagemin": "^3.3.0", "gulp-notify": "^3.0.0", "gulp-plumber": "^1.0.1", "gulp-postcss": "^6.4.0", "gulp-rename": "^1.2.2", "gulp-sketch": "^1.0.5", "gulp-sourcemaps": "^2.0.0", "husky": "^0.14.3", "karma": "^1.1.0", "karma-browserify": "^5.0.5", "karma-chrome-launcher": "^2.2.0", "karma-mocha": "^1.0.1", "karma-mocha-reporter": "^2.0.3", "lint-staged": "^7.2.2", "lodash": "^4.11.1", "md5-file": "^4.0.0", "mocha": "^3.5.0", "postcss": "^5.2.17", "postcss-cssnext": "^3.1.1", "postcss-import": "^10.0.0", "postcss-media-variables": "^2.0.0", "postcss-nesting": "^2.3.1", "power-assert": "^1.4.4", "react-addons-test-utils": "~15.6.0", "react-prefixr": "^0.1.0", "require-dir": "^0.3.2", "stylelint": "^7.13.0", "stylelint-config-standard": "^16.0.0", "stylelint-order": "^0.5.0", "tapplint": "^0.9.0", "terser": "^4.6.11", "uglifyify": "^5.0.2", "watchify": "^3.7.0", "yargs": "^6.0.0" }
미해결
나도코딩의 자바 기본편 - 풀코스 (20시간)
결제해서 이제 시작해볼려고 하는데 no usages 라는 메세지가 많이 보입니다 처음 프로그램 깔며 어떤 설정을 잘못한걸까요?
미해결
자바 ORM 표준 JPA 프로그래밍 - 기본편
값 타입 컬렉션 대안으로 entity에 감싼다고 했는데요 예를 들어 @Embedable인 Address를 그냥 처음부터 @Entity로 승격시켜버리면 되는데 굳이 왜 감싸나요?
미해결
스프링 부트 개념과 활용
자동 설정 만들기 2부:@ConfigurationProperies에서 진행하다가 에러가 발생했습니다 spring boot getting started 프로젝트에서 빈을 등록하지 않으면 spring boot starter의 HolomanConfiguration에서 @ConditionalOnMissingBean과 AutoConfiguration을 통해 HolomanProperties의 값을 참조해서 application.properties에 있는 내용으로 빈을 만드는 것으로 이해했습니다 따라서 Application 프로젝트에서 빈을 재정의할 필요없고 properties만 정의하면 되는 것으로 알고 강사님 코드를 다시 살펴봤는데 어디를 고쳐야 되는지 잘 모르겠습니다... 아래는 HolomanProperties와 에러가 발생한 실행결과를 올렸습니다
미해결
실전! Querydsl
Querydsl 기술은 복잡한 쿼리를 작성할 때나 동적쿼리를 쉽게 작성할 때 큰 강점을 가진 것으로 알고 있습니다. 그런데 정적쿼리와 동적쿼리의 개념에 대한 차이점이 잘 와 닿지가 않아 질문을 드립니다. 정적쿼리에 파라미터를 주고 파라미터에 따라 쿼리를 한 결과가 달라지는 것은 왜 정적쿼리인 것인지 조금 혼란스러워서요. 정적쿼리와 동적쿼리를 확실히 구분하는 기준(?) 같은 것이 있는지 궁금합니다. 여기서부터는 제 생각입니다! 혹시 정적쿼리에 파라미터를 넣어서 조회하는 것은 파라미터를 넣지 않으면 아예 SQL이 실행이 되지 않는 반면에 동적쿼리를 수업에서 예시를 들어서 설명하신 것처럼 이름은 들어가고 나이는 들어가지 않아도 쿼리가 실행은 되는 그런 차이일까요?
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
현재 노드 버전이 올라가서 노드도 16.17로 내리고 나머지도 다 버전 내려서 버전에 맞게 설정하고 yarn add next@12.1.0 react@17.0.2 react-dom@17.0.2 --exact 까지 했는데 노션에 있는 것 처럼 페이지와 api 여러 등등이 뜨지 않습니다 뭐가 문제일까요?ㅠㅠ
미해결
[리뉴얼] React로 NodeBird SNS 만들기
post 로 id, password 전송시 => 크롬 개발자 도구, 네트워크, Request 에 보면 id, password 가 그대로 노출되는데 숨길순 없나요? 브라우저를 사용하는 유저가 보낸 거기 때문에 보안을 안해도 상관없을까요?
미해결
나도코딩의 자바 기본편 - 풀코스 (20시간)
메인 메소드에서 부모클래스 객체이름 = new 부모클래스 이런식으로 메모리가 형성되었는데 ex) Camera camera = new Camera(); Camera factorycamera = new Camera(); Camera speedcam = new Camera(); 다형성이기에 부모클래스 객체이름 = new 부모클래스or자식클래스 이런식으로 쓸수도있다 ex) Camera camera = new Camera(); Camera factorycamera = new Factorycamera(); Camera speedcam = new Speedcam(); 라고 강의에서 말씀하셨는데요. 둘의 차이가 그냥 뒤에 자식클래스 이름을 쓸수있다는건데 이게 무슨 변화가 있는건가요?
해결됨
스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술
이 부분에서 문제가 발생하는데 어떻게 해결해야할까요? 위에 Model에서 오류나는 부분은 다른분의 질문을 보고 해결했는데 이 부분은 질문을 찾지 못해 올립니다!
해결됨
실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
연관관계 편의 메서드가 아래와 같은 상황에서 사용되는 것이 맞는지 궁금해서 질문드립니다. Project, Client 클래스가 서로 1 대 다 , 다 대 1 관계라고 했을 때 Project를 등록할 때 Client가 필요하기 때문에 Project 쪽에 이런 식으로 연관관계 편의 메서드를 작성해 주고 아래와 같이 Project의 createProject2 메서드를 이용하여 등록해준다고 하면 Project 쪽에서 작성해둔 연관관계 편의 메서드를 아래와 같이 사용하는 게 맞는 사용 방법인가요?
해결됨
프론트엔드 개발자를 위한, 실전 웹 성능 최적화(feat. React) - Part. 1
제공해주신 예제 파일에서는 performance tab으로 돌려보면 어떤 컴포넌트의, 어떤 메서드인지 알 수 있는데 vue app을 실행시키고 똑같이 돌려보면 "컴파일 코드" 라고만 되어 있어서 이게 어떤 메서드인지 알 수가 없습니다. 이런 경우에는 어떻게 식별할 수 있을까요? 혹은 어떤 설정을 바꾸면 될까요?
해결됨
나도코딩의 자바 기본편 - 풀코스 (20시간)
안녕하세요. 강의 잘 듣고 있습니다. if (student.certification.equals("자바")) if (student.certification.contains("자바")) 이렇게 해도 결과값은 같게 나오는데 보통 equals를 많이 사용할까요?!
미해결
스프링 시큐리티
자유주제가 맞을 것 같은데, 보통 질문 찾아보실 거 같아서 해당 카테고리에 올려둡니다. 작년 말, 스프링부트가 3.0 버전으로 올라오면서 WebSecurityConfigurerAdapter를 사용 못하게 된 것 같습니다. 방법 1. build.gradle의 스프링 부트 버전을 2.7 이하로 낮추니 deprecated 상태로 쓸 수 있었습니다. 방법 2. 부트 버전을 낮추지 않고 3.0에서 쓰려면 아래와 같이 SecurityFilterChain을 Bean으로 쓰면 될 것 같습니다. 참고: Spring Security without the WebSecurityConfigurerAdapter 잘못된 내용이 있으면 댓글로 알려주세요!
