html안에 style에 정의된 apply 코드들은 cdn으로 링크된 tailwindcss 스크립트가 tailwindcss 스타일로 인식해 실시간으로 빌드하여 적용되지만 외부 스타일로 링크하면 일반 css로 인식해서 빌드하지 못하기 때문에 적용되지 않는다고 하네요그래서 cli로 빌드해서 적용해야 한다고 합니다

git에 있는 chapter 03에 있는 거 그대로 copy 하고index.js 수행 해도 아래와 같은 오류가 떠요..버전은 16이구요..어디가 잘 못 된걸까요?Cannot read properties of undefined (reading 'S') TypeError: Cannot read properties of undefined (reading 'S') at http://localhost:3001/static/js/bundle.js:19184:56 at ./node_modules/react-dom/cjs/react-dom-client.development.js (http://localhost:3001/static/js/bundle.js:20831:2) at options.factory (http://localhost:3001/static/js/bundle.js:29391:31) at __webpack_require__ (http://localhost:3001/static/js/bundle.js:28833:32) at fn (http://localhost:3001/static/js/bundle.js:29050:21) at ./node_modules/react-dom/client.js (http://localhost:3001/static/js/bundle.js:21060:20) at options.factory (http://localhost:3001/static/js/bundle.js:29391:31) at __webpack_require__ (http://localhost:3001/static/js/bundle.js:28833:32) at fn (http://localhost:3001/static/js/bundle.js:29050:21) at ./src/index.js (http://localhost:3001/static/js/bundle.js:28617:74)

App.css 에 있는 내용 지우고, 다음인 App.jsx 수정하는 부분에서 막혔습니다. tailwind css 설치 사이트에 들어가면 다음과 같이 다른 부분이 존재하는데, 5번 부분에 있는 코드를 App.jsx에 넣으면 되는건가요?

