172만명의 커뮤니티!! 함께 토론해봐요.
미해결
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);} }
d111
2023-12-31T06:21:31.061Z
댓글 2
좋아요 1
조회수 201
미해결
공공데이터로 파이썬 데이터 분석 시작하기
Jupyter command jupyter-contrib not found. 지금 이 오류가 떠서 설치가 안되고 있는데요. 어떻게 해결해야 할까요?? 제가 봤을땐, pip install jupyter_contrib_nbextensions 이 부분은 실행이 되는데 jupyter contrib nbextension 이 부분에서 오류가 생기는 것 같습니다. ㅠㅠ
1whstudy
2023-12-30T12:11:34.180Z
댓글 1
좋아요 0
조회수 893
미해결
Airflow 마스터 클래스
섹션3, 첫번째 강의에서 스케줄에 관한 질문입니다. 강의에서, start_date = 2023.1.1 schedule = "30 6 * * * " next_run = 2023 03 18 6:30 그리고 현재 날짜는 2023 03 19 인것으로 봤는데, next_run이 현재날짜보다 뒤에 있으니 pause -> unpause 를 하게되면 자동실행이 안되어야 하는거 아닌가요? 강의에서는 자동으로 실행되는것으로 봐서요. 감사합니다.
Hyeonghwan Kwon
2023-12-30T09:18:20.800Z
댓글 1
좋아요 1
조회수 268
해결됨
문과생도, 비전공자도, 누구나 배울 수 있는 파이썬(Python)!
클래스 정의하고 호출하면 42번 줄에 player1에 해당하는 height와 weight의 값이 둘 다 나와야 하는데 저는 한가지 값만 출력이 됩니다. weight를 지우고 height 값만 쓰면 height값이 출력되고 둘다 쓰면 height값은 안나오고 weight값만 출력이 되는데 왜 이런 걸까요?
ㅊㅌㅎ
2023-12-30T07:30:52.207Z
댓글 1
좋아요 1
조회수 185
해결됨
떠먹는 Three.js
영상 : [ 손쉬운 조작 OrbitControls] 에서 three의 경로 설정 중 THREE.WebGLRenderer: WebGL 1 support was deprecated in r153 and will be removed in r163 WebGL 1 지원은 r153에서 사용 중단되었으며 r163에서 제거될 예정입니다. 라는 메세지가 나왔습니다. 질문 : 이게 나중에는 오류가 날 수 있다는 뜻인가요? 맞다면 어떻게 대비를 해야 하는지 궁금합니다.
HTML/CSS javascript three.js
South
2023-12-29T18:37:36.600Z
댓글 2
좋아요 0
조회수 618
해결됨
[코드캠프] 강력한 CSS
code팬에서 애니메이션 코드자료를 찾아볼 수 있다고 하셨는데 코드팬은 어떻게 이용하는건가요?회원가입도 해야하는건지 궁금합니다.
지 민
2023-12-29T07:24:16.612Z
댓글 2
좋아요 0
조회수 329
미해결
Next + React Query로 SNS 서비스 만들기
서버 컴포넌트가 프론트 서버에서 미리 렌더링되는 것으로 알고 있었습니다. 이것이 맞을까요?? 클라이언트 컴포넌트랑 서버 컴포넌트의 렌더링 방식을 찾아봤음에도 여전히 헷갈리는데 시간적 여유가 되신다면 쉽게 알려주실 수 있을까요?? 클라이언트 컴포넌트 사이에 서버 컴포넌트를 넣으면 렌더링 동작이 어떻게 수행되는지 궁금합니다. 강좌에서는 PostArticle이라는 클라이언트 컴포넌트의 자식으로 서버컴포넌트를 넣는데, 공식문서에서는 클라이언트 컴포넌트가 DOM Tree의 끝에 오도록 하는 것을 권장하는 것으로 알고 있었는데 제가 잘못 알고 있던 것이었을까요??
react next.js react-query next-auth msw
이종민
2023-12-29T06:30:03.543Z
댓글 2
좋아요 1
조회수 1923
해결됨
처음 만난 리액트(React)
강의 너무 잘 보고 배우고 있습니다!! 감사합니다 🙂 카드를 한장이 아니라 여러 장이 나오게 만들고 싶어서 혼자 코드를 수정해봤는데요 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;
hws9701
2023-12-28T15:51:49.199Z
댓글 1
좋아요 2
조회수 660
미해결
Do It! 장고+부트스트랩: 파이썬 웹개발의 정석
안녕하세요 강사님, 섹션 4 장고 개발 준비에서 .idea파일을 ignore에 적으라고 하셨는데, 제 맥북에는 .idea파일이 없는데 그럼 그냥 무시하고 진행하면 되는 걸까요? (이전단계는 강사님이 하신대로 똑같이 따라 했습니다.)
HTML/CSS javascript python django bootstrap aws docker tdd
최기연
2023-12-28T10:39:16.713Z
댓글 2
좋아요 0
조회수 426
해결됨
떠먹는 Three.js
현재 [섹션0]까지 수강 완료하였습니다. index.html 파일 실행 시 이렇게 CORS 문제가 발생됩니다. 어떻게 해결할 수 있을까요?ㅠㅠ
HTML/CSS javascript three.js
스고오이
2023-12-28T06:38:12.163Z
댓글 1
좋아요 0
조회수 538
미해결
풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기10 / 5분20초 div태그 사이에 span태그를 넣었는데 span태그가 인라인 태그인건 알겠는데 div태그는 블럭 태그라 원래 줄바꿈이 일어나는거 아닌가용 ? 어떻게 줄바꿈이 안되고 한줄에 표시되는지 궁금합니다.
예림
2023-12-28T04:45:20.984Z
댓글 1
좋아요 0
조회수 538
미해결
남박사의 파이썬으로 실전 웹사이트 만들기
구글로 먼저 배포 해보고 잘 되서 IIS로 배포해보려고 하는데 다음과 같이 나옵니다 handler도 Allow로 바꿨고 web.config는 그대로 복사하고 경로도 확인했는데 뭐가 문제일까요...ㅠㅜㅠ
Eddie
2023-12-26T19:09:07.067Z
댓글 2
좋아요 0
조회수 675
미해결
처음 만난 리액트(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-47 Module not found: Error: Can't resolve '.reportWebVitals' in 'C:\Users\ujin2\my-app\my-app\src' ERROR in ./src/index.js 9:0-51 Module not found: Error: Can't resolve './chapter_05/CommentList' in 'C:\Users\ujin2\my-app\my-app\src' webpack compiled with 2 errors
ujin2941
2023-12-26T17:09:37.151Z
댓글 1
좋아요 1
조회수 739
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
실습에 필요한 소스 찾다가 시간을 엄청 쓰네요... 어디가야 있는건지..
eeejina0923
2023-12-26T11:22:37.781Z
댓글 2
좋아요 2
조회수 302
미해결
Do It! 장고+부트스트랩: 파이썬 웹개발의 정석
Mac으로 강의를 수강하고 있는데 강의를 끝까지 수강하는데 문제가 있을까요? 그리고 맥에서는 cmder이 실행이 안되는것 같습니다. 이 부분을 어떻게 해야 좋을까요? 감사합니다!
HTML/CSS javascript python django bootstrap aws docker tdd
최기연
2023-12-26T09:38:20.697Z
댓글 1
좋아요 0
조회수 336
미해결
처음 만난 리액트(React)
안녕하세요 선생님. 좋은 강의 진심으로 감사드립니다. 실행이 잘 됩니다. 왜 잘 되지?하며 이해가 안되는 부분이 있어서 질문드립니다. Attendance.jsx 코드를 보면 함수 정의 후 Attendance함수만을 export 하고 있습니다. students 배열은 export되지 않고 있어 Attendance함수를 index.js에 불러가서 거기서 사용하면 거기는 students 배열은 불러가지 않았기 때문에 정의되지 않았다며 오류가 떠야할 것 같은 느낌이 들었는데 잘 실행이 되었습니다. 함수만을 export했는데 어떻게 students배열까지 index.js에서 잘 사용할 수 있는걸까요? 그리고 간단한 추가질문이 하나 더 있습니다. 저번 강의에서 리스트의 키값을 지정해주지 않으면 리액트에서는 자동으로 인덱스를 키값으로 설정한다라는 말씀을 잠깐하셨습니다. 그런데 왜 키값을 지정해주지 않았을 때 오류가 뜨는걸까요?
dofamine
2023-12-25T14:50:31.423Z
댓글 1
좋아요 3
조회수 448
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌2)
<body> <div class="container"> <header> <div class="logo"> <img src="logo.png" href="#none"> </div> <div class="search active"> <!-- x버튼 --> <span class="clear"><i class="xi-close-thin"></i></span> <!-- 돋보기 --> <div class="icon"><i class="xi-search"></i></div> <div class="input-frame"> <input type="text" id="searchInput" placeholder="Type Here..."> </div> </div> </header> <section> <h1>This is Section #01</h1> <p> Lorem </p> </section> <section> <h1>This is Section #02</h1> <p> Lorem </p> </section> </div> <script> var icon = document.querySelector('.icon'), search = document.querySelector('.search'), clear = document.querySelector('.clear'), searchInput = document.querySelector('.searchInput'); icon.onclick = function(){ search.classList.toggle('active') } clear.onclick = function(){ searchInput.value = '' } </script> </body> 돋보기까지는 실행이 되는데 텍스트 작성후 x버튼 눌렀을때 지워지지 않아요. searchInput.value = '' <<여기서 자꾸 에러가 뜨는데... 뭐가 문제일까요?
원스텝
2023-12-25T10:31:34.185Z
댓글 2
좋아요 1
조회수 326
미해결
비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
강의 보면서 PM2 배포를 따라해보았습니다. 5999번 포트를 사용했고, 몇 번 API 요청을 하면 EADDRINUSE 에러가 뜹니다. 0|index | Error: listen EADDRINUSE: address already in use :::5999 0|index | at Server.setupListenHandle [as listen2] (node:net:1872:16) 0|index | at listenInCluster (node:net:1920:12) 0|index | at Server.listen (node:net:2008:7) 0|index | at Function.listen (/home/ubuntu/hyerim-resume/server/nodemodules/express/lib/application.js:635:24) 0|index | at Object.<anonymous> (/home/ubuntu/hyerim-resume/server/index.js:6:11) 0|index | at Module._compile (node:internal/modules/cjs/loader:1376:14) 0|index | at Module._extensions..js (node:internal/modules/cjs/loader:1435:10) 0|index | at Module.load (node:internal/modules/cjs/loader:1207:32) 0|index | at Module._load (node:internal/modules/cjs/loader:1023:12) 0|index | at Object.<anonymous> (/home/ubuntu/.nvm/versions/node/v21.2.0/lib/node_modules/pm2/lib/ProcessContainerFork.js:33:23) { 0|index | code: 'EADDRINUSE', 0|index | errno: -98, 0|index | syscall: 'listen', 0|index | address: '::', 0|index | port: 5999 0|index | } 이 에러가 이미 사용중인 포트로 실행하려고 하는 문제라고 해서 매번 sudo lsof -i :5999 , sudo kill -9 ~~ 로 서버를 껐다 키면 또 금방 해당 에러가 발생합니다. sudo lsof -i :5999 로 실행중인 프로세스를 확인하면 다음과 같습니다. COMMAND PID USER FD TYPE DEVICE SIZE/OFF NODE NAME node\x20/ 1396 root 25u IPv6 451174 0t0 TCP ip-172-31-39-74.ap-northeast-2.compute.internal:5999->121.143.65.200:56521 (ESTABLISHED) node\x20/ 1396 root 26u IPv6 20785 0t0 TCP *:5999 (LISTEN) node\x20/ 1396 root 30u IPv6 451237 0t0 TCP ip-172-31-39-74.ap-northeast-2.compute.internal:5999->121.143.65.200:56645 (ESTABLISHED) Mac M2 로 서버에 접근해서 PM2를 실행하는데, Mac에서 AirPlay 모드를 꺼야 한다는 Stack Overflow 내용도 보고 꺼봤지만 역시나 에러가 뜹니다. pm2 start index.js —watch 로 pm2 인스턴스를 실행했더니 몇번 재시작을 자동으로 해주는 것 같지만 결국 재시작이 너무 잦다며 더이상 재시작이 되지 않는 것 같아요. 해결 방법이 궁금합니다 ㅠㅠ 아래는 제 서버의 package.json, index.js입니다. Package.json { "name": "server", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "start": "node index.js" }, "author": "", "license": "ISC", "dependencies": { "compression": "^1.7.4", "cors": "^2.8.5", "express": "^4.18.2", "jsonwebtoken": "^9.0.2", "method-override": "^3.0.0", "mysql2": "^3.6.3", "nodemon": "^3.0.1", "socket.io": "^4.7.2", "winston": "^3.11.0", "winston-daily-rotate-file": "^4.7.1" } } index.js const express = require("./config/express"); const { logger } = require("./config/winston"); //log const port = 5999; express().listen(port); logger.info(`API Server Start At Port ${port}`);
HTML/CSS javascript aws git mysql rest-api github pm2
김혜림
2023-12-25T08:57:47.973Z
댓글 2
좋아요 0
조회수 438
미해결
SCSS(SASS)+FLEX 실전 반응형 웹 프로젝트 with Figma
질문 주실 때 항상 2가지를 지켜주세요. 오류가 나는 부분이나 궁금한 부분의 브라우저 화면 캡쳐해서 올리기 HTML+SCSS+JS 코드 캡쳐 말고 텍스트로 붙여넣기 하기 만약 코드를 캡쳐해서 올리시면 제가 코드의 오류를 찾는게 너무 어렵습니다. 반드시 텍스트로 붙여넣기 해주세요. 비쥬얼 스튜디오 코드에서 라이브 서버를 키면 에러가 뜨네요 근데 그냥 파일로 들어가면 HTML이 제대로 나오네요.
HTML/CSS javascript sass jquery scss
imhj11777
2023-12-25T07:06:26.357Z
댓글 2
좋아요 1
조회수 309
미해결
SCSS(SASS)+FLEX 실전 반응형 웹 프로젝트 with Figma
질문 주실 때 항상 2가지를 지켜주세요. 오류가 나는 부분이나 궁금한 부분의 브라우저 화면 캡쳐해서 올리기 HTML+SCSS+JS 코드 캡쳐 말고 텍스트로 붙여넣기 하기 만약 코드를 캡쳐해서 올리시면 제가 코드의 오류를 찾는게 너무 어렵습니다. 반드시 텍스트로 붙여넣기 해주세요. scss에서 watch sass를 누르고, whatching이 되잖아요. 근데 저는 . css만 생기지 . css.map 은 안 생기는데 이유가 뭐죠?
HTML/CSS javascript sass jquery scss
imhj11777
2023-12-25T06:19:51.879Z
댓글 3
좋아요 1
조회수 408
