inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

gsap 상업적 사용여부

해결됨

웹 애니메이션을 위한 GSAP 가이드 Part.01

Club GreenSock을 제외하면 상업적으로 무료로 사용가능한건가요?

  • HTML/CSS
  • javascript
  • 인터랙티브-웹
  • gsap
장준 댓글 1 좋아요 1 조회수 1058

flex - holy grail layout

미해결

CSS 기본부터 활용까지

실습 해보는데 css 중앙 정렬이 안되더라구요 그래서 뭔가 하고 봤더니 doctype부분에서만 차이가 있는데 오히려 doctype을 선언하지 않으니까 중앙 정렬이 돼요. 이게 왜 이럴까요?

  • HTML/CSS
ᄒᄉ 댓글 1 좋아요 0 조회수 381

카카오맵이 나오지를 않아요ㅠㅠㅠㅠ

미해결

비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <link rel="stylesheet" href="layout.css" /> </head> <body> <nav> <div class="inner"> <div class="nav-container"> <hi class="nav-title">맛집지도</hi> <button class="nav-contact">contact</button> </div> </div> </nav> <main> <section id="category"> <div class="inner"> <div class="category-container"> <h2 class="category-title">맛집지도 카테고리를 선택해보세요</h2> <div class="category-list"> <button class="category-item">한식</button> <button class="category-item">중식</button> <button class="category-item">일식</button> <button class="category-item">양식</button> <button class="category-item">분식</button> <button class="category-item">구이</button> <button class="category-item">회/초밥</button> <button class="category-item">기타</button> </div> </div> </div> </section> <!-- 카테고리 --> <div id="map" class="inner"></div> <!-- 카카오지도 --> </main> <script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=b156fcbd2ea3a6340f64c07f5eaef559" ></script> <script src="layout.js"></script> </body> </html> @font-face { font-family: "KyoboHandwriting2020A"; src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2112@1.0/KyoboHandwriting2020A.woff") format("woff"); font-weight: normal; font-style: normal; } * { margin: 0; padding: 0; box-sizing: border-box; } html { font-family: "KyoboHandwriting2020A"; font-size: 10px; } nav { /* background-color: orange; */ } .nav-container { padding: 1rem 0; display: flex; flex-direction: row; justify-content: space-between; align-items: center; } .nav-title { font-size: 3rem; } .nav-contact { font-size: 2.5rem; justify-content: right; border: none; background: none; cursor: pointer; font-family: inherit; } .category-title { font-size: 3.5rem; } .category-item { width: 25%; height: 5rem; background: none; border: none; font-family: inherit; font-size: 1.6rem; } .category-item:hover { color: orange; cursor: pointer; } .inner { padding: 0 1.5rem; } @media all and (min-width: 1024px) { .inner { max-width: 1024px; margin: 0 auto; } } /* 카카오맵 css */ body { height: 100vh; } nav { height: 59px; } main { padding-top: 1.5rem; height: calc(100%-59px); display: flex; flex-direction: column; } #map { flex-grow: 1; width: 100%; height: 100%; } var container = document.getElementById("map"); //지도를 담을 영역의 DOM 레퍼런스 var options = { //지도를 생성할 때 필요한 기본 옵션 center: new kakao.maps.LatLng(33.450701, 126.570667), //지도의 중심좌표. level: 3, //지도의 레벨(확대, 축소 정도) }; var map = new kakao.maps.Map(container, options); //지도 생성 및 객체 리턴 이렇게 했는데 지도가 안 나와요ㅠㅠ 어디가 틀린 걸까요

  • HTML/CSS
  • javascript
  • aws
  • git
  • mysql
  • rest-api
  • github
너굴너굴 댓글 2 좋아요 0 조회수 520

강의자료 문의

해결됨

[코드캠프] 시작은 프리캠프

안녕하세요, 강의 처음으로 듣고 있는데요! 강의자료가 노션(링크)에 있다고 써져있는데, 어디있는 걸까요..?ㅠㅠ (링크가 활성화되어있지 않습니다..) 제가 못 찾고 있는건지 도무지 보이지가 않습니다ㅠㅠ 지금 1강 들었는데 영상 하단에 강의자료 링크도 안뜨구요.. 강의 자료를 보기 위한 노션 링크 달아주실 수 있을까요?

  • HTML/CSS
  • javascript
고대만 댓글 1 좋아요 0 조회수 376

mysql 접속 로그인

미해결

비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지

다 알맞게 작성한거 같은데 계속 오류가 나요ㅠㅠ hostname에 퍼블릭 ip를 작성하는것이 맞을까요? 강의따라서 수업 내용은 잘 따라하였습니다

  • HTML/CSS
  • javascript
  • aws
  • git
  • mysql
  • rest-api
  • github
jdy1336 댓글 2 좋아요 0 조회수 530

.stop().slideDown과 같이 슬라이드 다운 앞에 스탑을 쓰는 이유

미해결

모바일 웹 퍼블리싱 포트폴리오 with Figma

