173만명의 커뮤니티!! 함께 토론해봐요.
미해결
비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 제목과 같이 putty 터미널에서 vi로 vi /etc/nginx/sites-.../ 에서 수정하는데 저는 다음과 같은 화면이 나옵니다. ㅠㅠ 이거 왜 이런건가 요
미해결
비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요 선생님께서 올리신 완성본 코드를 깃허브에서 다운받아서 결과를 보고싶은데, 지도상에 음식점들의 핀이 뜨지 않습니다 ㅠ 아마 sql상에 더미 데이터들이랑 연결이 안되어서 그런것같은데 지도상에 마커들이 뜨게 하려면 어떻게 해야할까요 도와주세요
미해결
비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
[nodemon] 3.1.7 [nodemon] to restart at any time, enter rs [nodemon] watching path(s): . [nodemon] watching extensions: js,mjs,cjs,json [nodemon] starting node index.js [nodemon] app crashed - waiting for file changes before starting... 다음과 같은 오류가 발생하는데 어떻게 해결해야하나요 ㅠ
미해결
TailwindCSS 완벽 마스터: 포트폴리오부터 어드민까지!
이거 근데 log이렇게 치면 console.log(''); 이렇게 되야되는거 아닌가요? 이상하게 안되네요 console.log(); 이렇게 밖에 스니펫이 안되는데 '$1' 에서 '' 이부분은 왜 씹히는거죵?ㅠㅠ
미해결
인터랙티브 웹 개발 제대로 시작하기
window를 ballElem로 변경하면 click했을때 작동을 하지 않는데 이유를 모르겠습니다..! <script> const ballElem=document.querySelector('.ball'); window.addEventListener('click', function(){ ballElem.style.animation='ball-ani 1s 3 forwards'; }); ballElem.addEventListener('animationend',function(){ ballElem.classList.add('end'); }); ballElem.addEventListener('animationiteration',function(){ console.log('반복'); }); </script>
미해결
[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
시험장 visual studio 2022에 emmet 설치 되어 있습니까? ! -> Tab이 되지 않으면 기본 구문 외워서 다 쳐야 합니까? 그리고, 시험장에 최신 버전 visual studio 2022 설치 되어 있습니까? 이때까지 visual studio 2019로 연습했었는데요.
미해결
퍼블리싱 핵심이론 PDF 교재 및 예제파일(HTML+CSS+FLEX+JQUERY)
비주얼 스튜디오 코드 필수 앱 설치 및 사용법 영상을 보고 있는데 'Bracket Pair Colorizar' 이라는 프로그램이 기능 제공을 더 이상 하지 않는다고 적혀있습니다. 해당 프로그램 외에 어떤걸 설치 해야 하나요???
해결됨
[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
tab쪽 보더를 tab1과 tab2에 따로 보더를 주셨는데 한번에 줘도 될까요? 왜 따로주셨는지도 궁금해요 .tabs > div { border: 1px solid #000; height: 169px; padding: 0 10px; } 이런식으로 하는게 더 깔끔하지 않을까 싶어서요
해결됨
[코드캠프] 시작은 프리캠프
css: * { box-sizing : border-box ; } .box2 { display : flex ; align-items : center ; margin : 10px auto ; flex-direction : column ; justify-content : space-evenly ; } .box { width : 300px ; height : 1px ; border : 1px solid rgb ( 199 , 199 , 199 ); display : flex ; flex-direction : column ; justify-content : space-evenly ; align-items : center ; padding : 30px ; margin : 5px auto ; border-top-left-radius : 10px ; border-top-right-radius : 10px ; border-bottom-right-radius : 10px ; border-bottom-left-radius : 10px ; } .box3 { display : flex ; flex-direction : row ; justify-content : row ; } select { border : 1px solid black ; } .pb { width : 500px ; height : 800px ; border : 1px solid gray ; display : flex ; flex-direction : column ; justify-content : space-around ; align-items : center ; padding : 30px ; border-top-left-radius : 10px ; border-top-right-radius : 10px ; border-bottom-right-radius : 10px ; border-bottom-left-radius : 10px ; } html: <!DOCTYPE html > <html lang = "en" > <head> <title> 회원가입 </title> <link href = "./02-signup.css" rel = "stylesheet" /> </head> <body> <div class = "pb" > <h2 class = "box2" > 회원가입 </h2> <input type = "text" placeholder = "이메일을 입력해주세요" class = "box" ><br><br> <input type = "text" placeholder = "이름을 입력해주세요" class = "box" ><br><br> <input type = "password" placeholder = "비밀번호를 입력해주세요" class = "box" ><br><br> <input type = "password" placeholder = "비밀번호를 다시 입력해주세요" class = "box" ><br><br> <select> <option disabled = "true" selected = "true" > 지역을 선택하세요 </option> <option> 서울 </option> <option> 경기 </option> <option> 인천 </option> </select> <br><br> <input type = "radio" name = "gender" class = "box3" ><span class = "box3" > 여성 </span> <input type = "radio" name = "gender" class = "box3" ><span class = "box3" > 남성 </span> <br><br> <input type = "checkbox" > 이용약관 동의합니다 <hr> <button class = "box" > 가입하기 </button> </div> <!-- <input type="button" value="가입하기2"> 예전에 사용했으나 커스텀하기 어려웠음 --> </body> </html> 어디가 문제 인지 알려주시면 감사하겠습니다.
미해결
[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
영상에선 패스하셨지만 네비게이션 서브메뉴 보더 중간없애고 테두리만 있게어떻게 하는지 알수있을까요?
미해결
UIUX 디자이너 취업을 위한 웹 포트폴리오 제작 : 퍼스널 브랜딩 전략
내용을 입력하실때 <p>태그를 안쓰고 <span>태그를 쓰신다음 display:block으로 하신 이유가 있을까요?
미해결
CSS 기본부터 활용까지
<style>에서 nav,aside 따로 할 때는 .container nav, .container aside로 하고 두 개 같이 묶어서 할 때는 그냥 nav,aside로 쓰는 지 궁금합니다. .container를 안 붙여도 똑같이 실행되가지고요
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
확장선택자와 함께 가상클래스 checked 실전 퍼블리싱 06(탭 콘텐츠 - Slide) 강의에서 인접선택자로 아래 코드와 같이 input 태그의 해당 id값을 체크 시 .slide의 자식인 .slide-inner에 left값을 변경해준다고 표시되어져있습니다. 여기에서 ~가 없으면 왜 코드가 제대로 작동되지 않는건가요? ~ 가 없으면 input부분에 해당하는 태그의 자식요소만 올 수 있다는 걸로 이해하는게 맞나요?? (아래 코드는 질문에 필요한 html과 css 부분만 올렸습니다) (+ 항상 질문에 답변 달아주셔서 감사합니다!ㅎㅎ) input[id=tab1]:checked ~ .slide .slide-inner { left: 0; } input[id=tab2]:checked ~ .slide .slide-inner { left: -300px; } input[id=tab3]:checked ~ .slide .slide-inner { left: -600px; } /*----------------------------------------*/ <body> <div class="tab-inner"> <input type="radio" name="tabmenu" id="tab1" checked> <input type="radio" name="tabmenu" id="tab2"> <input type="radio" name="tabmenu" id="tab3"> <div class="slide"> <div class="slide-inner"> <a href="#none1"><img src="images/slide-01.jpg"></a> <a href="#none2"><img src="images/slide-02.jpg"></a> <a href="#none3"><img src="images/slide-03.jpg"></a> </div> </div> <div class="btn"> <label for="tab1"></label> <label for="tab2"></label> <label for="tab3"></label> </div> </div> </body>
미해결
퍼블리싱 핵심이론 PDF 교재 및 예제파일(HTML+CSS+FLEX+JQUERY)
유튜브 보면서 비주얼 스튜디오 코드 환경설정 중인데 beautify가 '이 확장은 더 이상 유지 관리되지 않으므로 더 이상 사용되지 않습니다.' 라는 알림문 뜹니다 그래도 다운 받으면 확장 앱 부분에 노란색 경고 아이콘이 계속 뜨는데 이대로 두는게 맞는건가요?
미해결
나만의 포트폴리오 웹페이지 만들기
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="Chrome"> <meta name="viewport" content="width-device-width, initial-scale-1.0, maximum-scale-1.0, minimum-scale-1.0, user-scalable-no"> <title>Portfolio - Navbar</title> <!-- saved from url=(0013)about:internet--> <!-- icon --> <script src="https://kit.fontawesome.com/64fe4437c7.js" crossorigin="anonymous"></script> <!-- fonts --> <link href="https://fonts.googleapis.com/css2?family=Heebo:wght@100..900&family=Noto+Sans+KR:wght@100..900&display=swap" rel="stylesheet"> <!-- user style --> <link rel="stylesheet" href="/css/portfolio.css"> </head> <body> <header class="header-area navbar-fade" id="header"> <nav class="Navbar"> <a class="Navbar-brand" id="navbarBrand">logo</a> <a class="Navbar-toggler" id="toggleBtn"><i class="fa fa-bars"></i></a> <div class="Navbar-menu" id="menu"> <div class="nav-item"><a class="nav-link" id="navbarAbout">about</a></div> <div class="nav-item"><a class="nav-link" id="navbarService">service</a></div> <div class="nav-item"><a class="nav-link" id="navbarPortfolio">portfolio</a></div> <div class="nav-item"><a class="nav-link" id="navbarReview">review</a></div> </div> </nav> </header> <!-- user script --> <script src="portfolio.js"></script> </body> </html> 웨에거는 portfolio.html이고 아래거는 portfolio.css인데, 아이콘 적용도 안되고, css적용도 안되요! 고쳐주세요! /* COMMON */ * { margin: 0; padding: 0; font-size: 0; } body { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; word-break: break-all; font-family: 'Heebo', sans-serif; } img { width: 100%; height: 100%; } a { text-decoration: none; font-size: 14px; text-transform: uppercase; } ul { list-style-type: none; } /* HEADER */ .header-area { position: relative; top: 0; left: 0; width: 100%; z-index: 99; background-color: white; box-shadow: 0 1px 10px rgba(0, 0, 0, 0.3); } .navbar-fade { animation-name: navbar-fade; animation-duration: 0.5s; -webkit-animation-name: navbar-fade; -webkit-animation-duration: 0.5s; } @keyframes navbar-fade { from {opacity: .4} to {opacity: 1} } @-webkit-keyframes navbar-fade { from {opacity: .4} to {opacity: 1} } .header-area.navbar-fixed { position: fixed; } .header-area > .navbar { width: calc(100% - 120px); margin: 0 60px; overflow: hidden; } @media (min-width: 992px) { .header-area > .navbar { max-width: 900px; margin: 0 auto; } } @media (min-width: 1200px) { .header-area > .navbar { max-width: 1000px; } } .header-area > .navbar > .navbar-brand { display: inline-block; position: absolute; top: 50%; transform: translateY(-50%); font-size: 32px; cursor: pointer; } .header-area > .navbar > .navbar-toggler * { font-size: 32px; } .header-area > .navbar > .navbar-toggler { float: right; height: 70px; line-height: 70px; font-size: 32px; cursor: pointer; } @media(min-width: 992px) { .header-area > .navbar > .navbar-toggler { display: none; } } .header-area > .navbar > .navbar-menu { position: absolute; background-color: rgba(0, 0, 0, 0.5); top: 70px; left: 0; width: 100%; height: 200px; transition: 0.5s ease; overflow: hidden; } .header-area > .navbar > .navbar-menu.show { height: 200px; } .header-area > .navbar > .navbar-menu > .nav-item { float: none; display: block; height: 50px; line-height: 50px; } .header-area > .navbar > .navbar-menu > .nav-item:hover * { background-color: rgba(0, 0, 0, 0.4); } .header-area > .navbar > .navbar-menu > .nav-item > .nav-link { display: block; padding-left: 50px; color: white; cursor: pointer; } @media (min-width: 992px) { .header-area > .navbar > .navbar-menu { position: relative; background-color: transparent; float: right; top: 0; width: auto; height: auto; transition: none; } .header-area > .navbar > .navbar-menu.show { height: auto; } .header-area > .navbar > .navbar-menu > .nav-item { display: inline-block; height: 70px; line-height: 70px; } .header-area > .navbar > .navbar-menu > .nav-item:hover * { background-color: transparent; } .header-area > .navbar > .navbar-menu > .nav-item > .nav-link { display: block; padding: 0 20px; color: black; } } css파일을 css폴더에 넣고 <link rel="stylesheet" href="/css/portfolio.css">로 불러오기를 했는데 안되요!
미해결
UIUX 디자이너 취업을 위한 웹 포트폴리오 제작 : 퍼스널 브랜딩 전략
안녕하세요 먼저 너무 유익하고 도움이되는 강의를 주셔서 감사드립니다. .con02에 workList gsap쪽에 질문이 있어서 글 남기게 되었습니다. my work 타이틀이 fixed되고 리스트들이 올라왔다가 다시 스크롤을 천천히 위 방향으로 해서 올라가다보면 리스트 영역이 이상하게 위로 올라왔다가 사라지는 현상이 있어서 문의 드립니다.
미해결
[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
아직 결제만하고 강의시청은 안한상태인데 2025년 웹디자인개발기능사로 바뀌는데 내용도 바뀐다고 알고있는데 이 강의로2025년도꺼 준비해도 무리는 없을까요!? 혹시 2025년도 버전 강의가 새로 나오면 그걸로 결제할까해서요 여쭤볼곳이 없어서 여기에 적습니다. 답변주시면 감사하겠습니다.!
미해결
실전! 웹사이트제작! Step by Step! ('크루알라모드'_반응형웹 제작)
강의를 듣기 시작했는데 강의자료는 어디에서 받는지 몰라 질문드려요~ kjj5421@naver.com 으로 자료 요헝 드려도 될까요?
미해결
비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요! 제가 AWS가 아닌 Azure 서버를 이용하고 있는데, Azure는 어떻게 이용 가능한 지 알 수 있을까요? 프로젝트를 수행하고 있는 비전공자라 개념이 많이 부족합니다. 운이 좋게 Azure를 쓸 기회를 얻어서 Azure를 이용해서 작업하고 싶은데, 어떻게 사용할 있을 지 알 수 있나 싶어 질문 드립니다.
해결됨
비전공자를 위한 진짜 입문 올인원 개발 부트캠프
(* nodejs 설치를 https://nodejs.org/en/download/ 에 들어가서 Prebuilt Installer 메뉴에서 v22.11.0(LTS)를 설치하였습니다.) 안녕하세요, 수고가 많으십니다. 강의 잘 듣고 공부하다 모르는 부분이 있어 에러사항은 아래에 요약하여 적었습니다. 일단 react 시작하기 강의를 듣고 있던 중 처음 부분에서 vscode 터미널에서 명령어 npm install -g create-react-app 입력 후 아래 에러가 발생하여 어떻게 해야 해결 할 수 있는지 답을 알고 싶어서 글을 쓰게 되었습니다. 1.첫번째로 vscode 실행 후 npm install -g create-react-app 명령어 입력하니 에러 요약: 경로를 확인하라는 문제가 발생하였습니다. 첫번쨰 에러 발생 한 후 vscode를 종료하고 다시 시작하니 또 다시 이번엔 새로운 에러가 발생 하였습니다. 에러 요약: 자세한 내용은 마이크로소프트 링크 주소 참조하라는 메시지 에러가 발생하였습니다. 현재까지 2가지 에러가 순서대로 나타내고 있는데요, 어떻게 하면 해당 사항을 해결 할 수 있을까요? 상세하고 자세한 답변 부탁드립니다. 감사합니다.