비슷한 질문이 있어서 5-2강까지 강의를 들어서 adminLogin까지 구현을 하였습니다.앞의 4-6강에서 로그아웃을 시도하였을 때, 400 Bad Request : 이미 로그아웃된 상태로 나옵니다. 그래서 console.log(req.cookies.token)을 해보았을 때, undefined가 나옵니다.adminLogin을 진행하여 브라우저에 쿠키가 제대로 저장되었는지 확인해보았는데, localhost:5173에서도 localhost:3000에서도 cookie에 token값이 저장되어있었습니다.index.js에 cookie-parser 또한 존재하는 상태입니다.질문을 올리기 전에 여러가지를 시도해보았는데, router.post() 에서는 req.cookies.token의 값을 undefined로 가져오고, router.get()에서는 정상적인 토큰값을 반환했습니다.어떻게 해야 router.post() 에서도 req.cookies.token값을 가져올 수 있을까요?thunder client로 GET http://localhost:3000/api/auth/getCookie를 했을 때도 token은 undefined 값이 출력되었다가 브라우저에서 주소로 접근하니 token값이 정상적으로 출력되었습니다.아래의 사진은 thunder client로 get 방식과 post 방식으로 보냈을 때의 차이를 담은 사진입니다.브라우저에 cookie가 정상적으로 저장된 사진입니다.// index.js require("dotenv").config(); const express = require("express"); const mongoose = require("mongoose"); const cookieParser = require("cookie-parser"); const cors = require("cors"); const userRoutes = require("./routes/user"); const app = express(); const PORT = 3000; app.use(cors({ origin: "http://localhost:5173", credentials: true, })); app.use(express.json()) app.use(express.urlencoded({extended : true})) app.use(cookieParser()); app.use("/api/auth", userRoutes); app.get("/", (req, res) => { res.send("Hello world"); console.log("token: " + req.cookies.token); }); app.post("/cookie", (req, res) => { console.log(req.cookies.token) res.send("api/auth"); }) mongoose .connect(process.env.MONGO_URL) .then(() => console.log("MongoDB와 연결이 되었습니다.")) .catch((error) => console.log("MongoDB와 연결에 실패했습니다: ", error)); app.listen(PORT, () => { console.log("Server is running"); }); // user.js const express = require("express"); const router = express.Router(); const bcrypt = require("bcrypt"); const User = require("../models/User"); const axios = require("axios"); const jwt = require("jsonwebtoken"); // const cookieParser = require("cookie-parser"); // router.use(express.json()) // router.use(express.urlencoded({extended : true})) // router.use(cookieParser()); router.post("/signup", async (req, res) => { try { const { username, password } = req.body; const existingUser = await User.findOne({ username }); if (existingUser) { return res.status(400).json({ message: "이미 존재하는 사용자입니다." }); } const hashedPassword = await bcrypt.hash(password, 10); const user = new User({ username, password: hashedPassword, }); await user.save(); res.status(201).json({ message: "회원가입이 완료되었습니다." }); } catch (error) { res.status(500).json({ message: "서버 오류가 발생했습니다." }); console.log(error); } }); router.post("/login", async (req, res) => { try { const { username, password } = req.body; const user = await User.findOne({ username }).select("+password"); if (!user) { return res.status("401").json({ message: "사용자를 찾을 수 없습니다." }); } if (!user.isActive) { return res .status(401) .json({ message: "비활성화된 계정입니다. 관리자에게 문의하세요." }); } if (user.isLoggedIn) { return res .status(401) .json({ message: "이미 다른 기기에서 로그인되어 있습니다." }); } const isValidPassword = await bcrypt.compare(password, user.password); if (!isValidPassword) { user.failedLoginAttempts += 1; user.lastLoginAttempt = new Date(); if (user.failedLoginAttempts >= 5) { user.isActive = false; await user.save(); return res.status(401).json({ message: "비밀번호를 5회 이상 틀려 계정이 비활성화되었습니다.", }); } await user.save(); return res.status(401).json({ message: "비밀번호가 일치하지 않습니다.", remainingAttempts: 5 - user.failedLoginAttempts, }); } user.failedLoginAttempts = 0; user.lastLoginAttempt = new Date(); user.isLoggedIn = true; // try { // const response = await axios.get("https://api.ipify.org?format=json"); // const ipAddress = response.data.ip; // user.ipAddress = ipAddress; // } catch (error) { // console.log("IP 주소를 가져오던 중 오류 발생: ", error.message); // } await user.save(); console.log("로그인 성공"); const token = jwt.sign( { userId: user._id, username: user.username }, process.env.JWT_SECRET, { expiresIn: "24h" } ); console.log(token); res.cookie("token", token, { httpOnly: true, secure: "production", sameSite: "strict", maxAge: 24 * 60 * 60 * 1000, }); console.log("쿠키 설정", ); const userWithoutPassword = user.toObject(); delete userWithoutPassword.password; res.json({ user: userWithoutPassword }); console.log("json 전달 후 종료"); } catch (error) { console.log("서버 오류: ", error.message); res.status(500).json({ message: "서버 오류가 발생했습니다." }); } }); router.post("/logout", async (req, res) => { try { const token = req.cookies.token; console.log(token); if (!token) { return res.status(400).json({ message: "이미 로그아웃된 상태입니다." }); } try { const decoded = jwt.verify(token, process.env.JWT_SECRET); const user = await User.findById(decoded.userId); if (user) { user.isLoggedIn = false; await user.save(); } } catch (error) { console.log("토큰 검증 오류: ", error.message); } res.clearCookie("token", { httpOnly: true, secure: "production", sameSite: "strict", }); res.json({ message: "로그아웃되었습니다." }); } catch (error) { console.log("로그아웃 오류: ", error.message); res.status(500).json({ message: "서버 오류가 발생했습니다." }); } }); router.delete("/delete/:userId", async (req, res) => { try { const user = await User.findByIdAndDelete(req.params.userId); if (!user) { return res.status(404).json({ message: "사용자를 찾을 수 없습니다." }); } res.json({ message: "사용자가 성공적으로 삭제되었습니다." }); } catch (error) { res.status(500).json({ message: "서버 오류가 발생했습니다." }); } }); router.post("/verify-token", (req, res) => { const token = req.cookies.token; if (!token) { return res .status(400) .json({ isValid: false, message: "토큰이 없습니다." }); } try { const decoded = jwt.verify(token, process.env.JWT_SECRET); return res.status(200).json({ isValid: true, user: decoded }); } catch (error) { return res .status(401) .json({ isValid: false, message: "유효하지 않은 토큰입니다." }); } }); // router.get("/getCookie", async (req, res) => { // res.send(req.cookies.token) // console.log("getCookie's token : " , req.cookies.token) // }) // router.post("/postCookie", async (req, res) => { // res.send(req.cookies.token) // console.log("postCookie's token : ", req.cookies.token) // }) module.exports = router;  

