Summary
Keywords
Full Transcript
In this video, we will re-create parts of the SpaceX website including the homepage, menus, and some inner pages. We will create some animations and use JavaScript to manipulate the DOM. Sponsor: Hostinger (10% off): http://hostinger.com/traversymedia Github Repo: https://github.com/bradtraversy/spacex-website Live Demo: https://traversydemo.dev Website & Courses: https://traversymedia.com Timestamps: 0:00 - Intro 0:37 - Hostinger Sponsor 1:39 - Project Demo 4:38 - Header/Navbar HTML & CSS 17:23 - Menu Underline Animation 22:52 - Homepage Section A 30:22 - Button & Hover Animation 38:29 - Fade In & Up Animation 44:40 - Scroll Arrow Animation 49:29 - Remaining Homepage Sections 53:30 - Footer 58:29 - Media Queries 1:04:25 - Hamburger Icon & Open Animation 1:12:22 - JavaScript For Open Toggle 1:14:30 - Dark Overlay 1:18:32 - Remove Scroll On Open 1:19:40 - Side Menu HTML & CSS 1:33:00 - Inner Page & Fade Animation 1:42:20 - Stats Counter HTML & CSS 1:46:07 - Stat Counter JavaScript 2:00:00 - Inner Page Responsiveness 2:02:40 - Remaining Inner Pages 2:08:27 - Deploy To Hostinger (Using Git)
Continue this lesson in the app
Install CourseHive on Android or iOS to keep learning while you move.
