172만명의 커뮤니티!! 함께 토론해봐요.
미해결
자바스크립트 제대로 배워볼래?
clearInterval은 setInterval을 중단하는 내장 함수입니다. 아래 setInterval를 i 가 3일 때 clearInterval 함수를 삽입하여 중단하기 위해서 var i = 0; var fnc = setInterval(function () { console.log("3초마다 프로그램 실행 - " + i); i++; }, 3000); var i = 0; var fnc = setInterval(function () { if (i == 3) { clearInterval(fnc); } console.log("3초마다 프로그램 실행 - " + i); i++; }, 3000); 위와 같이 작성을 했습니다. i가 3일 경우에는 clearInterval에 의해 setInterval이 중단됐기 때문에 아래 console.log("3초마다 프로그램 실행 - " + i)도 실행되지 않아 콘솔창을 실행했을 때 "3초마다 프로그램 실행 - 2"까지만 나오고 멈출거라고 생각했는데, "3초마다 프로그램 실행 - 3"이 나와 왜 그런지 질문 드립니다..!
2023-12-05T12:33:15.875Z
댓글 1
좋아요 0
조회수 252
해결됨
자바스크립트 제대로 배워볼래?
set 함수를 이용해 현재 년도, 월, 일, 시간, 분, 초 등을 설정할 수 있다고 배웠습니다. var day = new Date(); day.setFullYear(2020); console.log(day); // Sat Dec 05 2020 14:51:11 GMT+0900 (한국 표준시) 수업 내용처럼 코드를 작성하면 년도 값이 달라져서 나오는데, 아래 코드처럼 작성하면 "912837772073" 이라는 결과가 나옵니다. 두 코드의 차이가 무엇인지, 어떤 점이 잘못되어 해당 결과 값이 나오는지 궁금합니다..! var day = new Date(); console.log(day); var day2 = day.setFullYear(1998); console.log(day2);
강두희
2023-12-05T06:03:53.750Z
댓글 1
좋아요 0
조회수 315
미해결
백엔드 개발자에 의한, 백엔드 개발자들을 위한 프론트엔드 강의 - 기본편
안녕하세요~ 백엔드를 위한 프론트 강의에서 꿀팁 잘 얻어가고 있습니다~! 다름이 아니라 JSON 강의에서 7분 53초 부분에 질문이 있습니다. obj === objStr으로 동일성 비교하는 부분을 보여주셨는데, returnObj를 objStr로 오타나신건가 싶어서요..!
HTML/CSS javascript bootstrap
yosongsong
2023-12-04T23:38:32.863Z
댓글 1
좋아요 1
조회수 320
해결됨
자바스크립트 제대로 배워볼래?
Boolean 내장 함수에서, 변수에 문자열을 입력하고 boolean으로 출력하면 1이 아닌 이외의 모든 것은 false로 출력된다고 이해했습니다. var x = ""; console.log(Boolean(x)); // false 출력 위의 코드처럼요! 그런데 아래 코드처럼 문자열을 입력하고 실행하면, 1이 아닌 다른 값이 들어갔기 때문에 false가 출력될 것이라고 생각했는데 true가 출력돼서 왜 그런지 질문드립니다! var y = "안녕하세요"; console.log(Boolean(y)); // true 출력 문자열과 마찬가지로 숫자도 0이외의 다른 숫자(양수, 음수, 소수 등..)를 입력하고 boolean으로 실행했을 때 전부 true로 나오는데, 1이 아닌 것은 모두 false라고 배워서 잘 이해가 가지 않아 질문드렸습니다.
강두희
2023-12-04T12:37:51.887Z
댓글 1
좋아요 0
조회수 349
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
제가 scss로 인강을 듣는데 16:00분쯤 .active 적용이 안돼서 진도를 못 나가고 있어요 ㅜㅠ 그 .active를 나중에 jquery addClass로 넣으려고 미리 스타일에 .btn li.active{ background-color: #fff; border-top: 2px solid crimson; } .tabs div.active{ display: block; } 이렇게 쓰잖아요 근데 전혀 적용이 안됩니다 개발자 도구로 열어서 봐도 취소선이 찍혀 있더라고요 다른 것들은 다 적용이 되는데 active 넣은 것만 적용이 안돼요 ,, 도대체 어떻게 해야 할 지 모르겠네요 ㅜㅜㅠ 코드 전문 첨부합니다,, <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>04 탭 메뉴 콘텐츠- 스타일 02(실전 제작)</title> <link rel="stylesheet" href="04 탭 메뉴 콘텐츠- 스타일 02(실전 제작).css"> <!-- jQuery CDN --> <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <!-- jQuery UI CDN --> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script> </head> <body> <section> <div class="heading"> <h1>코딩웍스, 프론트엔드 퍼블리셔 취업을 위한 실전 퍼블리싱 강좌</h1> <input type="text" placeholder="What are you looking for?"> <div class="tab-inner"> <ul class="btn"> <li data-alt="tab1" class="active">HTML5</li> <li data-alt="tab2">CSS3</li> <li data-alt="tab3">JQUERY</li> <li data-alt="tab4">JAVASCRIPT</li> <li data-alt="tab5">CSS FRAMEWORKS</li> </ul> <div class="tabs"> <div id="tab1" class="active">tab1</div> <div id="tab2">tab2</div> <div id="tab3">tab3</div> <div id="tab4">tab4</div> <div id="tab5">tab5</div> </div> </div> </div> </section> </body> </html> /* montserrat raleway roboto 폰트*/ @import url('https://fonts.googleapis.com/css2?family=Black+Han+Sans&family=Hind+Siliguri:wght@300;400;500;600;700&family=Hind:wght@300;400;500;600;700&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Noto+Sans+KR:wght@100;200;300;400;500;600;700;800;900&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap'); /* Fontawesome 4.7 */ @import url('https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'); /* Noto Sans KR 폰트 */ @import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:300,400,500,700,900&display=swap'); body{ font-family: 'Noto Sans KR' , sans-serif; color: #222; line-height: 1.5em; font-weight: 300; box-sizing: border-box; display: flex; align-items: center; justify-content: center; height: 100vh; background-color: #f4f4f4; } a{ color: #222; text-decoration: none; } section{ width: 800px; .tab-inner{ margin-top: 30px; .btn{ list-style: none; padding: 0; margin: 0; overflow: hidden; li{ float: left; // border: 1px solid #000; width: 120px; text-align: center; cursor: pointer; background-color: #eee; border-right: 1px solid #ddd; padding: 5px; border-top: 2px solid transparent; transition: 0.3s; &:last-child{ width: 170px; border-right: none; } &:hover{ background-color: #fff; border-top: 2px solid crimson; } } } .tabs{ div{ background-color: #fff; padding: 20px; box-sizing: border-box; height: 200px; display: none; } } } } .btn li.active{ background-color: #fff; border-top: 2px solid crimson; } .tabs div.active{ display: block; } @charset "UTF-8"; /* montserrat raleway roboto 폰트*/ @import url("https://fonts.googleapis.com/css2?family=Black+Han+Sans&family=Hind+Siliguri:wght@300;400;500;600;700&family=Hind:wght@300;400;500;600;700&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Noto+Sans+KR:wght@100;200;300;400;500;600;700;800;900&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"); /* Fontawesome 4.7 */ @import url("https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"); /* Noto Sans KR 폰트 */ @import url("https://fonts.googleapis.com/css?family=Noto+Sans+KR:300,400,500,700,900&display=swap"); body { font-family: "Noto Sans KR", sans-serif; color: #222; line-height: 1.5em; font-weight: 300; box-sizing: border-box; display: flex; align-items: center; justify-content: center; height: 100vh; background-color: #f4f4f4; } a { color: #222; text-decoration: none; } section { width: 800px; } section .tab-inner { margin-top: 30px; } section .tab-inner .btn { list-style: none; padding: 0; margin: 0; overflow: hidden; } section .tab-inner .btn li { float: left; width: 120px; text-align: center; cursor: pointer; background-color: #eee; border-right: 1px solid #ddd; padding: 5px; border-top: 2px solid transparent; transition: 0.3s; } section .tab-inner .btn li:last-child { width: 170px; border-right: none; } section .tab-inner .btn li:hover { background-color: #fff; border-top: 2px solid crimson; } section .tab-inner .tabs div { background-color: #fff; padding: 20px; box-sizing: border-box; height: 200px; display: none; } .btn li.active { background-color: #fff; border-top: 2px solid crimson; } .tabs div.active { display: block; } ㅜㅠㅜㅠ
tkddnjs1018
2023-12-04T11:51:02.378Z
댓글 2
좋아요 1
조회수 581
미해결
Sigil(시길)을 이용하여 전자책 만들기
교안 중 16강 내용인 alice_dynamic.epub 파일이 열리지 않습니다. Sigil로 열려고 하면 아래 오류가 뜹니다. OPF 파일을 읽을 수 없습니다. Line: 4 Column 14 - 네임스페이스 접두사 'dc'이(가) 선언되지 않았음 정상적인 파일을 올려 주시거나 수정할 수 있는 방법을 알려주실 수 있을까요?
사랑스러운 캥거루
2023-12-04T08:49:41.476Z
댓글 1
좋아요 0
조회수 309
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
안녕하세요. http://brackets.io 에서 다운로드 받아 설치 했는데요 파일명 변경 시 이미지처럼 에러가 뜨는데 이유를 알 수가 있을까요?
sweety0514
2023-12-04T05:09:09.466Z
댓글 1
좋아요 1
조회수 256
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
선생님 좋은강의 항상 감사합니다. javascript말고 React 프로젝트에서도 지금 배우는것 처럼 jquery이용해서 만든 UI를 적용 가능한지 궁금합니다!
이종주
2023-12-04T01:30:55.935Z
댓글 2
좋아요 1
조회수 261
미해결
반응형 웹사이트 포트폴리오(App Official Landing Website)
아래 처럼 css 적용하고 html도 강의데로 넣어줬는데... 왜 애니메이션이 적용되지 않을까요 .ltr { animation: ltr o.5s linear both; } .rtl { animation: rtl o.5s linear both; } .utd { animation: utd o.5s linear both; } @keyframes ltr { 0% { transform: translateX(-100px); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } } @keyframes rtl { 0% { transform: translateX(100px); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } } @keyframes utd { 0% { transform: translateY(-100px); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } }
taylorkimjw1
2023-12-03T13:10:05.723Z
댓글 1
좋아요 1
조회수 381
해결됨
[코드캠프] 시작은 프리캠프
이게 뜨면 어떡하나요?
지 민
2023-12-03T08:48:46.386Z
댓글 1
좋아요 0
조회수 234
해결됨
[코드캠프] 강력한 CSS
1.css를 설정해줄 때 display: flex; 를 하지 않으면 트렌지션이 적용이 안되던데 이유가 뭔가요? 같은 .button1에 .transition: width 0.3s ease랑 transition: color 0.3s ease를 사용하면 계속해서 오류 메세지가 뜨던데 같이 못 쓰는건가요? 답변 부탁드립니다!
지 민
2023-12-03T08:04:24.559Z
댓글 1
좋아요 0
조회수 369
미해결
반응형 웹사이트 포트폴리오(App Official Landing Website)
각 섹션별 모두 완성하였습니다. Section Display의 각 섹션을 하나씩 풀어서 볼 때는 문제가 없습니다. 하지만 모두 주석 처리하여 볼 때 문제가 있습니다. .faq 섹션의 accordian이 작동하지 않습니다. 위 각 항목 눌러지지 않아요. .guide 섹션에서 close modal이 작동하지 않습니다. 위 X버튼이 작동하지를 않아요.
taylorkimjw1
2023-12-03T07:51:48.499Z
댓글 3
좋아요 1
조회수 433
미해결
웹 애니메이션의 새로운 표준, Web Animations API
폰트와 폰트 색상이 예뻐서 그러는데 어떤거 사용 하나요? 그리고 vscode 다크모드에서도 폰트 색상이 동일하게 적용 되나요? 키보드 정보도 알고 싶습니다
HTML/CSS javascript 인터랙티브-웹 frontend web-animations-api
ㅌㅇ
2023-12-02T04:11:54.474Z
댓글 2
좋아요 0
조회수 682
해결됨
[코드캠프] 시작은 프리캠프
좋은 강의 들려주셔서 항상 감사합니다 선생님. 다름이 아니라 아무리 강의를 뒤져봐도 피그마 링크가 보이질 않는데.. 혹시 링크가 어디에 있는지 알려주실 수 있나요?
minchoi9979
2023-12-01T13:46:47.532Z
댓글 1
좋아요 0
조회수 331
미해결
<M.B.I.T> 테스트 페이지 만들기! with Django
마지막 단계에서 제출버튼 클릭하니 위와 같은 오류가 발생합니다. 어떻게 해결해야해 하나요 ?
김주희
2023-12-01T01:08:43.248Z
댓글 1
좋아요 0
조회수 259
미해결
비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
axios로 dataSet을 받아오는 과정에서 undefined오류가 뜨는데 무엇이 문제인가요? 사진은 개발자도구에서 콘솔창에 뜨는 오류랑 오류가 발생했다고 하는 98줄의 코드입니다
HTML/CSS javascript aws git mysql rest-api github
2023-11-30T14:34:03.008Z
댓글 0
좋아요 0
조회수 307
미해결
[웹 개발 풀스택 코스] HTML&CSS 기초
안녕하세요. 24:14언저리의 수업을 보면 absolute함수가 부모요소중 relative로 설정된 부모요소에 대한 상대적위치라고 하시면서 relative요소를 움직이시면서 보여주는데 보면 그 안에있는 general 함수가 적용된 일반요소도 같이 움직이는것이 보입니다. 부모요소가 커다란 집합체로 부모요소가 움직이면 그안에 속해있는 자식요소들도 원래 같이 움직이는거아닌가요??
김민영
2023-11-30T11:19:58.264Z
댓글 1
좋아요 1
조회수 338
미해결
Airflow 마스터 클래스
이전까지는 도커 서비스를 잘 수행이 됐었습니다. 이번 강의에서 docker-compose.yaml파일을 수정 후 서비스를 내렸다가 다시 올리려고 하니 사진처럼 해당 로그까지만 찍힌 후에 더 이상 진행이 되지 않고 있습니다. 계속 기다려봐도 상태가 그대로인 것을 보아하니 어딘가 문제가 생긴 것 같습니다. yaml파일은 올려주신 파일과 비교해봤을 때 오타나 다른 문제는 없는 것 같습니다. 원래의 docker-compose.yaml로 교체하면 잘 실행이 되는 상태입니다. 뭐가 문제일까요?
재윤
2023-11-30T08:36:22.609Z
댓글 2
좋아요 0
조회수 464
미해결
웹 애니메이션의 새로운 표준, Web Animations API
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style> .box { width: 100px; height: 100px; background: coral; transition: 1s; } body { margin: 0; } .box-action { transform: translateX(300px); background: blue; } </style> </head> <body> <div class="box"></div> <script> const box = document.querySelector(".box"); box.addEventListener("click", () => { box.classList.toggle("box-action"); }); </script> </body> </html> 안녕하세요 강사님. toggle 해서 클릭 하면 상자가 300px 인 곳으로 이동하는 건 이해 하였는데, 다시 클릭 하면 왜 기존의 위치로 가는건가요? css에서는 가로 세로 100px 이라고만 했는데.... 이해가 가지 않습니다.
HTML/CSS javascript 인터랙티브-웹 frontend web-animations-api
ㅌㅇ
2023-11-30T05:17:15.709Z
댓글 1
좋아요 0
조회수 303
미해결
비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
우분투 파일 경로를 바꾸기 전까지는 ip주소로 접근했을 때 Welcon to nignx! 까지는 잘 뜨는데 이렇게 경로를 바꾸고 service nginx restart 명령어를 입력하면 이런 메세지가 뜨면서 다시 ip주소로 접속하려 하면 이렇게 사이트에 연결할 수 없다는 메세지가 나옵니다 어떻게 해야할까요...하
HTML/CSS javascript aws git mysql rest-api github
밍ㅇ밍
2023-11-29T19:35:18.549Z
댓글 1
좋아요 0
조회수 739