안녕하세요."UIUX 포트폴리오 Part.3 - 반응형 웹 포트폴리오" 강의를 재밌게 보고 있습니다."완성" 폴더에 "원본"폴더에 있는 "yeskey"에 들어간 움직이는 이미지들을, 이미지 사이트에서 다운로드 받으신걸까요?만약 그렇다면 다운 받으신 사이트의 주소를 알려주실 수 있을까요?제 이메일 주소를 남깁니다. happinessboom@daum.net 입니다.좋은 강의를 만들어 주셔서 감사합니다.

하라는 데로 다 해도 그냥 안 깔리네요. 응용 프로그램 크롬으로 넘어가는 과정도 전혀 실행이 안되고요. 추측되는 요인 있으신 분 없으실까요? 

강의에서는 command prompt를 사용하셨는데, 맥북에서는 zsh와 bash 중 어떤 것을 사용해야 할까요?

학습을 잘 따라가는 중 아무 오류나 에러는 없는데 콘솔에는 에러가 나네요 ㅜㅜ분명 코드도 똑같은데 이유를 잘 모르겠어 코드와 오류 사진 캡처 드립니다! 

Material 수업강의 중2:44초에 roughness이 안먹힙니다..빛반사가 안되는데 확인 부탁드려요 ㅜ <script async src="https://ga.jspm.io/npm:es-module-shims@2.0.10/dist/es-module-shims.js"></script> <script type="importmap"> { "imports":{ "three" : "https://cdn.jsdelivr.net/npm/three@0.174.0/build/three.module.js", "three/addons/": "https://cdn.jsdelivr.net/npm/three@0.174.0/examples/jsm/" } } import * as THREE from "three"; const $result = document.querySelector("#result"); // 1. Scene : 화면에서 보여주려는 객체를 담는 공간 const scene = new THREE.Scene(); // scene.add(요소) scene.background = new THREE.Color(0xffe287); // 2. Camera : 신을 바라볼 시점을 결정 const camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 0.1, 1000); camera.position.set(2, 2, 2); camera.lookAt(0, 0, 0); // 3. Renderer : Scene+Camera, 화면을 그려주는 역할 const renderer = new THREE.WebGLRenderer({ canvas: $result, antialias: true }); renderer.setSize(window.innerWidth, window.innerHeight); // console.log(renderer); // document.body.appendChild(renderer.domElement) const light = new THREE.DirectionalLight(0xffffff); light.position.set(2, 4, 3); scene.add(light); const geometry = new THREE.BoxGeometry(1, 1, 1) const basic = new THREE.MeshBasicMaterial({ color: 0x2e6ff2, // wireframe: true, transparent: true, opacity: 0.5 }); // 가장 일반적으로 사용 됨. const standard = new THREE.MeshStandardMaterial({ color: 0xffaaaa, roughness: 0.2, }); const mesh = new THREE.Mesh(geometry, standard); scene.add(mesh); function animate() { // box.rotation.y += 0.01; // box.rotation.x += 0.01; // console.log(box.rotation.y); renderer.render(scene, camera); requestAnimationFrame(animate); } animate(); // 반응형을 위한 함수 window.addEventListener("resize", () => { // 1. 카메라의 종횡비 camera.aspect = window.innerWidth / window.innerHeight; camera.updateProjectionMatrix(); //카메라 업데이트 // 2. renderer의 크기 renderer.setSize(window.innerWidth, window.innerHeight); });

