묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
certbot 실행 오류
안녕하세요 선생님certbot 설치 후 실행을 하면 오류가 납니다.어디서부터 다시 해봐야하는지 모르겠습니다 오류내용Challenge failed for domain hahahagood.shophttp-01 challenge for hahahagood.shopCleaning up challengesSome challenges have failed.IMPORTANT NOTES: - The following errors were reported by the server: Domain: hahahagood.shop Type: dns Detail: no valid A records found for hahahagood.shop; no valid AAAA records found for hahahagood.shoproot@ip-172-31-46-56:/home/ubuntu#
-
해결됨[코드캠프] 훈훈한 Javascript
openweather api 2.5 관련 질문드립니다
안녕하세요 수업 잘따라 가고있었습니다만2.5 버전 사용시에 계속 400 에러가 떠서 질문드립니다.질문글들을 저보다 빨리 수강을 하신분들은 잘되시는것같은데요.저는 계정을 생성한지 이틀을 기다려도 계속 400 에러가떠서 구글링을 좀해보니 더이상 새로 생성된 계정에는 2.5버전 api 키를 주지않는것같더라구요.3.0버전은 구독제이기때문에 구독하지않은 계정에서는 작동 하지않구요 ㅠ마지막 강의만 남았는데 여기서 진행이 막히니 슬프네요 ㅠ 혹시 대안방안 같은건 있을까요?
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
dummyData 받아오는 오류가 있습니다.
페이지 구현- 홈(/) 파트에서 17:00분 정도에 useEffect를 사용하여 data를 콘솔에 찍어보는데 그전까지는 home component까지는 더미데이터가 잘 받아와졌는데 저부분에서 콘솔에서 이렇게 빈배열로 넘어와져요계속 코드를 몇번씩이나 강의돌려보고 검토했지만 도저히 제눈엔 보이지않아 강사님께 질문드립니다.깃허브에 코드올려놨습니다. 한번 검토해주시면 감사하겠습니다!!https://github.com/eunsoo-cho/emotion-Diart.git
-
미해결HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌2)
JavaScript & jQuery - 푸터 패밀리사이트 셀렉트 커스텀 스타일(2)
■ 질문 남기실 때 꼭! 참고해주세요.- 먼저 유사한 질문이 있었는지 검색해주세요.- 궁금한 부분이 있으시면 해당 강의의 타임라인 부분을 표시해주시면 좋습니다.- HTML, CSS, JQUERY 코드 소스를 텍스트 형태로 첨부해주시고 스크린샷도 첨부해주세요.- 다운로드가 필요한 파일은 해당 강의의 마지막 섹션에 모두 있습니다. 해당 강의 응용하다 막히는 부분이 있어 질문 드립니다. 이 강의에 부분을 메뉴에서도 활용 할 수 있을것 같아 아래와 같이 만들어 보았습니다. HTML <header> <div class="gnb"> <div class="search_menu"> <div class="dropdown"> <div class="nav1 title">MENU1-1</div> <ul class="sub_nav1 sub_nav"> <li><a href="#none">MENUI1-1</a></li> <li><a href="#none">MENUI1-2</a></li> <li><a href="#none">MENUI1-3</a></li> <li><a href="#none">MENUI1-4</a></li> </ul> </div> <div class="dropdown"> <div class="nav2 title">MENU2-1</div> <ul class="sub_nav2 sub_nav"> <li><a href="#none">MENU2-1</a></li> <li><a href="#none">MENU2-2</a></li> <li><a href="#none">MENU2-3</a></li> <li><a href="#none">MENU2-4</a></li> </ul> </div> <div class="dropdown"> <div class="nav3 title">MENU3-1</div> <ul class="sub_nav3 sub_nav"> <li><a href="#none">MENU3-1</a></li> <li><a href="#none">MENU3-2</a></li> <li><a href="#none">MENU3-3</a></li> <li><a href="#none">MENU3-4</a></li> </ul> </div> </div> </div> </header>CSS@import url('https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'); * { padding: 0; margin: 0; list-style: none; font-size: 10px; } a{ text-decoration: none; } header .search_menu { background-color: #9c9388; display: flex; } header .selectbox { position: relative; border-right: 1px solid #c9c1b7; } header .selectbox:last-child{ border:0; } header .selectbox .select{ width: 88px; height: 35px; padding:10px 12px; font-size: 1.2rem; } header .selectbox:last-child .select { width: 100px; } .dropdown { width: 8.4rem; cursor: pointer; position: relative; border-right: 1px solid #c9c1b7; } .nav1, .nav2, .nav3 { background-size: 9px; background-color: #9c9388; color: #fff; padding: 1.2rem 1rem;} .nav1::after, .nav2::after, .nav3::after{ content: '\f107'; font-family: fontawesome; position: absolute; right: 10px; font-size: 12px; line-height: 14px; } .sub_nav1, .sub_nav2, .sub_nav3 { position: absolute; list-style: none; padding:0; margin: 0; left: 0; top:100%; width: 100%; display: none; z-index: 100; } .sub_nav1 li a, .sub_nav2 li a, .sub_nav3 li a { color: #fff; display: block; padding: 7px; background: #9c9388; border-bottom: 1px solid #aaa; } .sub_nav1 li a:last-child, .sub_nav2 li a:last-child, .sub_nav3 li a:last-child { border: none; }JS 1 (정상작동) (개별적으로 class를 모두 지정하였습니다.)$('.menu li').click(function(){ $(this).children('.sub_menu').slideDown() }) $('.menu li').click(function(){ $(this).children('.sub_menu').slideUp() }) $('.nav1').click(function(){ $('.sub_nav1').stop().slideToggle() $('.sub_nav2').stop().slideUp() $('.sub_nav3').stop().slideUp() $(this).find('>ul').toggle() }) $('.sub_nav1 li').click(function(){ $(this).parent().stop().slideUp() $('.nav1').text($(this).text()) }) $('.nav2').click(function(){ $('.sub_nav2').stop().slideToggle() $('.sub_nav1').stop().slideUp() $('.sub_nav3').stop().slideUp() // $(this).find('>ul').toggle() }) $('.sub_nav2 li').click(function(){ $(this).parent().stop().slideUp() $('.nav2').text($(this).text()) }) $('.nav3').click(function(){ $('.sub_nav3').stop().slideToggle() $('.sub_nav1').stop().slideUp() $('.sub_nav2').stop().slideUp() // $(this).find('>ul').toggle() }) $('.sub_nav3 li').click(function(){ $(this).parent().stop().slideUp() $('.nav3').text($(this).text()) })JS 2 (문제의 JS) (JS1와 같은 매커니즘 코드를 줄여 작성했습니다.)//메뉴 토글 $('.title').click(function(){ $(this).siblings('.sub_nav').slideUp() $(this).next().stop().slideToggle() }) //메뉴 text 변경 $('.sub_nav li').click(function(){ $(this).parent().stop().slideUp() $(this).parent().siblings('.title').text($(this).text()) })이렇게 만들어서 메뉴1-1을 누르면 2-1과 3-1 이 들어가야하는데 3개가 모두 개별적으로 펼쳐집니다.JS 1 처럼 class를 모두 직접 지정하면 정상적으로 되는데 너무 코드가 지저분해서 간단하게 지정을 하려고 작동을 확인 한 뒤 JS 2를 만들었는데 메뉴 text 변경 되는건 잘 되는데 메뉴 토글에서 막혔습니다.$(this).siblings('.sub_nav').slideUp()이 부분이 잘못된것 같은데 아무리 고쳐보고 검색해봐도 작동이 되지 않아 이렇게 여쭤 봅니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
application에 쿠키가 안들어는 문제
안녕하세요 소셜로그인 강의 듣다가 질문드립니다.소셜로그인을 했을때 네트워크에는 쿠키가 들어오는데 어플리케이션에는 쿠키가 들어가지 않더라구요.검색해보니 credential 문제인 것같아서 아래와 같이 추가 시켜줬는데도 안들어왔습니다.밑에 @Get부분에도 추가시켜주려고 했는데 방법을 잘모르겠습니다.어떻게 하면 쿠키가 들어오게 할 수있을까요??
-
해결됨자바스크립트 ES6+ 기초 핵심 문법
QA 자동화 테스트할 때 자바스크립트와의 연계성
안녕하세요. 현직 QA 입니다. 제가 프로젝트 끝난 이후에 QA쪽을 단순 테스트에만 그치는 것이 아니라, 자동화 테스트쪽으로 영역을 좀 더 넓히고 싶은데, 자동화 테스트를 하려면 코딩도 할 줄 알아야 한다고 들었습니다.그래서 드리는 말씀인데 QA로서 자동화 테스트를 하기 위한 용도로 이 자바스크립트 강의를 들어도 상관없나요? 그 중 저는 UI쪽으로 자동화 테스트를 하고 싶습니다. 혹시 현 자바스크립트 강의 외에도 HTML/CSS 이전 강좌도 있나요?
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
이런방식으로 푸는게 더 깔끔한가요?
/* * 자신의 바로 앞 수보다 큰 수만 출력하는 프로그램을 작성하세요. 단, 첫 번째 수는 무조건 출력한다. */ function solution(integers:number[]): number[] { return integers.filter((int, index) => { if (index === 0) { return int; } if (int > integers[index - 1]) { return int; }; }); } console.log(solution([7,3,9,5,6,12]));
-
해결됨웹 애니메이션을 위한 GSAP 가이드 Part.01
노션 주소 좀 확인해주세요. 잘못되어 있는 것 같아요. 아무것도 클릭이 안됩니다.
https://productive-printer-b81.notion.site/GSAP-Basic-4c37387fe8254db4a7d14c883f8baa2d노션 주소가 이거 맞나요? 환경설정 파트 > 수업 자료 라고 되어 있는 거 클릭하면 이런 주소가 나옵니다. ..제대로 된 주소 찾느라고 다섯개 강의를 다 다시 봤는데... 흠...진도를 나갈 수가 없어요. ㅠ.ㅠ확인부탁드립니다.
-
미해결[하루 10분|Web Project] HTML/JS/CSS로 나만의 심리테스트 사이트 만들기
select 부분이 이해가 안가서 질문드립니다 ㅠ
안녕하세요. 판다님강의 열심히 듣고 있는 수강생입니다!결과 부분 진행중인데요~setTimeout안에 select를 넣어서qIdx번째 질문에서 클릭한 답이 select 배열데이터에 담기는데어째서 클릭한게 idx로 담기게 되는걸까요...? ㅠbutton을 클릭했을 때 addEventListener로 다음 질문으로 넘어가는건 알겠는데클릭한 답변이 왜 idx에 담기게 되는지 잘 이해가 안되어서요 ㅜㅜ그리고 button을 html에 안만들고 js에서 createElement로 만드신 이유가 따로있을까요..?
-
미해결자바스크립트 비기너: 튼튼한 기본 만들기
인덱스 코딩시간 문제풀이
indexOf(), lastIndexOf()를 활용한 코드 작성 문제 풀이입니다. 부족하거나 틀린점이 있다면 알려주세요!이런식으로 하는게 맞는지 문제해결방식이 헛갈리네요...!//출생날짜를 변수로 저장 var birth = "19971212"; //나이가 27살인가요? var k = birth.indexOf(1997); //출생에 제일 앞에 위치하는 년도 4자리는 앞에서부터 구해야 정확하니 indexOf를 사용하여 변수 k에 저장해준다 if(k == 0){ //년도가 인덱스 0번째로 확인된다면 원하는 년도 출생임으로 27세가 된다. console.log("27세 입니다."); }else{ //그렇지 않을 경우 다른 나이로 판단한다. console.log("27세가 아닙니다."); } //생일이 12월인지 구하시오. var i = birth.lastIndexOf(12, 4); //생일은 년도보다 뒤에 있기 때문에 lastIndexOf를 사용하되 날짜와 혼동 될 수 있으므로 2번째 파라미터를 활용해 월에 해당하는 위치부터 시작하도록 설정한다. console.log(i); if(i == 4){ //인덱스 4번째가 월에 해당하는 위치이기 때문에 해당 위치로 확인되면 12월생임을 알 수 있다. console.log("12월생입니다."); }else{ //그렇지 않을 경우 다른 월로 판단한다. console.log("12생이 아닙니다."); }
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
quiz 19 질문입니다
안녕하세요 강의 잘 듣고있습니다! 아래 퀴즈19에서 4번하다가 질문드립니다.4-a은 context.req에서 id빼와서 find한 다음에 db에 패스워드 변경하는 식으로 하면 될 것 같은데, 4-b와 4-c가 잘 이해가 안갑니다. 4-b는 현재 로그인한 유저를 조회하는 api를 만들라는 것으로 이해했는데 로그인한 정보를 어디서 가져와야하는지 잘 모르겠네요.. 4-c는 로그인한 유저를 찾은뒤 강제로 로그아웃 시키라는 것인가요? 제가 문제를 제대로 이해한게 맞는지, 어떤 식으로 접근해야 할지 알려주시면 감사하겠습니다!
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
CSRF
안녕하세요 도저히 찾아봐도... 찾을 수가 없고 답답한 나머지 멘토님께 여쭈어보려고 합니다.현재 저는 백엔드 코스와 프런트엔드 코스를 둘 다 수강 중인 학생입니다. 백엔드 코스에서 공부한 이미지 업로드를 프런트에서 공부한 이미지 불러오기를 적용하던 중 오류가 발생하여 문의드립니다.포스트맨을 통해 이미지 업로드 정상 작동되는 것을 확인하였지만 프런트 엔드와 같이 연결하여 이미지 업로드를 진행 중"This operation has been blocked as a potential Cross-Site Request Forgery (CSRF). Please either specify a 'content-type' header (with a type that is not one of application/x-www-form-urlencoded, multipart/form-data, text/plain) or provide a non-empty value for one of the following headers: x-apollo-operation-name, apollo-require-preflight\n" 이러한 원인이 설명 부탁 드립니다... ...
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
바뀐 버전의 강의에서 커리큘럼 질문
안녕하세요.바뀐 버전의 강의에서는 elastic search에 관한 내용이 없는 것 같던데 혹시 없어진 이유가 있나요??
-
미해결Vue.js 시작하기 - Age of Vue.js
해당코드에서 addNum을 하위메서드 이름으로하면안되는데 왜그런가요 increase로만바꾸면동작합니ㅏㄷ.
<div id="app"> <p>{{num}}</p> <!-- <app-header v-on:하위 컴포넌트에서 발생한 이벤트 이름="상위 컴포넌트의 메서드 이름"></app-header> --> <app-header v-on:pass="logText"></app-header> <app-content v-on:addNum="numPlus"></app-content> </div> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> var appHeader = { template: '<button v-on:click="passEvent">click me</button>', methods: { passEvent: function () { this.$emit('pass'); } } } var appContent = { template: '<button v-on:click="addNumber">add</button>', methods: { addNumber: function () { this.$emit('addNum'); } } } new Vue({ el: '#app', components: { 'app-header': appHeader, 'app-content': appContent }, methods: { logText: function () { console.log('hi'); }, numPlus: function () { this.num = this.num + 1; } }, data: { num: 10 } });
-
미해결Vue.js 시작하기 - Age of Vue.js
v-on:하위 컴포넌트에서 발생한 이벤트이름
v-on:하위 컴포넌트에서 발생한 이벤트이름이라고했는데v-on:pass="logText"더라고요근데 아래보면 var appHeader = { template: '<button v-on:click="passEvent">click me</button>', methods: { passEvent: function () { this.$emit('pass'); } } } new Vue({ el: '#app', components: { 'app-header': appHeader }, methods: { logText: function () { console.log('hi'); } }이렇게되어있는데 상위컴포넌트의 메서드이름은 logtext:function(){}하니까logtext인건알겠는데 왜 하위컴포넌트이름이 pass인가요 passEvent아니낙요?
-
해결됨mongoDB 기초부터 실무까지(feat. Node.js)
comment의 id가 생성되는 시점
선생님 안녕하세요. 강의 정말 잘듣고 있습니다. 감사드립니다.강의를 보다가 궁금한 점이 생겼는데요. 블로그에 코멘트를 넣을 때, 이렇게 했는데,const comment = new Comment({ content, user, blog }); await Promise.all([ comment.save(), Blog.updateOne({ _id: blogId }, { $push: { comments: comment } }), ]);저는 처음에 이걸 보고 comment 콜렉션에 들어가는 다큐먼트와 blog에 들어가는 comment의 Id 가 다를 거라고 생각했어요. comment의 id는 디비에 직접 삽입 된 후에 반환될 거라고 생각했습니다. 그래서 promise.all을 이용해 한번에 처리하는 게 아니라, 순차적으로 await을 붙여서 해줘야 한다고 생각했었는데요. 그런데 결과를 보니 comment의 id와 블로그에 들어가 있는 comment의 id가 같더라구요. 정말 신기했습니다. 그래서 궁금한게, comment의 id는const comment = new Comment({ content, user, blog });이 시점에서 생성되는 건가요? 아니면 다른 뭔가가 있을까요?? 궁금합니다~
-
해결됨자바스크립트 비기너: 튼튼한 기본 만들기
for문 코딩 시간 답제출
직접 코딩한 내용 제출합니다! 혹시 틀리거나 아쉬운 부분이 있다면 알려주세요//변수를 선언하여 누적될 짝수, 홀수, 전체 값이 들어갈 변수자리를 배열로 만들어줌 var odd = [], even = [], all = []; //k가 50이 될때까지 1씩 증가시켜가며 반복문 돌림 for(var k=1; k<51; k++){ //전체 값 누적을 위해 반복문이 돌아갈 때 바로 all 변수에 k값을 배열에 추가시켜줌 all.push(k); //k를 2로 나누었을 때 나머지가 0이면 짝수 if(k%2 === 0){ //짝수 값 누적을 위해 조건이 맞을경우 odd 변수에 k값을 배열에 추가시켜줌 odd.push(k); }else{ //나머지 값이 0이 아닐경우 홀수임으로 홀수 값 누적을 위해 even 변수에 k값을 배열에 추가시켜줌 even.push(k); } } console.log("누적한 짝수 값 : " + odd); console.log("누적한 홀수 값 : " + even); console.log("누적한 전체 값 : " + all);
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
WSL2로 강의 수강 시 문제점에 관하여 아래 내용여쭙고 싶어 글 남깁니다.
안녕하세요. 백엔드 과정을 수강 중인 학생입니다. WSL2로 강의 수강 시 문제점에 관하여 아래 내용여쭙고 싶어 글 남깁니다. 번거롭겠지만 답변해주시면 정말 감사하겠습니다. 현재 16GB RAM 사용 중이며 윈도우 기본 설치된 노트북을 사용 중입니다. 윈도우를 제거하고 우분투를 설치할 환경이 되지 않아서 WSL2를 설치하여 사용하려 하는데 강의를 들으면서 추후 RAM 관련 문제가 발생할 수 있을까요? ***아래 캡처는 현재 제 노트북 사양입니다***[캡처]
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
다 잘되는데 배너 슬라이드가 안돼요
배너 슬라이드 기능만 잘 되지 않습니다.최신 버전 강의 따라 하였습니다....
-
해결됨웹 프론트엔드를 위한 자바스크립트 첫걸음
북마크 추가 부분에 오류가 생겼어요.
안녕하세요!강의 잘 보고있습니다! 에러가 생겨도 찾아서 다 수정 가능했는데 이번 addEventListener 오류는 아무리 찾아봐도 왜 오류가 생기는지 이유를 모르겠어서 질문글 작성해요 ㅠㅠ 제가 어디서 잘못했을까요.. <div class="bookmark-item-add-btn">+ 북마크 추가</div> <div class="bookmark-item-input-form" id="bookmark-item-input-form"> <div class="bookmark-input"> <div class="new-bookmark-name"> <div class="label">이름</div> <input id="new-bookmark-name-input" /> </div> <div class="new-bookmark-url"> <div class="label">주소</div> <input id="new-bookmark-url-input" /> </div> </div> <div class="bookmark-item-input-btn"> <div class="cancel-btn" id="cancel-btn">취소</div> <div class="add-btn" id="add-btn">추가</div> </div> </div> </div> <script src="./js/clock.js"></script> <script src="./js/search.js"></script> <script src="./js/quote.js"></script> <script src="./js/bookmark-toggle.js"></script> <script src="./js/bookmark.js"></script> </body> </html> 아래는 bookmark.js파일이에요 const newBookmarkForm = document.getElementById("bookmark-item-input-form"); let bookmarkList = []; if (localStorage.getItem("bookmarkList")) { bookmarkList = JSON.parse(localStorage.getItem("bookmarkList")); } else { localStorage.setItem("bookmarkList", JSON.stringify(bookmarkList)); } let isAddBtnClick = false; newBookmarkForm.style.display = "none"; const newBookmarkToggle = () => { isAddBtnClick = !isAddBtnClick; isAddBtnClick ? (newBookmarkForm.style.display = "block") : (newBookmarkForm.style.display = "none"); }; document .getElementById("bookmark-item-add-btn") .addEventListener("click", newBookmarkToggle);