Build a responsive Food Order website with HTML, CSS and JS | Food Order Landing Page

Опубликовано: 10 Июль 2023
на канале: Modern Web
15,435
402

If you know HTML, CSS but still find making websites difficult. This video will teach you step by step to apply your knowledge to not only make a website from figma design file but also make that responsive using CSS media query. Not only that but in the website you will find small CSS animations on scroll as well which we will achieve by using a library called “animate on scroll”. There is so much to learn in this video and to practice your web development skills. Let’s code then.


📌Files to start ( Github Link ) - https://github.com/kunaal438/food-ord...

📌Figma File Link - https://www.figma.com/file/lqsKkX683T...

📌Download Source Code

Patreon -   / responsive-food-order-landing-page-45207  
Buymeacoffee - https://www.buymeacoffee.com/Modernwe...

** Use one of the two links above to get the source code **


📌 Social Links Of Not So Social Person
——————————————————————

Instagram ( Still figuring out how to use it ) -   / themodernweb  

Facebook ( Mark knows everthing ) -   / themodernweb  

Twitter ( Never been on trending ) -   / modernweb438  

Dev.to ( Yes I write too. Sometimes ) - https://dev.to/themodernweb

Subscribe - https://www.youtube.com/c/modernweb?s...

Email - [email protected]

📌 Videos you might be interested on
——————————————————————

Responsive Digital Marketing Website -    • Make a responsive one page website us...  

Responsive Travel Website -    • Responsive Travel website using HTML ...  

3D personal Portfolio -    • Build and Deploy Three JS Personal Po...  

Personal Portfolio -    • Make a responsive personal portoflio ...  

Unsplash Clone ( Unsplash API ) -    • Javascript Project - How to make unsp...  

Fullstack Ecommercer Website with payment -    • E-commerce website 2.0  

Music Player using JS -    • Music player  

Fullstack Blogging Website -    • Blogging Website  

CSS Card Hovers -    • Card Hover  


⏰Time Stamps⏰
——————————-

00:00 - Intro
01:00 - Github Repo - Download Starter Files
01:47 - Navbar
20:17 - Hero section
49:35 - Restaurants Section
01:28:07 - About Us section
01:58:20 - FAQ Section
02:12:38 - Download app section
02:38:30 - Footer
02:54:50 - Making Website responsive - Media Query
03:33:00 - Adding Animations - AOS Library
03:48:48 - Outro

————— Thanks for watching —————

—————— 😎 Tags ——————

#webdevelopment #responsivelandingpages #responsivewebdesign #htmltutorial #websitedevelopment #landingpage #css3 #website #codinglife #codingtutorials #react #cssanimations #mediaquery #js #javascript #learnwebdevelopment #coding #developer #websitedesign


Смотрите видео Build a responsive Food Order website with HTML, CSS and JS | Food Order Landing Page онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Modern Web 10 Июль 2023, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 15,435 раз и оно понравилось 402 людям.