공익을 위해 첨부합니다... Windows의 경우 Mac과 다른 방식으로 경로가 설정되는 탓인지 상품 업로드 후 홈화면에서 상품이미지가 엑박으로 보이는 오류가 발생합니다. 그동안 질문&답변 게시판에 올라온 모든 질문 및 답변을 참고해 해결을 해보고자 하였는데요, 그 어느 답변을 참고해도 해결이 되지 않아 눈물을 머금고 10분짜리 강의에 몇시간동안 매달려있었습니다. 그렇게 알게된 방법은... 저의 경우(1) 상품 업로드 화면에서 사진을 첨부한 후 개발자 도구의 Network에서 첨부한 사진의 링크를 보면 http://localhost:8080/upload/(상품이름).jpg이런 식으로 뜹니다.(2) 업로드 버튼을 누른 후 홈 화면으로 이동(3) 개발자 도구의 Network에서 새롭게 업로드된 사진의 링크를 보면 http://localhost:3000/upload/(상품이름).jpg 이런 식으로 뜹니다. 이를 해결하기 위해, grab-market-web 폴더 (사용자에 따라 폴더 이름은 다를 수 있음) → src → main → index.js에서 product-card 의 product-img 부분을 확인합니다.<div> <img className="product-img" src={`${API_URL}/${product.imageUrl}`} ></img> </div>src 링크를 다음과 같이 변경합니다. 그럼 상품 업로드 화면에서의 이미지와 홈화면에서의 이미지가 localhost:8080로 동일해지기 때문에 상품 사진이 정상적으로 보입니다. 물론 이렇게 코드를 수정하고 나면 기존에 저장해놨던 상품들의 이미지에 엑박이 뜹니다. (images/products/__ 이런 식으로 폴더 내 이미지와 연결해둔 링크들이 http://localhost:8080/images/products/__ 처럼 변경되니 엑박이 뜨는 것으로 추정됩니다.)어차피 이제 사진을 서버에 직접 업로드하는 방법으로 진행될 예정이니 그냥 기존의 상품들은 삭제하시면 될 것 같습니다. (DB Browser → 데이터 탐색 → 기존 상품 레코드 선택 → 현재 레코드 삭제하기 → 변경사항 저장하기 이용하면 삭제 가능합니다.) 저와 동일한 이유로 엑박 뜨는게 아니라면... 저도 모르겠습니다. 방법을 찾으시면 공유해주세요. 파이팅!  +)상품 상세페이지를 들어가면 다시 엑박이 뜹니다.<div id="image-box"> <img src={`${API_URL}/${product.imageUrl}`} /> {console.log(product.imageUrl)} </div>이때는 product 폴더의 index.js에 들어가여 image-box 부분을 다음과 같이 변경해주세요. 원리는 위와 동일합니다. 그러면 상세페이지에서도 정상적으로 작동합니다.   

강의 내용중에는슬라이드 아이템에 height: calc(100vh - 100px);을 주셨는데,.main-content > div에 똑같은 값을 주고 슬라이드 아이템에 height: inherit;을 주는건 안될까요?

■ 질문 남기실 때 꼭! 참고해주세요.안녕하세요 비쥬얼 스튜디오 코드에서 뷰티파이가 더이상 업데이트 하지 않는다고 하는데요, 자동 인덴트 조절은 어떤 어플 대체품이 있을까요? 또한 선생님 설명에는 블라켓 사용법이 pdf 앞장에 되어있는데, 현재는 비쥬얼만 된다는 강의를 봤습니다.이론 강의를 듣기 시작하려고 하는데 블라켓베이스 기준 설명이신데 그거 상관없이 코드로 그냥 하면 될까요? 헷갈려서 여쭤봅니다 - 먼저 유사한 질문이 있었는지 검색해주세요.- 궁금한 부분이 있으시면 해당 강의의 타임라인 부분을 표시해주시면 좋습니다.- HTML, CSS, JQUERY 코드 소스를 텍스트 형태로 첨부해주시고 스크린샷도 첨부해주세요.- 다운로드가 필요한 파일은 해당 강의의 마지막 섹션에 모두 있습니다.질문 하실 때 어떤 유형인지 말씀해주세요. ex) A1 작업하는데 ???이 안됩니다.