-.stop().slideDown과 같이 슬라이드 다운 앞에 스탑을 쓰는 이유가 뭘까요? 강의에서는 큐?를 없애기 위해서라고 들렸는데 이해를 못하겠어요 ㅠ 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.

  • HTML/CSS
  • jquery
  • 모바일-디자인
  • figma
  • 포트폴리오
일랑일랑 댓글 1 좋아요 1 조회수 579

노션 학습 링크

해결됨

[코드캠프] 강력한 CSS

노션 학습 자료 링크는 어디서 볼 수 있나요?

  • HTML/CSS
yeooonseo 댓글 1 좋아요 0 조회수 393

궁금한점

미해결

풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]

예를 들면 네이버에 접속을 하면 "네이버 증권", "네이버 웹툰"등등 여러 카테고리가 나오지 않습니까 그런데 이 모든 페이지를 html로 구현하려니 모든 버튼에 a태그와 그에 맞는 html웹페이지를 연동시켜야 하더라고요... 혹시 이렇게 않고 java script를 이용하여 구현하는 방법이 따로 있을까요?

  • HTML/CSS
  • javascript
  • es6
jhj 댓글 1 좋아요 0 조회수 290

배경이미지 풀스크린 검색창 질문입니다.(background-attachment : fixed)

미해결

HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)

강의에서 7분40초 쯤입니다! background-attachment: fixed; 를 적용했는데 이미지가 창에 꽉 차게 변하지 않습니다. 이미지 사이즈가 작아서 그런걸까요? 이미지 사이즈는 890 X 501 입니다. 아래 그림처럼 나옵니다. body{ background-image: url(/Image/시부야01.jpg); background-repeat: no-repeat; background-position: center center; /* background-size: cover; */ background-attachment: fixed; }

  • HTML/CSS
임의균 댓글 4 좋아요 1 조회수 577

예제파일이 모두 빈 파일입니다.

미해결

[ 부트스트랩 5 ] 빠르고 스마트하게 웹 사이트 만들기 | Bootsrap 입문용

예제파일 다운로드 하였으나 모두 빈파일입니다.

  • HTML/CSS
  • bootstrap
학생 댓글 2 좋아요 0 조회수 306

크롤링 기사 기간 설정

해결됨

[신규 개정판] 이것이 진짜 크롤링이다 - 실전편 (인공지능 수익화)

안녕하세요 뉴스크롤링에서 크롤링 하고자 하는 뉴스의 기간을 정해주려면 response = requests.get(" https://search.naver.com/search.naver?where=news&sm=tab_jum&query=검색어 ") 위 코드의 " " 안에 뉴스기간을 옵션으로 설정하여 검색한 페이지의 URL을 긁어서 넣어주면 되는걸지요? 감사합니다.

  • python
  • 웹-크롤링
cherrykim90 댓글 2 좋아요 0 조회수 1203

링크 질문입니다.

미해결

비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지

혹시 유튜브가 아닌 네이버 map 링크나 blog 주소를 가져오려면 어떻게 해야 할까요???

  • HTML/CSS
  • javascript
  • aws
  • git
  • mysql
  • rest-api
  • github
SeungJoo 댓글 1 좋아요 0 조회수 201

context 질문 드립니다

해결됨

처음 만난 리액트(React)

안녕하세요 소플님 1 context가 여러 컴포넌트에 접근을 할 수 있다고 하셨는데 context는 상태 관리인건가요? 2 현업에서는 스타일 컴포넌트와 scss 중 어느걸 어 많이 사용 하나요?

  • HTML/CSS
  • javascript
  • react
순곰 댓글 1 좋아요 1 조회수 381

예시사이트 확인부탁드립니다. 비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지

미해결

비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지

강사님 예시 사이트 저도 접속이 안됩니다 크롬 , 엣지 브라우저 둘다 해봐도 안됩니다. 확인 부탁드립니다.

  • HTML/CSS
  • javascript
  • aws
  • git
  • mysql
  • rest-api
  • github
sonty20002 댓글 1 좋아요 0 조회수 292

fork 주소가 어떻게 되나요?

해결됨

웹 애니메이션을 위한 GSAP 가이드 Part.01

강의노트 주소는 어디에 있나요 아무리 찾아봐도 없네요

  • HTML/CSS
  • javascript
  • 인터랙티브-웹
  • gsap
Sun Kim 댓글 1 좋아요 1 조회수 483

제이쿼리 탭메뉴 클릭 질문

미해결

반응형 웹사이트 포트폴리오(App Official Landing Website)

