(React Clone) Udemy : Part1. Side bar 정리

(출처 : https://www.youtube.com/watch?v=qiii35VZvBE&list=PLKWa_W4Kolgwt9pboQ34OkkJSmuNTtO-z) 전체 코드는 유튜브에 있음 Side bar 구획 logo / navbar / updated-courses / stats / name side-bar는 fixed로 고정하고, top / left / bottom 모두 지정 2. logo(img)는 block으로 지정한 후에 크기고정 (만약 크기가 정확하면 width: 100%으로 하고, div 조절) 3. navbar 구성 : object array로 변수 지정하고 map함수를 이용 currentPage라는 state를 […]

Read more
React : responsive navbar 구현

미리보기 Navigation 구조 1.MenuItems.js Navigation에 들어갈 list의 data (title, url, className *nav-links-mobile은 mobile 화면에서만 보일것) 2. Button.js / Button.css Button Component (Navigation에서는 Desktop에서 Sign-Up Button 사용) 3. Navbar.js / Navbar.css clicked가 false 일 땐 toggle == bars && menu className = .nav-menu clicked가 true 일 땐 toggle == times && menu className = .nav-menu.active MenuItems에서 […]

Read more