안녕하세요, 우선 좋은 강의 업로드해주셔서 감사합니다.다름이 아니라 강의를 보면서 공부하며 친 코드들을 깃허브나 블로그에 개인 공부 기록용으로 공개 업로드해도 될지 질문드리고 싶습니다.

강의에 대한 질문은 인프런 질문하기나, 1:1 커뮤니티 페이지에서 문의하시면 빠르게 답변 드리고 있습니다.(커뮤니티 주소 https://itconnect.dev/커뮤니티/) 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요테마 파일과 CSS, PHP 파일은 아래 링크를 통해 받아보실 수 있습니다.https://drive.google.com/drive/folders/1KtkfsZe2uy5jNMps0F6gnqlEvZnq0mRN?usp=sharin푸터를 영상에 나온것처럼 변경했는데 새로고침하면 배경색 글자색 지정한거 없어지고 위에 같이 보이네요 ㅜh1글자색으로 보여지는 것같아요 해결방법있을까요?

D,E 최종본 제작 전 영상에서 말씀주신 파일모음을 받고싶은데 수업자료에 첨부된 파일들 확인해봐도 찾을수가 없습니다. 참고PSD. 텍스트, 사진이 포함된 수험자제공파일은 어디서 받을 수 있을까요?

안녕하세요.백엔드 개발자를 목표로 공부하면서, 최소한의 프론트엔드 지식도 익히고 싶어 강의를 수강 중인 학생입니다:)이번 Ajax 강의를 듣고 처음에는 잘 이해되지 않아 여러 번 반복해서 학습했습니다. 그 결과 왜 직렬화와 역직렬화를 하는지, 그리고 Ajax가 전체적으로 어떤 원리로 동작하는지에 대한 감은 조금 잡을 수 있었습니다.하지만 코드를 보면 해석은 가능하지만, 직접 작성해보라고 하면 아직 어려운 상태입니다. 강의의 예제 정도는 직접 구현할 수 있을 정도로 습득하는 것이 가장 좋겠지만, 익히는 데 시간이 꽤 걸릴 것 같아 동작 방식만 이해하고 넘어가도 괜찮을지 고민이 됩니다.