개인 포트폴리오 웹 사이트 작업 중에 질문이 있습니다. 기초반 중급반 고급반 버튼 각자 클릭하면 색깔이 바뀌면서 아래에 4개의 사진들이 바뀌는 형태로 하고 싶은데 잘되지 않습니다. html <div class="online-inner"> <section class="online"> <div class="online-title"> <h2> 온라인 강의 미리보기 <i class="fa fa-line-chart" aria-hidden="true"></i> </h2> </div> <div class="online-content"> <div class="online-btn"> <a class="active" href="#none">기초반</a> <a href="#none">중급반</a> <a href="#none">고급반</a> </div> <div class="online-tabs"> <div class="online-tab1"> <div class="online-tab-inner"> <a href="#none"><img src="images/tab1-img-01.jpg"></a> <a href="#none"><img src="images/tab1-img-02.jpg"></a> <a href="#none"><img src="images/tab1-img-03.jpg"></a> <a href="#none"><img src="images/tab1-img-04.jpg"></a> </div> </div> <div class="online-tab2"> <div class="online-tab-inner"> <a href="#none"><img src="images/tab2-img-01.jpg"></a> <a href="#none"><img src="images/tab2-img-02.jpg"></a> <a href="#none"><img src="images/tab2-img-03.jpg"></a> <a href="#none"><img src="images/tab2-img-04.jpg"></a> </div> </div> <div class="online-tab3"> <div class="online-tab-inner"> <a href="#none"><img src="images/tab3-img-01.jpg"></a> <a href="#none"><img src="images/tab3-img-02.jpg"></a> <a href="#none"><img src="images/tab3-img-03.jpg"></a> <a href="#none"><img src="images/tab3-img-04.jpg"></a> </div> </div> </div> </div> </section> </div> CSS .online-inner { background-color: #5f98e7; } .online { width: 1300px; margin: auto; padding: 50px 0; } .online-title { text-align: center; } .online-title h2 { font-size: 35px; font-weight: 600; color: #fefefe; } .online-content {} .online-btn { text-align: center; } .online-btn a { display: inline-block; padding: 10px 18px; margin-right: 30px; border: 1px solid #295aa0; border-radius: 30px; background-color: #fff; } .online-btn .active { background-color: #132f55; color: #fff; } .online-tabs {} .online-tab-inner { padding-top: 50px; text-align: center; } .online-tab-inner a { margin-right: 20px; } .online-tab-inner a img { width: 280px; } .online-tab1 {} .online-tab2 { display: none; } .online-tab3 { display: none; } $('.online-btn button:nth-child(1)').click(function(){ $('.online-tab1').show() $('.online-tab2').hide() $('.online-tab3').hide() $(this).addClass('active') $(this).siblings().removeClass('active') }) $('.online-btn button:nth-child(2)').click(function(){ $('.online-tab2').show() $('.online-tab1').hide() $('.online-tab3').hide() $(this).addClass('active') $(this).siblings().removeClass('active') }) $('.online-btn button:nth-child(3)').click(function(){ $('.online-tab3').show() $('.online-tab1').hide() $('.online-tab2').hide() $(this).addClass('active') $(this).siblings().removeClass('active') }) 마지막 jquery입니다. 웹디자인기능사 시험처럼 탭메뉴 2개일때는 됐는데 3개로 형태바꾸니까 잘되지 않습니다.

  • HTML/CSS
  • jquery
  • 반응형-웹
강은비 댓글 1 좋아요 1 조회수 263

미니블로그

해결됨

처음 만난 리액트(React)

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요 마지막 미니블로그 테스트만 남았는데 코드를 깃헙에서 그대로 가져와 복붙을 하고 실행해도 사파리에서는 null is not an object 크롬에서는 Cannot read properties of null (reading 'useContext') TypeError: Cannot read properties of null (reading 'useContext') 오류가 뜹니다 어떻게 해야 할까요?

  • HTML/CSS
  • javascript
  • react
dmalk k 댓글 1 좋아요 0 조회수 525

Fly.io 에 그랩마켓 서버 배포하기 수업 중 오류 발생

해결됨

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

docker 관련 에러인것 같습니다. docker 관련 파트 언제 했는지 찾을 수가 없어서 수업 다시 들어 보면서 해결하지도 못하네요 어떻게 손대야 할 지 모르겠습니다.

  • HTML/CSS
  • javascript
  • react
  • node.js
  • react-native
  • 머신러닝
  • express
  • tensorflow
Wakgood 댓글 2 좋아요 0 조회수 466

싸이월드 2탄 home.css 질문

해결됨

[코드캠프] 시작은 프리캠프

마지막 homework 문제에서 저는 box라고 지정했는데 저 margin-top부분을 padding으로 하면 적용이 안되던데 padding은 상위 태그부분에만 작용하는 건가요?

  • HTML/CSS
  • javascript
지 민 댓글 2 좋아요 0 조회수 331

깃허브에서 URL이 주어지지 않아요

미해결

<1만 시간의 법칙> 웹 페이지 제작하기

깃허브에서 레퍼지토리 만들고 파일도 업로드 한 후 page에서 source branch를 none에서 main으로 바꾸고 저장도 했는데 저장이 되었다는 것만 뜨고 강의처럼 URL을 주지 않는데,,, URL을 얻을 수 있는 다른 방법이 있나요?

  • HTML/CSS
  • javascript
  • vscode
뚜키 댓글 1 좋아요 0 조회수 412

인기 태그

인프런 TOP Writers

주간 인기글