- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.   바오밥 테스트넷의 토큰 목록을 확인했을 때 기본으로 받은 클레이튼 토큰이랑 제가 만든 토큰의 수가 모두 0으로 떠요 강의 영상에서는 각각 5개 1억개로 나타나던데 따로 설정을 해야 하나요?

[vagrant@localhost ~]$ sudo netstat -nltup Active Internet connections (only servers) Proto Recv-Q Send-Q Local Address           Foreign Address         State       PID/Program name tcp        0      0 0.0.0.0:22              0.0.0.0:*               LISTEN      667/sshd tcp        0      0 0.0.0.0:111             0.0.0.0:*               LISTEN      1/systemd tcp6       0      0 :::22                   :::*                    LISTEN      667/sshd tcp6       0      0 :::111                  :::*                    LISTEN      1/systemd udp        0      0 127.0.0.1:323           0.0.0.0:*                           641/chronyd udp        0      0 0.0.0.0:111             0.0.0.0:*                           1/systemd udp6       0      0 ::1:323                 :::*                                641/chronyd cent1 번 수동으로 설치후 root로 init.sh 실행시키면 자동 재시작된후 다시 접석후 보면 80 포트가 안떠저 있습니다. 

먼저 강의를 제공해주셔서 감사합니다. 공부하다가 궁금한 부분이 있어서 질문드립니다.   user.comparePassword부분을 만들어준 후 , User.js부분에 userSchema.methods를 사용하여 함수를 만들어주는데 그럴 필요없이 그냥 index.js에서 user.comparePassword부분에 비밀번호가 같은지 확인할 수 있는 함수를 바로 만들면 되는 거 아닌가요? 굳이 userSchema.methods를 거쳐서 함수를 만들어주는 이유는 무엇인가요?

혼자 프로젝트 진행중에 너무 해결이 안되서 혹시나 조언을 얻을 수 있을까 해서 질문을 남깁니다. 강의와 관계가 없는 점 사전에 말씀드립니다ㅠ 죄송합니다 ㅠㅠ   shopify와 같은 e-commerce 사이트에서 상품을 등록하는 페이지를 보게되면 상품명, 상품 설명과 같은 string 타입의 인풋이 있고 variations(options)과 같이 object 타입의 여러개의 input을 입력할수 있는 칸들이 있습니다. 아래와 같이요. (예시)     제가 궁금한 것은 이 페이지에 submit버튼이 하나가 있고 이 action으로 모든 변경된 사항을 디비에 적용하고 싶은데요, 이 action하나에 update, create, delete,와 같은 여러가지 변경사항이 있을수 있을거 같습니다. 예를들어 상품명, 상품 설명은 변경이 되고, 어떤 variant들은 추가가 되고, 기존에 있던 variant들은 삭제가 될텐데, 이걸 어떻게 핸들링하는게 좋은 방법인가요? 서버에 여러번의 요청(multiple CRUD oprtaion)을 보내게 되는건가요?   shopify사이트가 이와 같은 구조여서 network탭에 들어가서 보았는데 update api를 하나를 호출하였고, payload를 보니 최종적으로 변경된 states만 서버로 보내서 서버에서 추가할 것들은 추가하고 삭제할 것들은 삭제해서 처리를 하는거 같습니다. 그렇다면 서버에서 데이터베이스에 있는 값들을 불러와서 디비에 없으면 추가하고, payload의 states에 없으면 데이터베이스에서 삭제하는 이런 작업을 일일이 해주는 것인가 궁금합니다.   저는 FE에서 데이터를 가공해서 server로 딱 필요한 요청과 데이터만 보내는게 맞다고 생각을했는데 서버에서 이런것들을 쉽게 핸들링할수가 있고 이렇게 logic을 운영하는게 맞는지 궁금합니다.   긴글 읽어주셔서 감사합니다.

<div class="trigger"> <span></span> <span></span> <span></span> </div> ----------------------------------------------------------  .trigger.active span:nth-child(1) {   top: 50%;   transform: rotate(45deg); } .trigger.active span:nth-child(2) {   opacity: 0; } .trigger.active span:nth-child(3) {   top: 50%;   transform: rotate(-45deg);   } }   안녕하세요~  반응형 헤더 네비게이션 강의 궁금한게 있는데요 위에 코드가 트리거 모바일  네비게이션 모양 만드는 코드인데 html에 trigger라는 div태그에 .active 라는 클래스명을 안주었는데 저렇게 css에 .trigger.active를 주셨던데  html에 .active 클래스명을 안주었는데도 트리거를 눌렀을때  메뉴가 왜 작동되는지 궁금합니다.