매강좌마다 깃허브 링크가있던데요 매강마다 소스코드를 일일히 다운받아야하나요??? 아니면 한번에 다운받아도되는걸 제가 착각하고있는건가요??? 강의가 진행되어질수록 그만큼 코드변경된흐름을 깃허브 트리로 펼쳐놓으신것같은데.... 하나만받아도되는건지 매강마다 깃허브가서 소스코드를 매강마다 다운받아야하는건지 궁금합니다.

 <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>B</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div class="container"> <div class="header-inner"> <header> <div class="header-logo"> <a href="#none"><img src="images/logo-header.png" alt="header-logo"></a> </div> <div class="nav"> <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> <div class="nav-bg"></div> </header> </div> <div class="content-inner"> <div class="slide"> <div> <a href="#none"><img src="images/slide-01.jpg" alt="slide-01"></a> <a href="#none"><img src="images/slide-02.jpg" alt="slide-02"></a> <a href="#none"><img src="images/slide-03.jpg" alt="slide-03"></a> </div> </div> <div class="items"> <div class="news"> <div class="tab-inner"> <div class="btn"> <span>공지사항</span> </div> <div class="tab1"> <a href="#none">어쩌구저쩌구어쩌구저쩌구<b>0000</b></a> <a href="#none">어쩌구저쩌구어쩌구저쩌구<b>0000</b></a> <a href="#none">어쩌구저쩌구어쩌구저쩌구<b>0000</b></a> <a href="#none">어쩌구저쩌구어쩌구저쩌구<b>0000</b></a> <a href="#none">어쩌구저쩌구어쩌구저쩌구<b>0000</b></a> </div> </div> </div> <div class="gallery"> <div class="gallery-inner"> <div class="btn"> <span>갤러리</span> </div> <div class="tab2"> <a href="#none"><img src="images/gallery-01.jpg" alt="gallery-01"></a> <a href="#none"><img src="images/gallery-02.jpg" alt="gallery-02"></a> <a href="#none"><img src="images/gallery-03.jpg" alt="gallery-03"></a> </div> </div> </div> <div class="banner"> <a href="#none"><img src="images/banner.jpg" alt="banner-image"></a> </div> </div> </div> <div class="footer-inner"> <footer> <div class="copyright"> <div><p>어쩌구저쩌구 어쩌구저쩌구 어쩌구저쩌구</p></div> <div><p>어쩌구저쩌구 어쩌구저쩌구 어쩌구저쩌구</p></div> </div> <div class="family-site"> <select> <option value="">Family Site</option> <option value="">어쩌구저쩌구</option> <option value="">어쩌구저쩌구</option> <option value="">어쩌구저쩌구</option> </select> </div> </footer> </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; color: #333; background: #fff; font-size: 15px; } a { color: inherit; text-decoration: none; } /* .container {} */ .header-inner { background: #ddd; } header { position: relative; z-index: 1; height: 100px; justify-content: space-between; } header > div { /* border: 1px solid #000; */ height: 100px; } .header-logo { float: left; width: 200px; line-height: 130px; } .nav { float: right; width: 600px; } .menu { position: relative; z-index: 1; margin-top: 67px; list-style: none; padding: 0; display: flex; } .menu > li { flex: 1; } .menu > li > a { display: block; text-align: center; padding: 5px; background: #fff; border: 1px solid #000; } .menu > li:hover > a { color: white; background: #000; } .sub-menu { display: none; } .sub-menu > a { color: white; padding: 5px; display: block; text-align: center; } .sub-menu > a:hover { color: black; background: white; } .nav-bg { display: none; left: 0; top: 100%; position: absolute; width: inherit; height: 150px; background: #000; } /* .content-inner {} */ .slide { overflow: hidden; /* border: 1px solid #000; */ height: 300px; position: relative; } .slide > div { position: absolute; display: flex; font-size: 0; } .items { display: flex; } .items > div { /* border: 1px solid #000; */ padding-top: 10px; height: 200px; } .news { width: 425px; } .gallery-inner { margin: auto; width: 95%; } .tab-inner { float: left; width: 95%; margin: auto; } .btn > span { display: inline-block; width: 100px; height: 30px; text-align: center; line-height: 30px; border-radius: 5px 5px 0 0; border: 1px solid #000; border-bottom: none; background: white; margin-bottom: -1.5px; } .tab1, .tab2 { border: 1px solid #000; height: 160px; padding: 0 10px; } .tab1 > a { border-bottom: 1px solid black; padding: 4px 0; display: block; } .tab1 > a:last-child { border-bottom: none; } .tab1 > a > b { float: right; font-weight: normal; } .gallery { width: 425px; } .tab2 { display: flex; } .tab2 > a { margin: auto; } .tab2 img { width: 120px; } .banner { text-align: right; width: 350px; } .banner img { width: 95%; } .footer-inner { background: #ddd; } footer { display: flex; } footer > div { height: 100px; /* border: 1px solid #000; */ } .copyright { width: 1000px; } .copyright > div { /* border: 1px solid #000; */ /* box-sizing: border-box; */ height: 50%; text-align: center; line-height: 1px; } .family-site { text-align: center; width: 200px; line-height: 100px; } .container > div > * { width: 1200px; margin: auto; }setInterval(function(){ $('.slide>div').animate({left:'-100%'},function(){ $('.slide>div').css({left:0}) $('.slide>div>a:first-child').appendTo('.slide>div') }) },3500) $('.menu li').mouseenter(function(){ $('.sub-menu, .nav-bg').stop().slideDown() }) $('.menu li').mouseleave(function(){ $('.sub-menu, .nav-bg').stop().slideUp() })브라우저 비율을 줄인 상태로 보면 정상적으로 보이지만브라우저 비율을 100%로 맞춰서 보면 헤더랑 푸터 배경 부분이 잘려서 보입니다. 혹시 어떤 문제가 있을까요?(100%)(75%) 

수업 목록의 수업 제목 옆에 있는[구름 모양] 다운로드 버튼을 눌러 소스코드를 다운로드 받으세요! 해당 다운로드 버튼을 못찾겠습니다 ㅠㅠ어디 있나요?

해당 강의에서 제공: 수업자료가 있는거 같은데이거 어디서 다운로드 받는건가요??