14 -Design & Code a Responsive Landing Page from Start to Finish | Responsive Navigation
In today's episode, we continue on with our project by creating a really simple responsive navigation to make our site look great on all device sizes. We will cover topics today such as:
- CSS
- basic javascript
- javascript functions
- media queries
- responsive nav techniques
Remember to Subscribe - https://goo.gl/6vCw64
Github Repo - https://github.com/jesseshowalter/sho...
http://bradfrost.com/blog/web/respons...
http://bradfrost.com/blog/web/complex...
https://www.smashingmagazine.com/2017...
https://speckyboy.com/responsive-navi...
https://www.webpagefx.com/blog/web-de...
https://codepen.io/jo_Geek/pen/xgbaEr
------------------------------------------------------------------------------------
1. Fork the repo on Github https://github.com/jesseshowalter/sho...
2. Clone of the repo locally using the Github Desktop App
3. Start a new branch that focuses on a specific improvement/feature
4. Make some changes in code that you think would improve the project
5. Make a pull request as shown in the video
6. Smile when you realize it's not as scary as you thought it would be
👍🏼
------------------------------------------------------------------------------------
1. Intro - • 1 - Design & Code a Responsive Landin...
2. Discovery - • 2 - Design & Code a Responsive Landin...
3. Wireframe & Moodboard - • 3 - Design & Code a Responsive Landin...
4. Visual Design Part 1 - • 4 - Design & Code a Responsive Landin...
5. Visual Design Part 2 - • 5 - Design & Code a Responsive Landin...
6. Setting up the Dev environment - • 6 - Design & Code a Responsive Landin...
7. Coding the Nav and Header - • 7 - Design & Code a Responsive Landin...
8. Coding the brand and feature section - • 8 - Design & Code a Responsive Landin...
9. Coding the Offer Section - • 9 - Design & Code a Responsive Landin...
10. Coding the Download Section - • 10 - Design & Code a Responsive Landi...
11. Coding the Footer & Fixes - • 11 - Coding the Footer & Fixes | Desi...
12. Basic Responsive Web Development - • 12 - Basic Responsive Web Development...
13 Responsive Images - • 13 - Responsive Images | Design & Cod...
------------------------------------------------------------------------------------
This series is all about the web design and development process from start to finish. I am going to be taking you through the entire creative process from sketching and wireframing to high res mockups and full development phase.
I have never done a series this large, and my hope is that you will grow as a designer and developer not because I am perfect but because you have allowed yourself to stumble and fail with me on the road to making something you can be proud of.
I made this series because I believe that by teaching it I will learn and grow from not only the experience of creating the project but getting feedback from you all.
------------------------------------------------------------------------------------
------------------------------------------------------------------------------------
////////// Want to support my content and get extra goodies? Become a member and get perks like member-only content, behind the scenes, design files, and more...
https://designchamps.io/hip
////////// Connect with me here 👍🏼
Instagram: / imjesseshow
Twitter: / imjesseshow
Anchor: https://anchor.fm/imjesseshow
Medium: / imjesseshow
////////// Sign up for my Monthly Newsletter 📫
http://jesseshowalter.com/newsletter
////////// Music is from Musicbed click below for a free trial 👇🏼
http://share.mscbd.fm/imjesseshow
////////// Equipment 📸
https://www.amazon.com/shop/jesseshow...