묻고 답해요
160만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결애플 웹사이트 인터랙션 클론!
Vanilla JavaScript로 SPA 만드는 자료 혹은 선택 기준을 추천해주실 수 있으신가요?
안녕하세요. 근래에 vanila JS로 SPA를 구현해보고 싶어서 구글링을 해보았습니다생각보다 여러 자료들이 나오는데 어떤 자료가 적합할지 모르겠어서 혹시 자료를 추천해주실 수 있으신가하여 질문 올리게 되었습니다:)자료가 많아서 몇개를 선정하기 애매하시다면 혹시 vanilla JS로 SPA 구현할때 참고자료로 삼기위한 기준을 알려주실 수 있으실까요? 글 읽어주셔서 고맙습니다!새해 복 많이 받으세요:)
-
미해결따라하며 배우는 HTML, CSS
가상 클래스(의사 클래스)의 정의가 이해가 되지 않습니다.
수업을 듣는 중에 가상 클래스의 정의가 이해가 가지 않아서 질문을 드려요수업에서는 가상 클래스의 정의를 '별도의 클래스를 정의하지 않아도 지정한 것처럼' 이라는 문구가 적혀있는데,가상 클래스의 사용할 때는 '클래스의 이름: 가상 클래스의 이름' 으로 작성을 하는 데,이러면 클래스를 정의한 상태인 것 같아서 이해가 되지 않습니다.혹시 좀 더 풀어서 설명해 주시면 안될까요?
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
강의에 사용되는 노션 링크가 어디있을까요?
다른 수강생분들에게도 문제 해결에 도움을 줄 수 있도록 좋은 질문을 남겨봅시다 :) 1. 질문은 문제 상황을 최대한 표현해주세요.2. 구체적이고 최대한 맥락을 알려줄 수 있도록 질문을 남겨 주실수록 좋습니다. 그렇지 않으면 답변을 얻는데 시간이 오래걸릴 수 있습니다 ㅠㅠex) A라는 상황에서 B라는 문제가 있었고 이에 C라는 시도를 해봤는데 되지 않았다!3. 먼저 유사한 질문이 있었는지 꼭 검색해주세요! 강의에 사용하시는 노션 링크가 영상 하단에 있다고 커뮤니티에서 찾아보았는데, 아무리 찾아도 없어서, 혹시 어디서 찾아볼수있을까요?
-
미해결HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
퍼블리싱 해서 포트폴리오 만들려고하는데
포트폴리오 만들려고하는데 어떤 강의를 들으면 될까요?
-
미해결따라하며 배우는 HTML, CSS
스토리 생성하기 부분에서
안녕하세요. 수업 잘 듣고 있습니다.스토리 생성하기 부분에서 story__picture 부분에 top과 left 값을 주고 왜 다시 transform 값을 줘서 위치를 변화 시키는건가요?? top 과 left만 사용해서 위치를 변화시키는 것과 차이가 있을까요?
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
그림 링크 오류
Failed to load resource: the server responded with a status of 403 () 이런 에러가 뜨는데 어떻게 해결하나요ㅜ
-
미해결SCSS(SASS)+FLEX 실전 반응형 웹 프로젝트 with Figma
섹션 4. SCSS 핵심 이론(Essential Theory) 완성예제는 따로 없을까요?
다운받는 곳에 없어서요
-
해결됨HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
float과 높이 값 질문드립니다
자식요소에 float값이 있으면 부모요소는 높이 값을 잃어버릴때,float : left 와 right 둘 다 있을 때 높이를 잃어버리는건가요?자식요소가 여러 개 있으면 여러 개 모두 float 있을 때 잃어버리는거지요? 혹시 부모요소에 overflow:hidden을 해서 높이 값을 찾아주는 것에 원리가 있을까요?
-
미해결<M.B.I.T> 테스트 페이지 만들기! with Django
첫화면 버튼이 css 적용이 안됩니다..
.buttons button { width: 300px; height: 50px; padding: 5px; border-style: none; border-radius: 10px; font-family: "NEXON Lv1 Gothic OTF"; font-size: 20px; font-weight: bold; cursor: pointer; background-color: #fff; color: #7F47DD; margin-bottom: 20px; }로 코드 올려주신 것 그대로 했는데도 아래 사진처럼 기본 버튼으로 됩니다..다른 css 디자인은 잘 적용이 됩니다.뭐가 문제일까요?
-
해결됨React + GPT API로 AI회고록 서비스 개발 (원데이 클래스)
프롬프트 명령어 - 입력값과 동일한 언어로 받으려면 어떻게 작성할까요?
좋은 내용 감사합니다.프롬프트 내용중에 "Translate Into Korean~" 이라는 내용으로 답변을 한글로 받게 됩니다.혹시 [events] 밑에 오는 사용자 입력값과 동일한 언어로 결과를 받고 싶다면 어떻게 작성하면 될까요?강의 내용을 기준으로 다국어 서비스를 만들려고 하는데, 영어가 짧아서 질문 드려요
-
미해결HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
강의를 듣고있는데
강의 들을 때 나오는 포트폴리오 자료들은 다운 받을 수 있을까요?? 필기하면서 듣고 싶어서요!
-
미해결HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
rotate, skewX, translate 값 찾기 질문드립니다..
.app-ui { /* border: 1px solid red; */ width: 340px; height: 640px; transform: rotate(-30deg) skewX(20deg); /* transform: skewX(); */ position: relative; } .app-ui:hover img:nth-child(1){ transform: translate(40px, -40px); }.app-ui 요소를 rotate (-30deg) skewX(20deg) 해서 .app-ui:hover 밑에 이미지를 translate(40px, -40px) 한 것 같은데 이 때 숫자는 어떻게 40이라는 값이 나온걸까요? 수직으로 올리는 값을 어떻게 정하는 걸까요? 10 20 30 40 다 넣어보면서 찾는건가요..? ㅠㅠ
-
미해결HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
화면 폭이 좁아졌을 때 질문입니다..
분리 되면 밑에 있는 요소에 가려서 글이 안보이는데 밑에 있는 요소 밑으로 밀 수 있는 방법이 있을까요? <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="css/02.hover-separate(04).css"> </head> <body> <div class="items"> <div class="item"> <div class="front"> <img src="images/space-01.png" alt=""> <h2>Mars</h2> </div> <div class="back"> <p>화성은 태양계의 네 번째 행성이다. 4개의 지구형 행성 중 하나다. 동양권에서는 불을 뜻하는 화(火)를 써서 화성이라 부르고 로마 신화의 전쟁의 신 마르스의 이름을 따 Mars라 부른다.</p> <a href="#none">Read More</a> </div> </div> <div class="item"> <div class="front"> <img src="images/space-02.png" alt=""> <h2>Jupiter</h2> </div> <div class="back"> <p>목성은 태양계의 다섯번째 행성이자 가장 큰 행성이다. 태양의 질량의 천분의 일배에 달하는 거대행성으로, 태양계에 있는 다른 모든 행성들을 합한 질량의 약 2.5배에 이른다.</p> <a href="#none">Read More</a> </div> </div> <div class="item"> <div class="front"> <img src="images/space-03.png" alt=""> <h2>Saturnus</h2> </div> <div class="back"> <p>토성은 태양으로부터 여섯 번째에 있는 태양계의 행성으로, 진성(鎭星)으로도 불렀다. 토성은 태양계 내의 행성 중 목성에 이어 두 번째로 크며, 지름은 약 12만 킬로미터이다.</p> <a href="#none">Read More</a> </div> </div> </div> </body> </html> @media (max-width:768px){ .item{ display: block; } } @import url('https://fonts.googleapis.com/css?family=Raleway&display=swap'); body{ font-family: 'Raleway', sans-serif; color: #222; line-height: 1.5em; font-weight: 300; margin: 0; background-color: #222; color: #fff; font-size: 15px; } a{ color: #fff; text-decoration: none; } .items{ text-align: center; width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } .item{ /* border: 1px solid #fff; */ width: 300px; height: 220px; display: inline-block; position: relative; margin: 10px; } .front, .back{ position: absolute; width: 100%; transition: 0.5s; } .front{ /* position: absolute; */ background-color: #333; text-align: center; height: inherit; z-index: 1; /* width: 100%; */ top: 0; } .front img{ margin-top: 8px; /* animation: ani 1s linear infinite; */ } .item:hover .front img{ animation: ani 1s linear infinite; } .front h2{ margin-top: 0; } .back { /* position: absolute; */ background-color: #fff; color: #000; height: inherit; text-align: center; padding: 20px; box-sizing: border-box; /* width: 100%; */ top: 0; opacity: 0; } .item:hover .back{ opacity: 1; } .back p{} .back a{ color: #fff; background-color: yellowgreen; padding: 5px 10px; border-radius: 20px; /* box-shadow: #222222c1 0.7px 0.7px 0.7px;/ */ margin-top: 2px; display: inline-block; } .back a:hover{ background-color: #000; } .item:hover .front{ top: -50%; } .item:hover .back{ top: 50%; } @keyframes ani{ 0% {transform: scale(1);} 50% {transform: scale(1.1);} 100% {transform: scale(1);} }
-
해결됨떠먹는 Three.js
WebGL 1 지원 중단에 대해
영상 : [손쉬운 조작 OrbitControls] 에서 three의 경로 설정 중 THREE.WebGLRenderer: WebGL 1 support was deprecated in r153 and will be removed in r163WebGL 1 지원은 r153에서 사용 중단되었으며 r163에서 제거될 예정입니다.라는 메세지가 나왔습니다. 질문 : 이게 나중에는 오류가 날 수 있다는 뜻인가요? 맞다면 어떻게 대비를 해야 하는지 궁금합니다.
-
해결됨[코드캠프] 강력한 CSS
codepen질문입니다.
code팬에서 애니메이션 코드자료를 찾아볼 수 있다고 하셨는데 코드팬은 어떻게 이용하는건가요?회원가입도 해야하는건지 궁금합니다.
-
해결됨처음 만난 리액트(React)
[Card 컴포넌트 만들기 강의] 코드질문 있습니다!
강의 너무 잘 보고 배우고 있습니다!! 감사합니다 🙂 카드를 한장이 아니라 여러 장이 나오게 만들고 싶어서 혼자 코드를 수정해봤는데요 key 값이 없어서 오류가 난다고 하는데요 1-1.이 상태에서는 어떻게 key값을 넣어줘야 할까요?1-2. 다른 방법은 없을까요? import Card from "./Card"; const names = [ { id: 1, name: "학생 1", comment: "리액트 공부중입니다" }, { id:2, name: "학생 2", comment: "리액트 공부중임니댜" } ] function ProfileCard(props) { <div> {names.map((name) => { return ( <Card title={name.name} backgroundColor="#B57EDC" comment={name.comment} /> ) })}; </div> } export default ProfileCard;
-
미해결Do It! 장고+부트스트랩: 파이썬 웹개발의 정석
장고 개발 준비.
안녕하세요 강사님, 섹션 4 장고 개발 준비에서 .idea파일을 ignore에 적으라고 하셨는데, 제 맥북에는 .idea파일이 없는데 그럼 그냥 무시하고 진행하면 되는 걸까요? (이전단계는 강사님이 하신대로 똑같이 따라 했습니다.)
-
해결됨떠먹는 Three.js
index.html 실행 시 CORS 문제
현재 [섹션0]까지 수강 완료하였습니다.index.html 파일 실행 시 이렇게 CORS 문제가 발생됩니다.어떻게 해결할 수 있을까요?ㅠㅠ
-
미해결풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기10 / 5분20초
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기10 / 5분20초 div태그 사이에 span태그를 넣었는데 span태그가 인라인 태그인건 알겠는데div태그는 블럭 태그라 원래 줄바꿈이 일어나는거 아닌가용 ?어떻게 줄바꿈이 안되고 한줄에 표시되는지 궁금합니다.
-
미해결처음 만난 리액트(React)
실습 실행 오류가 뜹니다.
npm start를 해도 오류가 뜨고 실행이 안됩니다.제발 도와주세요ㅠㅠFailed to compile.Module not found: Error: Can't resolve '.reportWebVitals' in 'C:\Users\ujin2\my-app\my-app\src'ERROR in ./src/index.js 8:0-47Module not found: Error: Can't resolve '.reportWebVitals' in 'C:\Users\ujin2\my-app\my-app\src'ERROR in ./src/index.js 9:0-51Module not found: Error: Can't resolve './chapter_05/CommentList' in 'C:\Users\ujin2\my-app\my-app\src'webpack compiled with 2 errors
