묻고 답해요
160만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결입문자를 위한, HTML&CSS 웹 개발 입문
html설명하실때 접속시는 e북 링크는 어디에 있나요
두고두고 보고싶은데 못찾겠어요ㅠㅠ
-
미해결구글 애드센스 수익형 워드프레스 블로그 만들기
홈페이지 메인화면에 이미지 짤림
안녕하세요 글을 작성했는데메인 화면에서 글에 작성한 이미지가 안보입니다문제가 뭔지 모르겠어요ㅜㅜ
-
미해결UIUX 포트폴리오 Part.3 - 반응형 웹 포트폴리오
폰트나 이미지사용 문의
안녕하세요 강의 듣고있는 학생입니다. 혹시 다운로드 파일에 있는 아이콘이나 폰트들취업용 개인 포트폴리오 웹사이트 만들때 사용해도 될까요?
-
미해결[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
레이어 팝업 '닫기' 가 안됩니다
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>A1~A4레이아웃 연습</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="container"> <header> <div class="logo"></div> <div class="manu"></div> </header> <div class="silde"> <div></div> </div> <div class="items"> <div class="news"> <div class="tab-inner"> <div class="btn"> <a href="#none" class="active">공지사항</a> <a href="#none">갤러리</a> </div> <div class="tabs"> <div class="tab1"> <a class="open">SNS 발송 서비스 개선작업<b>2020.01.09</b></a> <a href="#none">휴대폰 인증 서비스 개선 작업<b b>2020.01.07</b></a> <a href="#none">카드사 부분 무이자 할부 이벤트<b>2019.12.31</b></a> <a href="#none">올엣 시스템 작업 안내<b>2019.12.20</b></a> <a href="#none">휴대폰 결제 시스템 작업 안내<b>2019.12.20</b></a> </div> <div class="tab2"> <a href="#none"><img src="image/1.jpg" alt="garllery1"></a> <a href="#none"><img src="image/2.jpg" alt="garllery2"></a> <a href="#none"><img src="image/3.jpg" alt="garllery3"></a> </div> </div> </div> </div> <div class="banner"></div> <div class="nav"></div> </div> <footer> <div class="copy"> <div class="copy2"></div> <div class="copy3"></div> </div> <div class="logo2"></div> </footer> <div class="model"> <div class="model-content"> <h1>SNS비회원주문하기 종료 안내</h1> <p>안녕하세요. JUST 쇼핑몰 MD 홍길동입니다. 안타깝게도 SNS비회원 주문하기 서비스가 한달 뒤 종료될 예정입니다. 회원가입 없이 SNS계정을 이용해 그동안 제품주문을 하실수 있었는데, 금번 강화된 개인정보보호법 시행령 제 9조 (부칙 3조)에 의거, SNS를 이용한 상품 주문/결제등이 근래에 많은 보안잇슈로 문제가 되고 있음에 따라 KISAS의 권고조치의 일환으로 했습니다. 따라서, 한달뒤인 2019.03.10 이후 모든 비회원 고객님들께서는 회원가입으로 전환 후 실명인증이 되어야 하며, 이는 모든 쇼핑몰/오픈마켓등의 전자상거레서비스의 공통된 사함이라는 점을 안내드립니다. </p> <a class="close-model">X 닫기</a> </div> </div> </div> <script src="js/jquery-1.12.4.js"></script> <script src="js/costom.js"></script> </body> </html> .container{ border: 1px solid #111; width: 1200px; margin: auto; } header{ width: 1200px; height: 100px; background-color: #222; } header div{ height: 100px; } .logo{ width: 170px; background-color: #333; float: left; } .manu{ width: 700px; background-color: #444; float: right; } .silde{ height: 300px; background-color: #555; } .items{ /* height: 200px; */ overflow: hidden; } .items>div{ display: inline-block; height: 200px; float: left; } .news{ width: 400px; background-color: #666; } .tab-inner{ margin: 5px 10px; } .btn{ } .btn .active{ background-color: #fff; } .btn a{ width: 100px; height: 50px; background-color: #888; border: 1px solid #000; display: inline-block; text-align: center; color: #111; text-decoration: none; box-sizing: border-box; padding: 13px 0; border-radius: 5px 5px 0 0; margin-left: -5px; border-bottom: none; cursor: pointer; } .tabs{ background-color: #fff; height: 145px; border: 1px solid #000; margin-left: -5px; margin-top: -1px; } .tab1 a.open{ cursor: pointer; } .tab1 a{ color: #000; text-decoration: none; box-sizing: border-box; border-bottom: 1px solid #000; display: block; margin: 3px; } .tab1 a:last-child{ border-bottom: none; } .tab1 a b{ float: right; font-weight: normal; } .tab2{ display: none; } .tab2 a{ box-sizing: border-box; display: inline-block; padding: 17px 0; margin-left: 10px } .tab2 img{ width: 110px; } .banner{ width: 400px; background-color: #777; } .nav{ width: 400px; height: 200px; background-color: #888; } footer{ height: 100px; background-color: #999; } footer> div{ float: left; height: 100px; } .copy{ width: 1030px; } .copy> div{ width: 1030px; height: 50px; } .copy2{ background-color: #444; } .copy3{ background-color: #777; } .logo2{ width: 170px; background-color: #222; } .model{ position: absolute; left: 0; top: 0; background-color: #00000028; width: 1200px; height: 700px; margin: 7px; display:block; display: none; } .model-content{ position: absolute; left: 50%; top: 50%; background-color: #fff; width: 500px; height: 400px; border: 1px solid #000; transform: translate(-50%,-50%); box-sizing: border-box; } .model-content h1{ color: #fff; background-color: #000; width: 450px; display: inline-block; text-align: center; margin: 25px; } .model-content p{ line-height: 26px; text-shadow: 0 0 3px #0000003d; text-align: center; } .close-model{ background-color: #000; width: 90px; height: 40px; display: inline-block; float: right; color: #fff; text-align: center; box-sizing: border-box; margin: 12px; padding: 6px; cursor: pointer; }$('.btn a:first-child').click(function(){ $('.tab1').show() $('.tab2').hide() $(this).addClass('active') $(this).siblings().removeClass('active') }) $('.btn a:last-child').click(function(){ $('.tab2').show() $('.tab1').hide() $(this).addClass('active') $(this).siblings().removeClass('active') }) $('.open').click (function(){ $('.model').fadeIn() }) $('.close-model').click (function(){ $('.mode1').fadeOut() })코드를 보내드립니다
-
미해결[말 한마디로 뚝딱!] AI와 함께 나만의 수익화 웹사이트를 만드는 법
애플리케이션 새 항목 추가
실행/디버그 구성하는 부분에서 갑자기 메인 클래스 부분이 jh로 변경되어 있고 파일 구조를 보면 jhApplication도 이미 생성되어 있는데 어떻게 하신건가요?끊김제거 및 추가 설명 강의에서도 이 부분이 없습니다
-
해결됨React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드
MODULE_NOT_FOUND 오류
code: 'MODULE_NOT_FOUND', requireStack: [ 'C:\\Users\\CompanyWebsite\\backend\\index.js' ] } Node.js v22.17.0 [nodemon] app crashed - waiting for file changes before starting... app.use("/api/auth", userRoute); 라우트 구성 후 thunder client로 apt 테스트 시 발생하는 오류입니다.
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
그랩님, 해결되지 않은 에러 메시지 [꼭] 답변 부탁 드립니다.
그랩 선생님, 좋은 강의 만들어 주셔서 잘 듣고 있습니다.그런데 아무리 해도 에러가 나는 것을 해결하지 못하고 있어 2주 이상 진도를 나가지 못하고 있어 부득이하게질문을 여러번 올리게 됩니다. 현재 [그랩마켓] React로 웹 개발하기 -2 듣고 있는데요,1.그랩 선생님 소스 코드와 동일하게 아래 작성한 index.js 소스 첨부하는데요,실행하면,1초 동안 잠깐 판매되는 상품들 이미지 없이 전체 페이지 뜨다 바로 아래 첨부한 그림과 같이에러가 발생 합니다.이 에러는 어떻게 해결 할 수 있을까요?--------2. index.js 소스 아래에 작성 첨부 합니다. import './index.css'; import axios from "axios"; import React from 'react'; function MainPage(){ const [products, setProducts]=React.useState([]); React.useEffect( function(){ axios.get("이곳에는 제 mock 목 서버 주소를 넣었습니다/products") .then(function(result){ const products=result.data.products; setProducts(products); }).catch(function(error){ console.error("에러 발생:",error); }); },[]); return ( <div> <div id="header"> <div id="header-area"> <img src="../images/icons/logo.png" /> </div> </div> <div id="body"> <div id="banner"> <img src="../images/banners/banner1.png" /> </div> <h1>판매되는 상품들</h1> <div id="product-list"> { products.map(function(product, index){ return ( <div className="product-card"> <div> <img className="product-img" src={product.imageUrl} /> </div> <div className="product-contents"> <span className="product-name">{product.name} </span> <span className="product-price">{product.price}원 </span> <span className="product-seller"> <img className="product-avatar" src="../images/icons/avatar.png" /> <span>{product.seller}</span> </span> </div> </div> ); }) } </div> </div> <div id="footer"></div> </div> ); } export default MainPage;그리고, 추가적으로 아래 그랩님 답변 본 뒤 다시 시도해 본 후 질문이 있어 추가적으로 글을 적습니다.현재 postman을 실행하고요, 제 해당 목 mock 서버 주소를 입력 후 끝에 /products까지하면요, 아래와 첨부한 사진과 같이 잘 데이터를 받아오는 것 같은데요, 위에 에러 화면이 그대로 표시되어 어떻게 해결해야 하는지 방법을 모르겠습니다. 조금 구체적으로 어떻게 해결해야 하는지 단계별로 친절한 설명 부탁드립니다 위에는 mock 서버인 postman(포스트맨) 화면이고요,아래는 크롬 브라우저 에러 메시지를 첨부합니다. 참고> app.js 소스 첨부합니다.import logo from './logo.svg'; import './App.css'; import MainPage from "./main/index.js" function App() { return ( <div> <MainPage /> </div> ); } export default App; 또한 만약 그랩님께서 제 소스를 보시고 수정하여 에러가 해결된 완성된 index.js 소스가 있다면요,최종 완성된 수십 줄의 소스 코드를 아래 답변 댓글에 길더라도 다 첨부해주시면 완성된 소스 코드를 그대로 복사하여 vs code에 붙여 넣기 하고 싶은데요, 아래 답변 글에 남겨주시면 감사하겠습니다.-------------------------------------------------------------------------------------------------그리고, 아래 글에 나와 있는 답변데로,TypeError: Cannot read properties of undefined (reading ‘map’) 해결 방법서버 데이터 문제로 인한 map 함수 에러 고치기React 데이터 바인딩과 undefined 에러 처리위 해결책의 코멘트와 답변 대로 수정해 보아도 에러가 해결 되지 않았습니다.어떻게 해결 해야 하는지요? 빠른 답변 부탁 드립니다.
-
미해결[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
공지사항과 갤러리 탭(안)구성 중 마우스 클릭시 색상변경이 안됩니다.
마우스 클릭 갤러리마우스 클릭 공지사항 .js .html.css 세번 정도 다시 해보고 class명까지 바꿔가며 확인을 했지만 도저히 찾을 수가 없어요 이상하게 .js가 아예 안되는 것도 아니고 배경색만 바뀌지 않습니다 제가 보기엔 .btn a.active 가 .js로 입력이 안되는 것 같은데 정말 궁금하네요!
-
해결됨React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드
이미지 파일의 경로 설정에 대한 질문입니다.
src 폴더 안에 pages폴더와 assets폴더가 있는데 왜 경로를 ../../assets 이렇게 잡아야 하는 거죠? .. 을 두 번 쓰면 두 번 위로 올라가는 거니까 src 폴더 밖에서 assets 폴더를 찾겠다는 거 아닌가요?
-
미해결[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
뷰티파이 설치 관련 문의
30:00 익스텐션 뷰티파이 설치 시 제 코드에서는 이렇게 나오는데, 설치해서 사용해도 되는건가요??
-
해결됨이거 하나로 종결 - 32시간 고품질 스프링 풀스택 웹 개발
선생님 안녕하세요
선생님 안녕하세요 무료강의 들으면서 말도 안 되는 구성에 말도 안 되는 가격으로 또 처음 출시시 할인까지해주셔서 너무 감사합니다. 이전 풀스텍 강의 바로 결제했고, 다른거 하면서 무료강의부터 듣고 학습중인데이번에 나온 리액트 강의도 당연 구매해서 학습할 예정인데, 이 전에강의는 수강기간이 무제한으로 나와있던데지금 리액트 포함 강의는 36개월만 들을수 있는건가요? 물론 몇회독을 할수있는 시간이긴한데, 전에 강의랑 비교해서 이 강의는 수강기간이 무제한이 아니라 문의글 남겨봅니다.항상 감사합니다.
-
해결됨[코드캠프] 시작은 프리캠프
싸이월드3
<!DOCTYPE html> <html lang="ko"> <head> <title>Game</title> <link href="./styles/game.css" rel="stylesheet"> </head> <body> <div class="wrapper"> <div class="wrapper__header"> <div class="header__title"> <div class="title">GAME</div> <div class="subtitle">TODAY CHOICE</div> </div> <div class="divideLine"></div> </div> <div class="game__container"> <img src="./images/word.png"> <div class="game__title">끝말잇기</div> <div class="game__subtitle">제시어 : <span id="word">코드캠프</span></div> <div class="word__text"> <input class="textbox" id="myword" placeholder="단어를 입력하세요"> <button class="search">입력</button> </div> <div id="result" class="word__result">결과!</div> </div> <div class="game__container"> <img src="./images/lotto.png"> <div class="game__title">LOTTO</div> <div class="game__subtitle">버튼을 누르세요.</div> <div class="lotto__box" id="lottobox"> <span id="lotto1">3</span> <span id="lotto2">5</span> <span id="lotto3">10</span> <span id="lotto4">24</span> <span id="lotto5">30</span> <span id="lotto6">34</span> </div> <button class="button">Button</button> </div> </div> </div> </body> </html>* { box-sizing: border-box; margin: 0px; } html, body{ width: 100%; height: 100%; } .wrapper{ width: 100%; height: 100%; padding: 20px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; } .wrapper__header{ width: 100%; display: flex; flex-direction: column; } .header__title{ display: flex; flex-direction: row; align-items: center; } .title { color: #55b2e4; font-size: 13px; font-weight: 700; } .subtitle{ font-size: 8px; padding-left: 5px; } .divideLine{ width: 100%; border-top: 1px solid gray; } .game__container{ width: 222px; height: 168px; border: 1px solid gray; border-radius: 15px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 20px; background-color: #f6f6f6; } .game__title{ font-size: 15px; font-weight: 900; } .game__subtitle{ font-size: 11px; color: #999999; } .word__result{ font-size: 11px; font-weight: 700; } .word__text{ width: 100%; display: flex; flex-direction: row; justify-content: space-between; } .textbox{ width: 130px; height: 24px; border-radius: 5px; } .search{ font-size: 11px; font-weight: 700; width: 38px; height: 24px; } .lotto__box { width: 130px; height: 21px; border: 1px solid #000000; border-radius: 8px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding: 8px; font-size: 10px; font-weight: 700; font-family: Malgun Gothic; background-color: #ffe400; } .button { width: 62px; height: 24px; border-radius: 5px; font-size: 11px; font-weight: 700; }질문 1. game__container 에서 display 하고 align-items center 로 했는데 왜 끝말잇기 칸은 사이사이에 공백이 잘 들어가 있는데 lotto 부분은 button 부분이 이상하게 붙어있습니다.ㅠ똑같은 game__container 적용 받는데 왜 lotto button 칸만 이럴까요ㅠㅠ?혹시 div 설정 안해서 그런가 해서<div class="button"><button>Button</button></div>로 해도 똑같습니다..왜 이런 현상이 발생할까요ㅠㅠ?
-
미해결풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]
part1을 수강하지 않아도 지장이 없다 하셨는데
part1 및 전반적인 IT배경지식이 없으면 진도를 따라가기 상당히 어렵게 강의가 구성되어 있습니다.
-
미해결풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]
강의에 관해 문의 드립니다.
part1 을 수강하지 않아도 part2 수강에 지장이 없다고 하셨는데 프로그램 설치부터 생략을 하셔서 강의 수강이 진행이 안 됩니다. 어떻게 수강을 진행하는게 바람직할까요?
-
미해결html - SVG scroll animation 효과 - 특별한 포트폴리오를 위한 그림 15종 증정
배 svg 그리는 방법
배나 비행기 같은 svg 요소를 구현할 때, 하나의 완성된 SVG 대신 여러 개의 작은 요소들로 분리해서 겹치는 방식을 사용하는 이유가 궁금합니다.
-
해결됨이거 하나로 종결-스프링 기반 풀스택 웹 개발 무료 강의
vue + springboot 과정 오픈예정일
안녕하세요 선생님... 선생님의 vue + springboot 과정이 너무 기대가되는데 혹시 언제 오픈 예정이신지 너무 궁금합니다.
-
미해결html - SVG scroll animation 효과 - 특별한 포트폴리오를 위한 그림 15종 증정
영상이 안보여요
영상이 안보입니다다른 강의는 보이는데 왜이럴까요.
-
해결됨생성형 AI로 웹 사이트 제작부터 배포(w. Chat GPT, Cursor AI, Database)
8강 재생이 안 됩니다
8강 재생이 안 되네요! 오류인가요??
-
해결됨생성형 AI로 웹 사이트 제작부터 배포(w. Chat GPT, Cursor AI, Database)
안녕하세요! 혹시 코드 내용은 따로 안 올려주시나요??
안녕하세요. 수업 잘 듣고 있습니다.혹시 코드 내용은 따로 안 올려주시는지 궁금합니다.
-
해결됨React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드
배포 후 모바일에서 접속하면 게시판 게시글이 안보이는 문제
안녕하세요. 먼저 강의 잘 들었습니다. 다름이 아니라 배포 후 웹으로는 업무게시판의 게시글이 잘 보이는데 모바일로 접속 시에는 게시글이 없는 것으로 나옵니다.웹(개발자 도구로 모바일 디바이스 버전으로 봐도 잘 보입니다) 모바일 이유가 뭔지 궁금합니다~