안녕하세요 이미지가 1~2장일때와 그 이상일때로 나누어서    1장: 기본 출력 2장 : 기본 출력에 버튼으로 이동 3장 이상 :  4분할 기본 출력 + 모달 + 이미지 슬라이드   이렇게 구현해 보았습니다.   http://skilnote-for-react.co.kr/wm/myshortcut/react-nodebird/28

안녕하세요 강사님 책도 가지고 있는데 책읽을 시간이 없어 강의로 필요한 부분만 보았는데요 useEffect로 onMounted됐을때 실행시킬 함수들을 빈배열을 넣고 사용하는 것보다,  useOnMounted라는 훅으로 만들어서 실행시키는게 더 낫다고 하셨는데요, 이유가 무엇인가요? 저는 mounted직후는 빈배열을 useEffect에 넘겨주면서 사용했었고 딱히 불편함을 느낀적이 없어서 이해가 잘안갑니다😭 왜 그게 더 나은지 설명이 부족한것 같아서 여쭤봅니다😭  단순히 가독성 때문인가요? 자세히 알고싶어요! 감사합니다.

장기효 선생님   깃허브 권한 승인 메일에 제 주소가  minechoo <choominhae@gmail.com> 참조되어 끊임없이 메일이 오고 있어요   확인해 주시길 바랍니다~!    

