묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
fiy.io로 진행할 때 APIURL설정에 관하여
fiy.io강의 진행 후vercel에 그맵마켓 웹 배포하기 강의 진행했는데화면에 데이터를 못받아 오고 있습니다.정말 죄송한데 원인을 잘 모르겠어요..어떤 부분을 어떻게 찾아봐야할까요.. fly.io에서 URL에 안들어가지는게 뭔가 이상한거같은데..안돌아가고 있다는 느낌이랄까요greb-market-server에서 fly deploy에러나는데 이거때문일까여?PS D:\VScode\grab-market-server> fly deploy==> Verifying app configValidating D:\VScode\grab-market-server\fly.tomlPlatform: machines✓ Configuration is valid--> Verified app config==> Building imageRemote builder fly-builder-blue-feather-4034 ready==> Creating build context--> Creating build context done==> Building image with Docker--> docker host: 20.10.12 linux x86_64[+] Building 23.1s (0/1)[+] Building 12.9s (12/14) => CACHED [internal] load remote build context 0.0s => CACHED copy /context / 0.0s => resolve image config for docker.io/docker/dockerfile:1 1.9s => CACHED docker-image://docker.io/docker/dockerfile:1@sha256:39b85bbfa7536a5feceb7372a0817649e 0.0s => [internal] load metadata for docker.io/library/node:16.17.1-slim 0.6s => [base 1/2] FROM docker.io/library/node:16.17.1-slim@sha256:1f6cbe8654b31c214225bddd12451b857 0.0s => CACHED [base 2/2] WORKDIR /app 0.0s => CACHED [build 1/6] RUN apt-get update -qq && apt-get install -y python pkg-config build- 0.0s => CACHED [build 2/6] COPY --link package.json package-lock.json ./ 0.0s => CACHED [build 3/6] RUN npm ci --include=dev 0.0s => CACHED [build 4/6] COPY --link . . 0.0s => ERROR [build 5/6] RUN npm run build 10.3s ------ > [build 5/6] RUN npm run build:#12 0.549#12 0.549 > grab-market-server@0.1.0 build#12 0.549 > react-scripts build#12 0.549#12 1.839 Creating an optimized production build...#12 10.22 Failed to compile.#12 10.22#12 10.22 ./src/App.js#12 10.22 Line 6: 'React' must be in scope when using JSX react/react-in-jsx-scope#12 10.22 Line 7: 'React' must be in scope when using JSX react/react-in-jsx-scope#12 10.22 Line 8: 'React' must be in scope when using JSX react/react-in-jsx-scope#12 10.22 Line 9: 'React' must be in scope when using JSX react/react-in-jsx-scope#12 10.22 Line 10: 'React' must be in scope when using JSX react/react-in-jsx-scope#12 10.22 Line 12: 'React' must be in scope when using JSX react/react-in-jsx-scope#12 10.22#12 10.22 Search for the keywords to learn more about each error.#12 10.22#12 10.22------Error: failed to fetch an image or build from source: error building: executor failed running [/bin/sh -c npm run build]: exit code: 1
-
미해결[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
내비게이션 배경색 위치
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>철길 마을</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div class="container"> <div class="main-content"> <div class="left"> <header> <div class="header-logo"> <a href="#none"><img src="images/header-logo.png" alt="header logo"></a> </div> <div class="navi"> <ul class="menu"> <li> <a href="#none">철길 마을</a> <div class="sub-menu"> <a href="#none">마을 소개</a> <a href="#none">마을의 유래</a> <a href="#none">볼거리</a> <a href="#none">찾아오시는 길</a> </div> </li> <li> <a href="#none">주변 맛집</a> <div class="sub-menu"> <a href="#none">빵집</a> <a href="#none">간장게장</a> <a href="#none">중국음식점</a> <a href="#none">횟집</a> </div> </li> <li> <a href="#none">주변 여행지</a> <div class="sub-menu"> <a href="#none">은파호수공원</a> <a href="#none">초원사진관</a> <a href="#none">월명공원</a> <a href="#none">진포해양공원</a> </div> </li> <li> <a href="#none">도움마당</a> <div class="sub-menu"> <a href="#none">교통정보</a> <a href="#none">주변 주차장</a> <a href="#none">자료실</a> <a href="#none">자료마당</a> </div> </li> </ul> </div> </header> </div> <div class="center"> <div class="items"> <div class="shortcut"> <img class="shortcut-image" src="images/shortcut-01.png" alt="shortcut image"> <div class="shortcut-content"> <h3>얼리버드 선착순 할인 이벤트</h3> <p> 12월은 사랑의 달~ 코딩웍스에서 여러분께 사랑을 뿌려요~<br> 12월 개강반을 12월 06일까지 접수하는 분들께는 15%~ 20% 의 얼리버드 할인을 제공합니다.<br> 기간: 2022년 12월 18일~ 12월 25일 </p> </div> <a href="#none"><img src="images/shortcut-02.png" alt="shortcut link"></a> </div> <div class="news"> <div class="tab-inner"> <div class="btn"> <span>공지사항</span> </div> <div class="tab1"> <a class="open-modal" href="#none"><em>스트리밍 서버 이전 작업으로 2시간 서비스 중지</em><b>2022.12.20</b></a> <a href="#none"><em>얼리버드 선착순 할인 이벤트 최대 50% 할인</em><b>2022.10.13</b></a> <a href="#none"><em>내 집 마련의 꿈을 꿈이 아닌 현실로 만드는 진짜 방법</em><b>2022.11.31</b></a> <a href="#none"><em>외국인과 영어로 네이티브처럼 대화하는 노하우</em><b>2022.08.09</b></a> <a href="#none"><em>월 500만원 매출을 내는 블로그 운영하는 노하우</em><b>2022.07.07</b></a> </div> </div> </div> <div class="gallery"> <div class="tab-inner"> <div class="btn"> <span>갤러리</span> </div> <div class="tab2"> <a href="#none"><img src="images/gallery-01.png" alt="gallery1"><span>퍼블리셔 취업 가이드</span></a> <a href="#none"><img src="images/gallery-02.png" alt="gallery2"><span>전문가가 되는 사진촬영</span></a> </div> </div> </div> <div class="banner"> <a href="#none"><img src="images/banner-01.png" alt="banner1"></a> <a href="#none"><img src="images/banner-02.png" alt="banner2"></a> <a href="#none"><img src="images/banner-03.png" alt="banner3"></a> <a href="#none"><img src="images/banner-04.png" alt="banner4"></a> </div> </div> </div> <div class="right"> <div class="slide"> <div class="slide-image"> <div class="slide-image-inner"> <a href="#none"><img src="images/slide-e-01.jpg" alt="slide1"></a> <a href="#none"><img src="images/slide-e-02.jpg" alt="slide2"></a> <a href="#none"><img src="images/slide-e-03.jpg" alt="slide3"></a> </div> </div> </div> </div> </div> <footer> <div class="footer-logo"> <a href="#none"><img src="images/footer-logo.png" alt="footer logo"></a> </div> <div class="footer-content"> <div class="footer-link"> <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 class="copyright"> 상호 : (주)코딩웍스 | 대표자 : 홍길동 | 개인정보관리책임자 : 성춘향 부장 사업장주소 : 경기도 남양주시 별내동 1234 코딩웍스 빌딩 6층 (주)코딩웍스 </div> </div> <div class="family-site"> <select> <option value="">패밀리 사이트</option> <option value="">코딩웍스 커뮤니티</option> <option value="">코딩웍스 쇼핑몰</option> <option value="">코딩웍스 재단</option> </select> </div> </footer> </div> <div class="modal"> <div class="modal-content"> <h2>스트리밍 서버 이전으로 서비스 장애</h2> <p> 스트리밍 서버 이전 작업으로 2시간 서비스 중지됩니다.<br> <br> 주요 작업 내용은 아래와 같습니다.<br> 1. 서버 이전에 따른 DNS 이전으로 기존 호스팅 서비스 대체<br> 2. 문자셋을 utf-8로 변경 후 모바일 등에 대처하기 위해 미리 조치<br> 3. 스트리밍 서버 CDN과 연동 후 멀티미디어 이러닝 서비스가 제공<br> <br> 위 내용을 보시면 제법 큰 작업이었음을 알 수 있습니다.<br> 특히 문자셋의 변경에 따라 기존의 DB, data, 웹사이트 솔루션 등의 커스트마이징 등에 상당한 어려움이 있었고, 이에 따른 일부 접속 오류가 있을 수 있었음에 양해를 구합니다.<br> 특히 인터넷익스플로러 11로 접속하셨을 경우 일부 문제은행 목차가 출력되지 않았을 수도 있습니다.<br> 서버 이전 작업으로 고객님들께 불편을 드려서 대단히 죄송합니다.<br> 정상 운영되도록 최선을 다하겠습니다. 감사합니다. </p> <a class="close-modal" href="#none">닫기</a> </div> </div> <script src="script/jquery-1.12.4.js"></script> <script src="script/custom.js"></script> </body> </html> @charset "UTF-8"; body { margin: 0; background-color: #fff; color: #333; font-size: 15px; } a { color: #333; text-decoration: none; } .container {} .main-content { display: flex; } .main-content > div { /* border: 1px solid black; */ /* height: 800px; */ } .left { width: 200px; background-color: rgb(201, 163, 124); } .center { width: 400px; background-color: ivory; } .right { flex: 1; } header { position: relative; z-index: 10; } header > div { /* border: 1px solid red; */ } .header-logo { height: 100px; display: flex; align-items: center; } .navi { height: 400px; } /* Navigation */ .menu { list-style: none; padding: 0; width: 90%; margin: auto; margin-top: 10px; } .menu li { text-align: center; position: relative; } .menu li > a { border: 1px solid #000; display: block; padding: 5px; transition: 0.1s; background-color: beige; } .menu li:hover > a { background-color: lightskyblue; color: #fff; } .sub-menu { border: 1px solid #000; position: absolute; top: 0; left: 100%; width: 100%; height: 120px; display: none; } .sub-menu a { display: block; padding: 5px; transition: 0.1s; background-color: lightskyblue; } .sub-menu a:hover { background-color: navy; color: #fff; } .items {} .items > div { /* border: 1px solid blue; */ } .shortcut { height: 150px; display: flex; align-items: center; box-sizing: border-box; font-size: 12px; padding: 5px; gap: 10px; } .shortcut .shortcut-image { height: 50%; } .news { height: 250px; } .gallery { height: 250px; } /* news & gallery */ .tab-inner { width: 95%; margin: auto; margin-top: 25px; } .btn {} .btn span { border: 1px solid #000; display: inline-block; width: 100px; text-align: center; padding: 5px; border-radius: 5px 5px 0 0; border-bottom: none; margin-bottom: -1px; background-color: lightskyblue; } .tab1 { border: 1px solid #000; height: 170px; box-sizing: border-box; padding: 10px 15px; } .tab1 a { display: block; padding: 5px; border-bottom: 1px solid #000; overflow: hidden; } .tab1 a:last-child { border-bottom: none; } .tab1 a em { display: block; float: left; font-style: normal; width: 75%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .tab1 a b { float: right; font-weight: normal; } .tab2 { border: 1px solid #000; height: 170px; text-align: center; box-sizing: border-box; padding-top: 17px; } .tab2 a { display: inline-block; text-align: center; } .tab2 a img { height: 115px; border-radius: 10px; } .tab2 a span { display: block; } .banner { /* height: 150px; */ display: flex; align-items: center; } .banner a img { width: 98%; } .slide {} .slide > div { /* border: 1px solid green; */ } .slide-image { height: calc(100vh - 120px); overflow: hidden; position: relative; } .slide-image-inner { font-size: 0; height: inherit; width: 300%; position: absolute; top: 0; left: 0; animation: slide 10s linear infinite; } .slide-image-inner a { height: inherit; display: inline-block; width: calc(100% / 3); } .slide-image-inner a img { height: inherit; width: 100%; object-fit: cover; } @keyframes slide { 0% { left: 0; } 30% { left: 0; } 35% { left: -100%; } 65% { left: -100%; } 70% { left: -200%; } 95% { left: -200%; } 100% { left: 0; } } footer { display: flex; height: 120px; align-items: center; background-color: rgb(211, 211, 211, 0.3); } footer > div { /* border: 1px solid red; */ } .footer-logo { width: 200px; } .footer-content { flex: 1; } .footer-content div { /* border: 1px solid red; */ /* height: 60px; */ padding: 10px 20px; } .footer-link {} .footer-link a { color: blue; } .footer-link a::after { content: '|'; margin-left: 5px; } .footer-link a:last-child::after { display: none; } .footer-link a:hover { text-decoration: underline; } .copyright {} .family-site { width: 230px; text-align: center; } .family-site select { padding: 5px; border-radius: 3px; } /* modal */ .modal { background-color: #00000077; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; display: none; } .modal-content { background-color: #fff; width: 470px; padding: 30px; border-radius: 10px; box-shadow: inset 0 0 10px #000; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .modal-content h2 { text-align: center; } .close-modal { float: right; border: 1px solid #000; padding: 5px 10px; } /* Navigation */ $('.menu li').mouseenter(function(){ $(this).children('.sub-menu').stop().slideDown() }) $('.menu li').mouseleave(function(){ $(this).children('.sub-menu').stop().slideUp() }) /* modal */ $('.open-modal').click(function(){ $('.modal').fadeIn() }) $('.close-modal').click(function(){ $('.modal').fadeOut() }).menu li 에 background-color를 넣어야 하나요?.menu li > a 에 background-color를 넣어야 하나요?.sub-menu 에 background-color를 넣어야 하나요?.sub-menu a 에 background-color를 넣어야 하나요?그리고 최종점검 부탁드립니다.
-
해결됨[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
네비게이션 상단 3번 제작 중 오류가 있는 것 같아요 ㅠㅠ
안녕하세요 강사님이 만들어 두신 네비게이션 최종본 파일을 지우고 새로 적으면서강의를 듣고 따라해보고 있는데분명 똑같이 했는데 메뉴부분이 보더가 부족해서 왜 이런가 싶어서 문의드립니다 ㅠㅠ어떤게 잘못된건지 계속 찾아봐도 모르겠네요...
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
fly.io 로그인? 명령어 인식이 안돼요
현시점에서 명령어가 flyctl -> fly로 바뀐거같은데양쪽 명령어 둘다 안먹히네요. fiyio인스톨하고 vscode재기동해봤는데도 같아요+다른 명령어는 된거보면 환경변수문제는 아닌거같은데..아래와 같은 메세지가 뜨는데 잘 모르겠습니다.!PS D:\VScode\grab-market-server> fly auth loginfly : 'fly' 용어가 cmdlet, 함수, 스크립트 파일 또는 실행할 수 있는 프로그램 이름으로 인식되지 않습니다. 이름이 정확한지 확인하고 경로가 포함된 경우 경로가 올바른지 검증한 다음 다시 시도하십시오.위치 줄:1 문자:1+ fly auth login+ ~~~+ CategoryInfo : ObjectNotFound: (fly:String) [], CommandNotFoundException+ FullyQualifiedErrorId : CommandNotFoundException 로컬에서 파워셀열어 실행하면 넘어가는데..
-
미해결3D리플릿 만들기 - 인터랙티브 웹 프로젝트
페이지를 클릭할 때 Uncaught TypeError: Cannot read properties of undefined (reading 'contains') 에러가 뜹니다.
에러를 보면 8번째와 30번째 줄이 문제라는 것 같은데 둘다 close button에 관련된것들이거든요.getTarget함수를 실행할 때 contains이전부분이 undefined가 나오는 것 같아서, e.target을 console로도 찍어 봤는데 저렇게 뻔히 나오고 있는데 왜 자꾸 오류가 뜨는지 모르겠습니다 ㅠㅠ선생님 코드랑 비교해 봤는데 완성된 코드니까 물론 차이는 있지만 저 부분은 다를 게 딱히 없어 보이거든요..대체 원인이 뭘까요? 작동은 되는데 자꾸 오류가 뜨니까 신경쓰여요
-
미해결따라하며 배우는 HTML, CSS
도표 자료 pdf 파일로 아이패드로 어떻게 옮기나요?
도표 자료 pdf 파일로 아이패드로 어떻게 옮기나요?
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
18버전 업데이트 강의는 언제 업로드되나요?
리액트 16버전이라 강의 듣는데 헷갈립니다.... 최신 버전 이미지를 추가 해주시긴 하였으나, 기본 설명 자체가 16버전이라 혼란스럽고 불편합니다.당연히 최신 버전 강의인줄 알고 구매 하였는데, 이전 버전이 베이스로 된 강의면 제가 이 돈을 들여서 강의를 구매할 이유가 없다고 생각합니다.강의 업데이트 되는거 맞나요? 언제 업로드 되는건가요?
-
미해결Do It! 장고+부트스트랩: 파이썬 웹개발의 정석
from .models import Question
강의중에 나온건 아니지만views.py 에서 models의 함수를 가져오기 위해서import할때 왜 models가 아닌 .models인걸까요?models.py는 이렇습니다.심지어 . 을 붙이지 않으면 오류가 뜹니다.ModuleNotFoundError: No module named 'models'.이 현재 디렉터리를 뜻하는것 같은데 하지 않았을때와 했을때 다른 경로의 모듈을 import하는걸까요?
-
해결됨HTML5 CSS3 기초 & 반응형 웹 템플릿 만들기!
max-width:1199px 강의 앞부분이 궁금합니다.
안녕하세요. 미디어쿼리 부분부터 열심히 달리고 있습니다.좋은 정보가 많아서 큰 도움이 되네요. 감사합니다^^그런데 "max-width:1199px" 강의 중 앞부분 영상이 누락된 게 아닌지 문의드립니다. 앞에 시작 부분 설명이 없고, font-size: 56.3%부분도 아무리 찾아도 없는데, 그 다음 강좌에 "지난 시간 설정했던"이라고 멘트가 나와서 어디있는지 궁금해서 문의드립니다.감사합니다 :)
-
미해결[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
css 이미지 사이즈
index.html <div class="banner"> <a href="#none"><img src="images/banner-01.jpg" alt="banner"></a> </div> style.css .banner a img { height: 95%; border-radius: 5px; margin: 5px; } .banner img로 해야 하나요? .banner a img로 해야 하나요? 그리고 이미지사이즈 줄일 때 height와 width 중에서 어떤걸로 해야하나요?
-
미해결모바일 웹 퍼블리싱 포트폴리오 with Figma
파일 다운로드 하는 곳이 어디에 있나요? Figma zip파일
파일 다운로드 하는 곳이 어디에 있나요? Figma zip파일
-
미해결자바스크립트 : 기초부터 실전까지 올인원
깃허브 오류
깃헙 강의 도중 push과정에서 오류가 생긴것같은데 혼자 구글링으로 해결하다보니 또 다른 부분에서 오류가 생겨나서 점점 엉키는 것 같아 여쭤봅니다 ㅠㅠ
-
해결됨[코드캠프] 시작은 프리캠프
싸이월드 만들기 29분10초부터 갑자기 똑같이 안되는데 뭐가 잘못 됬을까요? ㅠㅠㅠㅠ
*{ box-sizing: border-box; margin: 0px; } .background{ width: 1024px; height: 600px; background-image: url("../images/background.png"); padding: 20px 0px 0px 20px; } .outerbox{ width: 808px; height: 544px; background-image: url("../images/outerbox.png"); } .wrapper { display: flex; flex-direction: row; padding: 32px 0px 0px 32px; } .wrapper__left { width: 208px; height: 472px; display: flex; flex-direction: column; } .wrapper__left__header { width: 100%; height: 30px; display: flex; flex-direction: row; justify-content: center; } .today { font-size: 9px; } .wrapper__left body { width: 100%; height: 100%; } .wrapper__right { width: 524px; height: 472px; background-color: violet; }지금 29분 10초 현재상황입니다 여기서 갑자기 justify-content: center; << 하는데 여기서부터 저장하기해도 홈페이지 변경이 안되네요 왜그런걸까요? ㅠㅠ
-
미해결[하루 10분|Web Project] HTML/JS/CSS로 나만의 심리테스트 사이트 만들기
진행바 강의에서요 스테이터스바가 짤립니다
indexqnastart위에처럼 스테이터스가 qna박스에 먹힙니다.
-
해결됨[코드캠프] 시작은 프리캠프
선생님 11분 26초까지 따라했는데 아무것도 안뜨는데 제가 뭘잘못한걸까요?
여기서 뭘잘못했을까요 제가? ㅠㅠ 사이트에 아무것도 안뜨네요 ㅠ
-
미해결처음 만난 리액트(React)
개인공부
안녕하세요! 리액트를 처음접하고 공부하고 있는 사람입니다..강의 해주신 내용이 너무 깔끔하고 좋아서 강의보면서 실습해보고, 복습개념으로 블로그에 글을 정리하려고 하는데 괜찮을까요?? 출처는 당연히 남기고, 광고나 이런거는 전혀없고 그냥 개인 공부하는 블로그입니다..!!
-
해결됨[코드캠프] 시작은 프리캠프
쌤 css정렬 강의에 12분40초에 클래스pb할때 그거 뭐눌러야되요??
쌤 css정렬 강의에 12분40초에 클래스pb할때 그거 뭐눌러야되요?? 쩜 눌러야되요? 뭘누른건지 모르겠어요 ㅠㅠ
-
해결됨자바스크립트 : 기초부터 실전까지 올인원
Math 함수를 사용해봤는데. ... 은 무슨 의미일까요??
안녕하세요.5번 문제를 풀면서 검색을 하다가...연산자(??)를 이용하면 배열의 가장 작은 수를 알 수 있다고 하더라고요.이렇게해도 무방할까요??function findSmallestElement(arr){ if(arr.length != 0) { return Math.min(...arr); } else if(arr.length == 0) { return 0; } } console.log(findSmallestElement([12,50, 1, 4]))
-
미해결CSS에 날개를 달아주는 Sass (SCSS)
미디어 쿼리 호출 순서(화면사이즈)
미디어 쿼리 관련하여 질문이 있습니다.SCSS 에서 미디어 쿼리 작성시 화면 사이즈가 큰것 부터 작성해야 한다고 전 강의에서 이야기 하셨는데이번 강의에서는 index.scss 에서 호출시@include mq('phone'){ border: none;}@include mq('tablet-land'){ border: 2px solid $border-color;}@include mq('desktop-big'){ border: 10px solid $border-color;} 의 순서로 해서 호출을 하여도 잘 작동을 하는것 같습니다.(작은 사이즈 화면 부터 호출이 되는것 같은데, 작동을 잘되어서 작동되는 이유를 알수 싶습니다.)원리를 알수가 있을까요?
-
해결됨[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
d,e 유형에서 이거 어떻게 해야할까요?
■ 질문 남기실 때 꼭! 참고해주세요.- 먼저 유사한 질문이 있었는지 검색해주세요.- 궁금한 부분이 있으시면 해당 강의의 타임라인 부분을 표시해주시면 좋습니다d유형과 e유형 내용에서여기 아래 컨텐츠는 html 코딩으로 작성해야 하며, 이미지로 삽입하면 안된다 부분이 말하는게 배너나 갤러리에 들어가는 이미지에 텍스트를 넣을때 포토샵으로 텍스트를 넣으면 안된다는 걸까요? 슬라이드에선 강의하신대로 포토샵으로 텍스트를 넣었는데 저기에선 저 문구가 좀 걸리긴하네요.- HTML, CSS, JQUERY 코드 소스를 텍스트 형태로 첨부해주시고 스크린샷도 첨부해주세요.- 다운로드가 필요한 파일은 해당 강의의 마지막 섹션에 모두 있습니다.
