묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
pages 폴더 안에 있는 컴포넌트
Pages 안에 있는 컴포넌트들도 styled-component 따로 분리하고 싶을때도 폴더를 만들어서 작업을 해야 할까요? Pages 폴더 안에는 라우팅 잡힐거 같아서 파일 관리를 어떤식으로 해야할지 궁금합니다.
-
미해결[리뉴얼] Node.js 교과서 - 기본부터 프로젝트 실습까지
exports 관련 질문드려요
안녕하세요! 두개의 객체를 exports할 때 아래와 같이 쓸수 있는데, exports.odd = odd; exports.odd = '홀수입니다. ' 와 같다고 볼수 있을까요? 문득 exports.odd = odd 문법을 잘 이해하지 못하겠어서 ㅠㅠ질문드렸습니다. const odd = '홀수입니다.'; const even = '짝수입니다.'; exports.odd = odd; exports.even = even;
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
PM2 ERROR가 뜹니다
pm2 설치도 다 했고, sudo npm start로 back서버를 실행하려 하니까 오류가 뜹니다
-
미해결스프링 핵심 원리 - 기본편
실제 프로젝트를 어떻게 만들어가야할지 고민입니다
훌륭한 강의 정말 잘들었습니다! 에어비엔비랑 비슷한 프로젝트를 진행하려는데, 현재 배운 강의만으로는 스프링으로 웹앱 배포하기에는 많이 부족할거같다는 생각이 듭니다ㅠㅠ 아직 프론트엔드는 html css 바닐라js로 페이지 만들어본것밖에 없고, 이런 프론트엔드(!)와 DB를 스프링과 어떻게 잘 연동해서 사용할지를 모르겠는데.. 혹시 앞으로 공부할 방향을 어떻게 잡아야 할지 알려주실수 있으신가요..? 당장 만들어보고 싶지만 이후에 나올 강의들을 다 들어보고 시작하는것이 나을까요?
-
미해결Spring Cloud로 개발하는 마이크로서비스 애플리케이션(MSA)
gateway 질문드립니다.
게이트웨이를 기동시키고 매핑한 path로 들어가면 콘솔창에 이렇게 뜨네요. 그렇다고 작동이 안되는건 아니고, 접속도 잘되고, 헤더 추가한것도 출력도 잘 됩니다. 처음 한번만 이런 예외 발생하고나면 더이상 생기지 않는데, 원래 이런건지 아니면 제가 어디 설정에서 뭔가 잘못 건드린걸까요. 분명 정상적으로 동작하는데 이런 예외가 뜬다는게 조금 찜찜하네요. 아 참, 좋은 강의 내주셔서 정말 감사드립니다. 잘 보겠습니다.
-
미해결따라하며 배우는 도커와 CI환경 [2023.11 업데이트]
도커가 클라이언트와 서버로 분리되어 있는 이유가 뭔가요?
현재 실습 환경에서는 도커가 리눅스 VM 위에서 동작하기 때문에 클라이언트와 서버로 나눠져 있는 건가요?? 리눅스 운영체제 환경에서 도커를 사용할 때도 도커는 클라이언트와 서버로 나눠져 있나요?
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
선생님 jsfiddle 말고 간단하게 자바스크립트 코드를 쳐볼 곳이 있나요
선생님 ppt의 소스를 간단하게 쳐서 연습해보는데 브라우저 콘솔이나 jsfiddle 이외에 ide처럼 강력한 기능을 쓸 수 있는 방법이 있을까요? 이클립스 툴은 일일이 웹 프로젝트를 만들어야 하고, 브라우저 콘솔은 제가 틀리게 입력하면 그걸 잡아주는 기능이 좀 부족해요. 자바스크립트 소스만 단순히 실행해주되, ide 같은 툴이 있을까요?
-
미해결인공지능 기초수학
강의 교안 요청
강의 듣기위해 필요한 강의 교안 요청드려도 될까요? 강의 후 교안 요청드립니다. 메일 주소는 jgh910000@naver.com 입니다.
-
미해결프론트엔드 개발자를 위한, 실전 웹 성능 최적화(feat. React) - Part. 1
번들링 후 가져오는 파일의 용량에 대해서
안녕하세요 강사님 강의 잘 듣고있습니다. 코드 스플리팅에 대해서 궁금한 점이 생겨서 질문을 남기게 되었습니다. 제가 이해한 바로는 웹팩에 의해 번들링된 파일이 너무 무거워지면 가져오는데 오랜시간이 걸리니 필요할 때 가져오는 방식으로 React.lazy를 사용해 Code splitting을 사용하는 것을 이해했습니다. 그래서 저는 같은 페이지면 js파일을 가져올 때 분리되어 조금 용량이 작아진 js 파일을 가져올 것이라고 예상을 했는데 splitting 전이나 후나 같은 용량의 파일을 여러개 가져오는 것을 보고 이상하다는 생각이 들었습니다. 이게 올바른 상황인건가요?첫번째 사진이 splitting 전두번째 사진이 splitting 후 입니다.
-
미해결쉽고 빠르게 익히는 Excel 파워 쿼리
엑셀파일 취합 관련
안녕하세요. 쉽고 명쾌한 강의 감사 드립니다. 엑셀파일 취합 기능 사용관련 문의 드립니다. 엑셀 파일 취합시 표데이터는 열머리글을 인식해서 공백까지 동일 해야 된다고 하셨는데요. 1번 파일 표 데이터에 열이름이 1,2,3,4 가 있고 2번 파일 표 데이터에 열이름이 1,2,3,7이 있는 파일을 결합할때 입니다. 이 경우 쿼리결과에 열 이름은 1,2,3,4,7 4개 열이름이 되고 1,2,3열은 1,2번 파일 데이터가 합쳐지고,4번열은 1번파일 데이터만,7번열은 2번파일 데이터만 가져오게 되는지요?
-
해결됨Node.js 교과서 - 기본부터 프로젝트 실습까지
실제 서비스에서도 cluster를 사용하나요?
보통 EC2 인스턴스에 express와 같은 백엔드 서버를 띄우고 Traffic이 많이 발생할때 앞단에 로드밸런서를 붙여서 Traffic을 부하분산시킬수 있도록 EC2를 여러개 구성하거나 Auto Scaling 그룹을 생성하는 것으로 알고 있습니다. 그런데 강좌를 보고 생각해보니 EC2인스턴스에서도 싱글스레드인 node 백엔드이기 때문에 Core를 여러개 사용하지 않고 1개씩만 사용하기때문에 나머지 Core들이 놀고 있겠구나 하는 생각이 들었습니다. 만약에 Core가 2개인 EC2 인스턴스 2개를 로드벨런서를 통해 서비스를 한다고 가정했을때, 1개의 인스턴스에서 cluster를 통해 cpu를 multi core로 활용한다고 한다면 성능상 비슷할까요? 또 실제로 cluster를 사용해서 node 서비스를 띄우는지도 궁급합니다. ㅎ :)
-
미해결스프링 핵심 원리 - 기본편
사진첨부 궁금점
질문1 (static 입력시 잘실행됩니다) 자바 기초지식 부족으로 인한 질문입니다.. Map store 부분에 static을 지우고 OrderApp을 실행시킬시 NullPointException이 발생했습니다. 이유가 궁금합니다.. static변수는 실행시 종료까지 메모리에 계속 할당되있고 전역변수로 쓰임에있어서 store안에 값이 남아있기 때문인 것이고 static이없으면 객체생성전까지 메모리에 없고, 지역변수이기 때문에 null이 발생하는것일까요?..
-
미해결[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
선생님 ㅠ 이 오류 해결할수 없을까요?...
(사진)
-
미해결[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
탭 화면전환이 되지않습니다
html <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>가로 레이아웃-1</title> <link rel="stylesheet" href="style/style.css"> </head> <body> <div class="container"> <header> <div class="header-logo"></div> <div class="navi"> <ul class="menu"> <li> <a href="#none">MENU-1</a> <div class="sub-menu"> <a href="#none">SUBMENU-1</a> <a href="#none">SUBMENU-2</a> <a href="#none">SUBMENU-3</a> <a href="#none">SUBMENU-4</a> </div> </li> <li> <a href="#none">MENU-2</a> <div class="sub-menu"> <a href="#none">SUBMENU-1</a> <a href="#none">SUBMENU-2</a> <a href="#none">SUBMENU-3</a> <a href="#none">SUBMENU-4</a> </div> </li> <li> <a href="#none">MENU-3</a> <div class="sub-menu"> <a href="#none">SUBMENU-1</a> <a href="#none">SUBMENU-2</a> <a href="#none">SUBMENU-3</a> <a href="#none">SUBMENU-4</a> </div> </li> <li> <a href="#none">MENU-4</a> <div class="sub-menu"> <a href="#none">SUBMENU-1</a> <a href="#none">SUBMENU-2</a> <a href="#none">SUBMENU-3</a> <a href="#none">SUBMENU-4</a> </div> </li> </ul> <div class="sub-back"></div> </div> </header> <div class="slide"> <div> <a href="#none"><img src="images/slide01.jpg" alt="slide1"></a> <a href="#none"><img src="images/slide02.jpg" alt="slide2"></a> <a href="#none"><img src="images/slide03.jpg" alt="slide3"></a> </div> </div> <div class="contents"> <div class="news"> <div class="tab-inner"> <div class="btn"> <a class="active" href="#none">공지사항</a> <a href="#none">갤러리</a> </div> <div class="tabs"> <div class="tab1">tab1</div> <div class="tab2">tab2</div> </div> </div> </div> <div class="banner"> </div> <div class="shortcut"></div> </div> <footer> <div class="footer-logo"></div> <div class="copy"></div> <div class="sns"></div> </footer> </div> <script src="script/jquery-3.6.0.min.js"></script> <script src="script/custom.js"></script> </body> </html> css *{ padding: 0; margin: 0; text-decoration: none; list-style: none; color: #000; } .container{ width: 1200px; margin: auto; border: 1px solid red; } .container > div{} header{ width: 1200px; margin: auto; height: 100px; position: relative; /*슬라이더 위에 올라오기*/ z-index: 1; } header > div{ height: 100px; box-sizing: border-box; } .header-logo{ width: 200px; border: 1px solid #000; float: left; } .navi{ width: 600px; border: 1px solid #000; float: right; } .slide{} .slide > div{ height: 300px; border: 1px solid #000; } .contents{ overflow: hidden; } .contents > div{ height: 200px; float: left; border: 1px solid #000; box-sizing: border-box; /*컨텐츠에 보더박스!!*/ } .news{ width: 400px; } .banner{ width: 400px; } .shortcut{ width: 400px; } footer{ overflow: hidden; } footer > div{ height: 100px; border: 1px solid #000; box-sizing: border-box; float: left; } .footer-logo{ width: 200px; } .copy{ width: 800px; } .sns{ width: 200px; } /* slide */ .slide{ position: relative; width: 1200px; height: 300px; /*레이아웃이 깨지지않게 필수!*/ } .slide > div{ font-size: 0; } .slide div a { position: absolute; top: 0; left: 0; animation: slide 10s linear infinite; visibility: hidden; /* 최초에 모든 슬라이드가 존재가 없는 상태에서 출발함 */ } .slide div a:nth-child(1){animation-delay: 0s;} .slide div a:nth-child(2){animation-delay: 3.5s;} .slide div a:nth-child(3){animation-delay: 7s;} @keyframes slide{ 0%{opacity: 0;} 5%{ visibility: visible; /* 0% 구간에서 visibility: hidden 상태를 5% 구간에서 보이는 상태로 전환 */ opacity: 1; } 35%{opacity: 1;} 40%{ visibility: hidden; /* 슬라이드로 보이는 구간이 끝났으니까 투명도 0과 함께 실제로도 보이지 않는 상태로 100% 구간까지 전환 */ opacity: 0; } 100%{ opacity: 0;} } /* navi */ .menu{ /*ul*/ padding: 0; list-style: none; margin-top: 65px; /*메뉴 전체를 보기좋게 네비 중간에 정렬*/ } .menu li{ float: left; width: 25%; /*퍼센트로 주는게 정확*/ box-sizing: border-box; text-align: center; } .menu li > a{ /*MENU-1 ~4*/ border: 1px solid #000; display: block; padding: 5px; transition: 0.5s; } .menu li:hover > a{ background-color: #000; color: #fff; } .sub-menu{ display: none; /*메뉴 css 마지막 작업*/ } .sub-menu a{ display: block;/*가장 먼저 주는게 편함*/ padding: 10px; transition: 0.5s; /*부드럽게 전환*/ color: #fff; } .sub-menu a:hover{ background-color: #fff; color: #000; } .sub-back{ width: 100%; height: 200px; background-color: #000; position: absolute; right: 0; top: 100%; z-index: -1; display: none; } /* content 공지사항 갤러리 탭으로 구성*/ .tab-inner{ width: 97%; margin: auto; } .tab-inner .btn{} .tab-inner .btn a{ border: 1px solid #000; display: inline-block; width: 120px; text-align: center; padding: 3px; border-radius: 10px 10px 0 0; margin-right: -5px; background-color: #ddd; cursor: pointer; /*마우스 커서*/ border-bottom: none; margin-bottom: -1px; } .tab-inner .btn.active{ background-color: #fff; } .tabs{} .tabs div{ border: 1px solid #000; height: 160px; } .tabs .tab1{} .tabs .tab2{ display: none; /*갤러리는 태초 안보이는 상태 유지*/ } js /*tab*/ $('.btn a:first-child').click(function(){ $('.tab1').show() $('.tab2').hide() }) $('.btn a:last-child').click(function(){ $('.tab1').show() $('.tab2').hide() }) tab1 > tab2 글자가 전환되는게 안보이네요 ㅠㅠ
-
미해결실전! 웹사이트제작! Step by Step! (대방산업_InteractiveWeb)
스크롤시 애니메이트효과
안녕하세요. 강의 잘 듣고있는데요. 스플리팅js 적용도 잘 해줬는데 스크롤시 애니메이트적용이 안되요 ㅜ 처음 새로고침할때만 적용이 됩니다 ㅜ
-
미해결캐글 Advanced 머신러닝 실전 박치기
이 작업을 매번 해야 되는건가요~?
선생님 강의를 완강하고 끝날 때 해야 하는 건가요? 아니면 이 작업은 구글클라우드를 사용하고 다 쓴다음에 마지막에 항상 해줘야 하는 작업인가요..? 클라우드 처음 써봐서 ..정말 좀 어렵네요..ㅜㅜ
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
npm run serve 종료법
제목 그대로인데, npm run serve로 로컬 서버를 실행시켰다면 반대로 종료 명령어는 무엇인가요? 기초강의때 본 적은 있었는데, 갑자기 기억이 가물가물해졌습니다. 그래도 답변으로 받으면 나중에 또 찾기 쉬울 것 같아 질문 남깁니다!
-
미해결Vue.js 제대로 배워볼래?(Vue.js 프로젝트 투입 일주일 전)
CORS error
CORS error를 피하기 위한 방법으로 devServer: { proxy: ".....", } 이렇게 프락시 서버를 설정해서 피했는데, 근데 이것은 Development 모드 일때만 적용되는 된다고 생각합니다. 실제 Production에서는 dist 만 배포될텐데 Production 에서는 어떤 해결방법이 있나여???
-
미해결[리뉴얼] Node.js 교과서 - 기본부터 프로젝트 실습까지
멀티스레드에대해
멀티스레드는 pm2에서 클러스터방식으로 돌리는것과 동일 한 개념인가요? 제가 요번에 주니어개발자로 들어온지 3개월됐는데 혼자서 서버구축부터 인프라까지 담당,백엔드개발까지다하고있고 퍼블리셔한분계신 상황입니다. . 이 강의를 보면서 도움이 많이되었으면좋겠습니다. 원래 php7,클래식asp만 보다가 입사해서 nodejs로 개발한지 두달되었는데 nodejs는 개발경험이없어요(대표님께서 webrtc스트리밍과 채팅을 원하십니다) 미들웨어의 개념을 간과하고 api들을 맨윗단에 모아두고 페이지들은 req.session.authenticated=true 로만 처리하고 res.locals.session = req.session이렇게 save처리만해서인지(php처럼 클라이언트 사이드에서 ajax통신을통해 app.use(api/v1/login_ok) 이런route방식으로 mysql쿼리로 확인받고 처리했습니다.. 잘되다가도 비동기통신중에 undefined로 처리되는 오류때문에 새로 공부하고있습니다(저장된 세션 데이터로 mysql테이블에서 조회하는방식인데 뭐가 어디서부터 잘못인지 아직 제대로 못찾았습니다. ERR_RESPONSE_EMPTY나 mysql에러로인한?PROTOCOL이 멈추는 현상이있었어요). 특히 세션을.. local로 저장한것이 요번 문제의 핵심이아닌가싶어요. nodejs는 apache위에다 reverse proxy로 돌리는 것은 안좋은 방식인가요? 물어볼수있는 사수나 후배가없고 지식을 공유할곳이없네요..제가운영하려는 사이트는 강의실에서 videojs로 송출영상을보면서 로그를 1분마다 setInterval로 ajax로 로그를 찍는방식인데 이방식이면 멀티스레드를써야될까요?
-
미해결모던 안드로이드 - 코틀린과 Jetpack 활용
라이브 데이터 + 데이터 바인딩 질문드립니다!
var todos : LiveData<List<Todo>> = getAll() android:text="@{viewModel.todos.toString()}"궁금한 부분이 todos가 라이브 데이터여서 관찰이 가능한데 데이터가 바뀌는 게 감지가 되면, getAll() 함수가 실행되는 구조라고 이해했습니다. getAll() 함수에 로그를 남겼는데 데이터를 추가해도 getAll()에 남긴 로그가 찍히지않아서 질문드립니다..!