저 문제가 좀 많더라고요 ㅠㅠ 1번 문제왜 제가 dayjs를 적용하면 아예 사라지더라고요! ㅠㅠ  2번 문제!src\product\index.js   Line 42:6:  React Hook useEffect has a missing dependency: 'id'. Either include it or remove the dependency array  react-hooks/exhaustive-deps   src\upload\index.js   Line 3:10:  'ForkOutlined' is defined but never used  no-unused-vars   Search for the keywords to learn more about each warning. To ignore, add // eslint-disable-next-line to the line before.   라고 터미널에 써졌더라고요 ㅠ 그런데 막상 React App을 실행하면 메인도 잘 나오고,  상품을 클릭해도 잘 나오는데 뭐가 문제인지 모르겠습니다  //CSS를 적용하려면, import "./index.css" import {useParams} from 'react-router-dom'; import axios from 'axios'; import { useEffect, useState } from 'react'; function ProductPage(){    //const prams = useParams();    // console.log(prams); //이제 상품을 선택을 할 때 콘솔창에 id: 0, 1, 2.. 상품 숫자가 나온다.        //const params = useParams();    //console.log(params); //id를 출력하는 것을 확인할 수 있다. >> 콘솔창에 {id : 2} 이런식으로!        const {id} = useParams();    const [product, setProduct] = useState(null);    //처음엔 null이 나타나고 렌더링이 되고 나서 서버에서 상품을 받아오고 호출됨.    //useState는 데이터를 받아주는 역할인데 쉽게 말을 하면 네트워크를 받아 상품을 보여줄 때 쓰임    // 콜백 함수    useEffect(function(){       // useEffect를 통해 1번만 통신해 네트워크를 호출을 해준다. << 쉽게 말을 하면 1f의 형식이다.       // axios.get('https://4326fdea-003a-4291-b8b3-b8e47b10723c.mock.pstmn.io/products'+ id)       // axios.get(`https://4326fdea-003a-4291-b8b3-b8e47b10723c.mock.pstmn.io/products/${id}`)       axios.get(          `http://localhost:8080/products/${id}`          )       // 프로미스(promise)       .then(function(result){          // 익명함수에 result의 인자를 넣는다.          // setProduct(result.data); postman을 통한 작업을 했을때는 이렇게 간편했지만          // 이제는 server.js > product에서 데이터를 받아야 하기 때문에 작성을 조금 더 추가해야 함.          setProduct(result.data.products);          // console.log(result);       })       // 프로미스(promise)       .catch(function(error){          console.log(error);       })    },[]);    // console.log(product);    // return <h1>상품 상세 페이지{id} 상품</h1> //js문법    if(product == null){       return <h1>상품 정보를 받고 있습니다...</h1>    }    // {/* const [product, setProduct] = useState(null); 를 비동기 처리방식으로 작동이 되기 때문에 당연히 product.imageUrl은 null로 처리가 된다. 따라서 오류가 발생이 되는 것은 당연한 원리이다.  */}        return(       <div>          <div id="image-box">             <img src={"/"+product.imageUrl} alt=""/>          </div>          <div id="profile-box">             <img src="/images/icons/avatar.png" alt=""/>             <span>{product.seller}</span>          </div>          <div id="contents-box">             <div id="name">{product.name}</div>             <div id="price">{product.price}원</div>             <div id="createdAt">2021년 06월 15일</div>             <div id="description">{product.description}</div>          </div>       </div>    ); } export default ProductPage; import { Form, Divider, Input, InputNumber, Button } from "antd"; import "./index.css"; import { ForkOutlined } from "@ant-design/icons"; function UploadPage() {    //   return <h1>업로드 화면</h1>;    // const onSubmit = function(){//평상시 함수 표현식이다.    //  이것을 람다함수 표현식으로 바꾸도록 하자    const onSubmit = (values) => { //이것이 람다 함수 표현식!       console.log(values);    };    return(       <div id="upload-container">          <Form name="상품 업로드" onFinish={onSubmit}>             {/* 익명함수를 넣은 것과 동일하다. onFinish={onSubmit} */}             <Form.Item                name="upload"                label={<div className="upload-label">상품 사진</div>}             >                <div id="upload-img-placeholder">                   <img src="/images/icons/camera.png" alt="" />                   <span>이미지를 업로드해주세요.</span>                </div>             </Form.Item>             <Divider />             {/* Divider는 콘텐츠의 영역을 나누는 컴포넌트이다. >> 선을 그어준다. <hr> 태그와 비슷하지만 다른 속성이다. */}             <Form.Item                label={<div className="upload-label">판매자 명</div>}                name="seller"                rules={[{ required: true, message: "판매자 이름을 입력해주세요" }]}                 // rules이라는 프롭이 있는데 여기에는 {}안에서 배열[{}]로 작업해야 한다.             >                <Input                   className="upload-name"                   size="large"                   placeholder="이름을 입력해주세요."                />             </Form.Item>             <Divider />             <Form.Item                name="name"                label={<div className="upload-label">상품 이름</div>}                rules={[{ required: true, message: "상품 이름을 입력해주세요" }]}             >                <Input                   className="upload-name"                   size="large"                   placeholder="상품 이름을 입력해주세요"                />             </Form.Item>             <Divider />             <Form.Item                name="price"                label={<div className="upload-label">상품 가격</div>}                rules={[{ required: true, message: "상품 가격을 입력해주세요" }]}             >                <InputNumber defaultValue={0} className="upload-price" size="large" />                {/* 숫자형 input */}             </Form.Item>             <Divider />             <Form.Item                name="description"                label={<div className="upload-label">상품 소개</div>}                rules={[{ required: true, message: "상품 소개를 입력해주세요." }]}             >                <Input.TextArea                   size="large"                   id="product-description"                   //showCount={true} << react에서 기본형이다. 이것을 아래와 같이 생략할 수 있다.                   showCount                   maxLength={300}                   placeholder="상품 소개를 적어주세요."                />             </Form.Item>             <Form.Item>                <Button id="submit-button" size="large" htmlType="submit">                   문제 등록하기                </Button>             </Form.Item>          </Form>       </div>    ); } export default UploadPage;  

컴퓨터 재부팅하면 광학 드라이브가 비어있음이나 VBoxGuestAdditions.iso로 변경되어있어요. 그래서 우분투로 바꾸고 다시 설치하는 작업을 매일 다시 진행합니다. 해결 방법좀 부탁드려요...

