묻고 답해요
160만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결코로나맵 개발자와 함께하는 지도서비스 만들기 1
마커 색깔변경
안녕하세요 좋은 강의 감사합니다~ㅎㅎ 다름이 아니고 마커를 green색 뿐만 아니라, 다른색깔도 적용해보고 싶습니다. css파일의 .marker를 red;색상으로 바꾸면 전체 마커가 red로 바뀌게 되는데, .marker2 이런식으로 추가하게 되면 index.ejs의 for문은 어떻게 바껴야 하나요? marker2를 다루는 for문이 추가되어야 하는건가요?
-
미해결타입스크립트 입문 - 기초부터 실전까지
username.innerText = user[0].name 부분에서 값이 안불러와 지는 경우 어케해야되나요?
username.innerText = user[0].name 부분에서 값이 화면에 안불러와 지는 경우 어케해야되나요? 콘솔창에서는 TypeError: Cannot read property 'name' of undefined at app.js:20 해당부분이 타입이 맞지않다고 나옵니다.
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
자바스크립트용 중급알고리즘강의언제나오나요
우선 좋은강의 감사합니다 c++로 중급알고리즘강의나왔던데 자바스크립트로는 언제나오는지궁금합니다
-
해결됨Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
Destructuring 을 배웠었나요...?
제가 입문부터 강의를 보고 있습니다. 지금 강의를 보면 Destructuring 을 말씀하셨다고 하셨는데.. 어느 강의에서 말씀하셨었나요..? 참고 URL 외엔 설명된 부분이 없는 것 같아서요.. 참고 URL 주신 사이트를 보면 context 처럼 response 를 인자로 무조건? 당연하게 받기 때문에 context.commit => { commit } response.data => { data } 로 표현한게 맞을까요?? 제가 이해한 부분이 맞는 지... 궁금해서 문의합니다.
-
미해결반응형 웹사이트 포트폴리오(App Official Landing Website)
선생님 질문에 대한 신속한 답변 감사합니다! 그런데 ㅠㅠ 슬라이더가 작동이 안되고 이미지가 왜 저렇게 되는지 모르겠어요!
원인을 모르겠어요 <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>StarUp Mate : App Official Landing</title> <link rel="icon" href="images/logo-favicon.png"> <!---jquery CDN---> <script src="http:s//code.jquery.com/jquery-3.5.1.min.js"></script> <!--Slick slider--> <link rel="stylesheet" href="js/slick/slick/slick-theme.css"> <link rel="stylesheet" href="js/slick/slick/slick.css"> <script src="js/slick/slick.min.js"></script> <!-- Custom CSS & JS --> <link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="responsive.css"> <script src="custom.js"></script> </head> <body> <header> <div class="header-inner"> <div class="logo"> <a href="#none"><img src="images/logo.png" alt=""></a> </div> <div class="gnb"> <a href="#none">CEO 인사말</a> <a href="#none">서비스 특징</a> <a href="#none">자주 묻는 질문들</a> <a href="#none">경영비전</a> <a href="#none">사용자 리뷰</a> <a href="#none">앱 사용자 가이드</a> <a href="#none">최신소식</a> </div> </div> </header> <!-- Section : welcome --> <section class="welcome"> <div class="slideshow"> <img src="images/slide-welcome-01.png"> <img src="images/slide-welcome-02.png"> <img src="images/slide-welcome-03.png"> </div> <div class="welcome-heading"> <span>창의적인 아이디어를 만드는 가장 빠른 방법</span> <h1> An idea solution of startup for your <em id="typing"></em> </h1> <p> 스타트업 메이트 앱이 여러분의 최상의 스타트업 구축을 위해 창의적인 아이디어를 제공하는 데 최선을 다하겠습니다. </p> <div class="welcome-btns"> <a href="#none" class="btn start">CEO 시작하기</a> <a href="#none" class="btn guide">사용자 가이드</a> </div> </div> <div class="mouse"> <span class="wheele"></span> </div> </section> <!---.ceo-access---> <section class="ceo-access"> </section> <!---.banner---> <section class="banner"> </section> <!---.feature---> <section class="feature"> </section> <!---.vision---> <section class="vision"> </section> <!---.faq---> <section class="faq"> </section> <!---.review---> <section class="review"> </section> <!---.focus---> <section class="focus"> </section> <!---.guide---> <section class="guide"> </section> <!---.news---> <section class="news"> </section> <footer> </footer> </body> </html> css /* Fontawesome 4.7 */ @import url('https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'); /* XEION CDN */ @import url('http://cdn.jsdelivr.net/npm/xeicon@2.3.3/xeicon.min.css'); /* Web Fonts - Source Sans Pro */ @import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@200;300;400;600;700;900&display=swap'); /* font-family: 'Source Sans Pro', sans-serif; */ /* Web Fonts - NoonNoo */ @font-face { font-family: 'NEXON Lv2 Gothic'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON Lv2 Gothic.woff') format('woff'); font-weight: normal; font-style: normal; } /* Reset CSS */ * { box-sizing: border-box; } a { text-decoration: none; color: #222; } button, input { outline: none; } h1,h2,h3,h4,h5,h6 { margin-top: 0; font-weight: normal; line-height: 1.5em; } /* Default CSS */ body { font-family: 'NEXON Lv2 Gothic', sans-serif; font-size: 18px; line-height: 1.7em; margin: 0; background-color: #fff; color: #222; } /*########header#########*/ header{ position: fixed; width:100%; z-index: 100; } .header-inner{ width:1300px; margin: auto; overflow: hidden; padding-top: 30px; padding-bottom: 15px; } .logo{ float: left; } .logo img{ margin-top: -7px; } .gnb{ float: right; } .gnb a{ margin: 10px; font-size: 16px; } /* ################# section : welcome ################# */ .welcome { /* border: 5px solid #000; */ height: 90vh; position: relative; } .slideshow {} .welcome-heading { position: absolute; top: 50%; transform: translateY(-50%);/*수직으로 섹션을 기준으로 정중앙에 옴*/ left: 200px; text-align: center; width: 750px; } .welcome-heading span { font-size: 24px; } .welcome-heading h1 { font-family: 'Source Sans Pro', sans-serif; font-size: 60px; font-weight: 600; line-height: 1.2em; margin-bottom: 30px; margin-top: 15px; } .welcome-heading h1 em { display: block; font-style: normal; color: #eb4d4b; } .welcome-heading p { padding: 0 100px; margin-bottom: 50px; } .welcome-btns {} .btn { display: inline-block; width: 160px; padding: 8px; color: #fff; border-radius: 5px; margin: 5px; transition: 0.5s; } .btn:hover { box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); transform: translateY(-5px); } .btn.start { background-color: #0abde3; } .btn.guide { background-color: #fff; color: #222; } /* Mouse Wheele */ .mouse { border: 2px solid #fff; position: absolute; width: 32px; height: 45px; border-radius: 30px; bottom: 100px; left: 250px; } .wheele { position: absolute; width: 4px; height: 15px; background-color: #fff; border-radius: 5px; left: 12px; top: 10px; animation: wheele 1.5s linear infinite; } @keyframes wheele { 0% { top: 10px; } 50% { top: 20px; } 100% { top: 10px; } } /* ▦▦▦▦▦▦▦▦▦ Slick Custom CSS ▦▦▦▦▦▦▦▦▦ */ .slideshow .slick-arrow { border: 1px solid #000; display: none !important; } .slideshow * { outline: none; } jquery $(function(){ /* Slick Slider - Welcome */ $('.slideshow').slick({ infinite: true, dots: false, autoplay: true, autoplaySpeed: 2000, fade: true, speed: 1000, pauseOnHover: false });
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
자막...
질문은 아니고 이번 강의 안에 들어가는 자막에 유독 오타도 많고 크기가 커서 수정이 필요해보입니다.
-
미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
이제는 자동링크가 모두 되는것 같아요.
파스칼, 케밥 모두 링크로 연결되어보여지는데 파스칼 유지해도 좋은것 인가요?
-
미해결함수형 프로그래밍과 JavaScript ES6+ 응용편
"안전한 합성에 대해" 강의 관련해서 질문드립니다
먼저, 덕분에 함수형 프로그래밍에 조금씩 친숙해지고 있어서 너무 감사합니다. 다름 아니라, "안전한 합성에 대해" 강의 관련해서 궁금한 점이 있어서 질문드립니다~ "안전한 합성에 대해" 강의에서 에러가 터지지 않게 배열로 만들어 안전하게 합성한다고 하셨고 예전 feConf에서 유인동님의 "ES6+ 비동기 프로그래밍과 실전 에러 핸들링" 영상에서는 에러를 뿜어내는게 좋다고 말씀하셨는데, 에러를 뿜는게 좋으면, map을 이용해서 만드는 의미가 어떤게 있나 라는 궁금증이 들더라구요. 어떤 맥락에서는 에러를 뿜는게 좋고, 어떤 맥락에서는 map을 이용해서 에러를 뿜지 않는게 좋은지 궁금합니다.
-
해결됨애플 웹사이트 인터랙션 클론!
비디오에 맞춰 텍스트가 나타나는 타이밍 질문입니다
안녕하세요 선생님 강의 잘 듣고있습니다!! 다름이 아니라 스크롤 섹션 2의 경우에는 비디오 타이밍에 맞춰 텍스트가 나오는데 그 타이밍 설정은 직접 콘솔로 scrollRatio 값을 확인해가면서 정하면 되는걸까요??
-
해결됨모던 자바스크립트(ES6+) 기본
[강의자입니다] 브라우저 디버거 창의 오른쪽에 let, const 변수 표시
강의를 만드는 시점에는 let 변수와 const 변수가 브라우저 디버거 창의 오른쪽에 표시되지 않았으나, 2021.02.13 기준, 질문을 받고 확인해보니 표시됩니다. 변경되었습니다.표시되더라도 변수 앞에서 호이스팅으로 let 변수, const 변수를 사용할 수 없으며 에러가 발생합니다만, 블록에 작성된 변수를 표시하여 사용의 편리를 제공하기 위한 것으로 생각됩니다. 바로 아래 질문에 화면 캡처가 있으니 참조하기 바랍니다.
-
해결됨애플 웹사이트 인터랙션 클론!
스크롤 이벤트 시작하는 위치 질문입니다
안녕하세요 선생님 강의 잘 듣고 있습니다. 다름이 아니라 스크롤 이벤트를 시작하는 위치 구하는 부분에서 이벤트가 실행될 scroll-section의 offsetTop으로 구하는 것과 이벤트가 실행될 scroll-section 위에 존재하는 scroll-section들의 높이 합으로 구하는 것이 차이가 있는지 궁금합니다.
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃허브 권한 요청드립니다~
인프런 아이디 : itsonlyreport@gmail.com인프런 이메일 : itsonlyreport@gmail.com깃헙 아이디 : itsonlyreport@gmail.com깃헙 Username : itsonlyreport 입니다. 감사합니다~
-
해결됨타입스크립트 입문 - 기초부터 실전까지
compile과 transcompile
수업 내용에서 보면 compile이라고 하셨는데, 또 어디서는 transcompile이라는 용어를 사용하더라구요 두가지의 차이점과 어떤게 맞는건지 알고싶습니다 판교님!
-
미해결자바스크립트 비기너: 튼튼한 기본 만들기
console.log((5*10 % (2*2.3*10))/10); 에서 2를 왜 곱하나요?
[3:28] 강의에서 console.log((5*10 % (2*2.3*10))/10); 와 console.log((5*10 % (2.3*10))/10); 의 결과가 모두 0.4가 나옵니다. 제 생각엔 2를 곱하지 않아야 할 것 같은데요, 어차피 나머지를 구하는 것이니 2를 곱해도 결과가 같을 것이기 때문에 곱하신 건가요?
-
미해결풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]
안녕하세요 선생님 let , const 질문있습니다
안녕하세요 선생님 강의 너무 잘듣고있습니다. 다름이 아니라 지난 강의에서 와 이번강의를보고 let 과 const 는 블록스코프 할당시 사용하고 const는 상수처럼 한번 초기화되면 재 초기화 할수없다는것도 알겠습니다. 그런데 언제 let 을 쓰고 const 를 써야하는 지 감이오질않습니다 .. 그냥 let으로 코드를 다짜버리면 불이익이나 메모리 측면에서 손해가 있을까요? 죄송스럽지만 언제 let 을쓰고 const 를 써야하는지 예시를 부탁드려도 될까요? 감사합니다 :)
-
해결됨인터랙티브 웹 개발 제대로 시작하기
클릭 이벤트 질문입니다.
안녕하세요, 선생님^^ 이번 강의에서 나온 기능을 활용해서 버튼을 누르면 버튼과 상자의 색이 바뀌는 기능을 만들어봤는데요. 버튼과 박스를 하나의 부모 요소에 포함시키지 않으니 currneItem 변수를 할당하는 것이 너무 어렵습니다ㅜㅜ https://jsfiddle.net/yfrhv1u5/8/ 위의 코드와 같이하면 currentItem에 btn이 box로 재할당 되어서 원하는 기능 구현이 되지 않고 https://jsfiddle.net/ywmpLdvc/5/ 위의 코드와 같이 currentItems를 배열로 만들어서 값을 저장하면 원하는 기능이 구현은 되는데 active, inative 함수로 분리하는 방법을 모르겠습니다ㅜㅜㅜ 혼자 고민해봐도 모르겠어서 질문 드립니다.ㅜㅜ 답변 주시면 감사하겠습니다
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
영상에 갑자기 자막이 같이 나와요
소리랑 안 맞기도 하고 화면 밑부분을 보여주실 때 자막에 가려서 안 보입니다ㅜ
-
미해결Vue.js 시작하기 - Age of Vue.js
data 객체 안 객체에서 this 사용하기
vue-cli에서 data에 이중객체 구조로 만들 때 this가 통하지 않는데 이럴땐 어떻게 해야하나요? 아래의 그림은 data의 chartData 객체에서 label 값으로 computed의 tagNames를 사용하려고 한 부분인데요, chartData가 이미 객체라서 그런지 this를 하면 뷰 인스턴스를 가리키지 않는 것 같습니다. 그래서 tagNames도 사용이 안되구요.
-
해결됨자바스크립트 비기너: 튼튼한 기본 만들기
인스턴스 생성 가능 여부 기준에 대하여.
prototype 값 존재 여부가 인스턴스 생성 가능 여부를 결정한다고 설명하셨는데 다음과 같은 코드가 동작하는 이유는 무엇인가요? function Test() {}; Test.prototype = undefined; var t = new Test(); // 객체 생성 console.log(t); // 객체 출력
-
해결됨함수형 프로그래밍과 JavaScript ES6+
for in문은 [Symbol.iterator]없이 순회를 할 수 있는 이유가 무엇인가요?
[Symbol.iterator]가 존재하지 않기에 for in문을 사용하는 것까진 이해를 했습니다! 실제 로그를 찍어봐도 undefined로 정의되지 않았더라구요. 어떤 것을 이용해서 순회를 진행하는지 알 수 있을까요? 감사합니다