문의 드립니다. table 데이터가 아래와 같습니다. 알파벳 컬럼 옆에 각 알파벳 데이터 갯수를 추가하고 싶습니다. 함수를 어떻게 사용해야 하는지요? 알파벳    갯수 A               3 B               2 C                1 A               3 A               3 B              2 Z               1  

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요.1. 강의 내용과 관련된 질문을 남겨주세요.2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요.(자주 하는 질문 링크: https://bit.ly/3fX6ygx)3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요.(질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG)질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요.=========================================[질문 템플릿]1. 강의 내용과 관련된 질문인가요? (예/아니오)2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오)3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오)[질문 내용]여기에 질문 내용을 남겨주세요.       cannot reslove method가 뜨면서 계속 오류라고 뜨는데 왜 저는 attributeValue가 저절로 생성이 안되는지 모르겠습니다 ㅠ

안녕하세요. 항상 좋은 강의, 답변 주셔서 감사합니다. 이번에 여쭤보고 싶은 것은 @BatchSize가 동작하지 않는 부분에 대해서입니다. <Order의 OrderItems> BatchSize 100 설정 @BatchSize(size = 100)@OneToMany(mappedBy = "order", fetch = FetchType.LAZY, cascade = CascadeType.ALL) // order가 만들어지면 orderItem이 만들어지기 때문에 영속성 전이한다.private List<OrderItem> orderItems = new ArrayList<>(); <OrderItems의 Item> BatchSize100 설정 @BatchSize(size = 100)@ManyToOne(fetch = FetchType.LAZY)@JoinColumn(name = "item_id")private Item item; 위와 같이 설정을 했는데, 실제로 배치가 적용되는 것은 아래 쿼리를 확인하시면 아시겠지만 OrderItems에만 적용이 됩니다.    item는 배치 사이즈가 적용이 되지 않아 총 4번이 나가게 되고, OrderItem은 배치 사이즈가 적용되어 1번의 쿼리만 나갑니다.   다른 엔티티에도 적용해보니 정황상 ManyToOne, OneToOne 관계에서 배치 사이즈가 안 먹는거 같은데.. 혹시 item 같은 ManyToOne에는 어떻게 배치 사이즈를 적용하는지 알려주시면 감사하겠습니다   참고 :글로벌 배치 사이즈는 잘 먹습니다!                 

젤 어려운 부분인것 같습니다. ㅠ 1. 피호출자 callee 2. 게임에서의 Manager 3. 이벤트 Publisher 이것들이 다 같은 위치에 있는 개념으로 정리하면 될까요   마지막으로 델리게이트는 type이라고 하셨는데 이벤트를 어떻게 이해해야 할까요. 비슷하게 메소드를 담는 그릇일까요

강의 1분 15초 부근에 설명하신 것처럼 Pin 프리펩 전체를 "Pin" 태그로 설정하면 Pin을 던지자마자 게임오버가 됩니다. (Pin과 Pin이 만나지 않아도 게임오버됨) 제 경우엔 Pin 프리펩의 Square 오브젝트는 "Pin" 태그로 설정하지 않아야 게임이 정상적으로 진행됩니다. 고박사님이 알려주신대로 따라 했는데 제가 무엇을 놓쳤는지 모르겠습니다. 어디가 잘못 된 걸까요?

(사진)

@WebServlet에서 name="" 이렇게 해도 정상으로 작동이 되는데[ 이름이 주는 이유가 있을까요?

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.   해야되는 모든 것들을 다 따라하고 이제 설레는 마음으로 Vivado & 를 쳤는데 실행은 안되고 오류가 발생했습니다 ㅠㅠㅠㅠ

안녕하세요..! 영한님 강의 즐겁게 듣고 있는 학생입니다..!   @Inheritance 로 조인전략 채택 시, 슈퍼타입을 조회하여도 EAGER Fetch가 적용되고 서브타입을 조회하여도 EAGER Fetch가 적용되어 Lazy Fetch를 적용할 수 없는가 싶어 구글링을 5시간정도 하다가 해당 글을 발견하였습니다. https://sodocumentation.net/hibernate/topic/2326/performance-tuning   위 포스팅처럼 조인전략 물리모델에서 LAZY Fetch 를 적용하려면 @Inheritance의 도움을 받지 않고 @OneToOne 등으로 직접 모델링하는 수 밖에 없을까요...?   강의에서 실무에서 영한 선생님도 조인전략을 많이 사용하신다고 말씀하셨는데, @Inheritance 어노테이션으로 구현하시는지, 해당 어노테이션으로 구현하신다면 EAGER Fetch는 어떻게 핸들링하시는지 궁금합니다..!      

package com.junyharang.jwtstudy.config.jwt; import com.fasterxml.jackson.databind.ObjectMapper;import com.junyharang.jwtstudy.auth.PrincipalDetails;import com.junyharang.jwtstudy.model.Member;import lombok.RequiredArgsConstructor;import org.springframework.security.authentication.AuthenticationManager;import org.springframework.security.authentication.UsernamePasswordAuthenticationToken;import org.springframework.security.core.Authentication;import org.springframework.security.core.AuthenticationException;import org.springframework.security.web.authentication.UsernamePasswordAuthenticationFilter;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import java.io.IOException;// 스프링 시큐리티에 UsernamePasswordAuthenticationFilter가 있다.// /login이 요청 오면 username, password를 전송하면 (Post로)// UsernamePasswordAuthenticationFilter가 동작한다.// 현재는 SecurityConfig에서 FormLogin을 disable을 시켜서 동작하지 않는다.@RequiredArgsConstructorpublic class JwtAuthenticationFilter extends UsernamePasswordAuthenticationFilter { private final AuthenticationManager authenticationManager; @Override // /login 요청이 들어오면 로그인 시도를 위해 실행되는 Method public Authentication attemptAuthentication(HttpServletRequest request, HttpServletResponse response) throws AuthenticationException { System.out.println("JwtAuthenticationFilter : 로그인 시도 중 입니다!"); // 1. username, password를 받는다. try {// BufferedReader reader = request.getReader();//// String input = null;//// while ((input = reader.readLine()) != null) {// System.out.println(input);// } // while 문 끝 // JSON으로 전달된 값을 Parsing 할수 있게 해주는 객체 생성 ObjectMapper om = new ObjectMapper(); Member member = om.readValue(request.getInputStream(), Member.class); System.out.println(member); // Token 생성(회원의 이름과 Password를 통해) UsernamePasswordAuthenticationToken authenticationToken = new UsernamePasswordAuthenticationToken(member.getUsername(), member.getPassword()); // PrincipalDetailsService의 loadUserByUsername()이 실행 된다. // authenticationManager에 Token을 넣어 호출한다. // authentication 변수에는 Login 정보가 담긴다. Authentication authentication = authenticationManager.authenticate(authenticationToken); // authentication 객체가 Session 영역에 저장된다. PrincipalDetails principal = (PrincipalDetails) authentication.getPrincipal(); // 출력이 된다면 Login이 되었다는 의미 System.out.println(principal.getMember().getUsername()); return authentication; } catch (IOException e) { e.printStackTrace(); } // try-cache 문 끝 System.out.println("==========================================="); // 2. authenticationManager로 정상 인지 로그인 시도하면 PrincipalDetailsService가 호출된다. // 해당 Class안에 loadUserByUsername()가 자동 호출 // 3. PrincipalDetails를 Session에 담는다. // Session에 해당 내용을 담는 이유는 담지 않으면 권한에 대한 처리를 할 수 없기 때문이다. // 4. JWT를 만들어서 응답해 준다. return null; } // attemptAuthentication(HttpServletRequest request, HttpServletResponse response) 끝 } // class 끝   안녕하세요? 25강에 해당 부분을 하다가 DB에 회원값이 들어가 있는 걸 보고, 회원가입 로직이 누락 되었다는 부분을 찾기 위해 Controller를 보고 아래 내용을 추가 하였습니다.   @PostMapping("join") public String join(@RequestBody Member member) { member.setPassword(bCryptPasswordEncoder.encode(member.getPassword())); member.setRolse("ROLE_USER"); memberRepository.save(member); return "회원가입완료";}   그리고 나서 SecurityConfig에 아래 내용을 추가 하였구요. @Autowired private MemberRepository memberRepository;@Autowired private CorsConfig corsConfig;@Bean public PasswordEncoder passwordEncoder(){ return new BCryptPasswordEncoder();} // passwordEncoder() 끝private final CorsFilter corsFilter;   근데 아래와 같은 Error가 발생 합니다. Error starting ApplicationContext. To display the conditions report re-run your application with 'debug' enabled. 2022-01-19 00:25:02.184 ERROR 17752 --- [ restartedMain] o.s.b.d.LoggingFailureAnalysisReporter : *************************** APPLICATION FAILED TO START *************************** Description: Parameter 1 of constructor in com.junyharang.jwtstudy.controller.RestAPIController required a bean of type 'org.springframework.security.crypto.bcrypt.BCryptPasswordEncoder' that could not be found. Action: Consider defining a bean of type 'org.springframework.security.crypto.bcrypt.BCryptPasswordEncoder' in your configuration.