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

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.

📌Download Source Code

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

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

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

⏰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

[ModernWeb]

Comment Down How you liked this video ?



📌Download Source Code




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

[slavkotrajkovski]

It would be nice to see the backend of this site as well, great tutorial!

[samsiddique]

One suggestion, please next time don't add background music.

[shaziabashir]

Sir not able to make circle s in resturant section circles are not showing after liver server

[okiroroobrutheanagho]

Hi, nice video. Please can you make this a MERN project with user, restaurants and an admin dashboard?

[ijkiwtv]

may i ask you a question ? i want to know whether yourdisplay page design function is an extension tool or a website. How to use it ? i think it's helpful to built a brand new web project.

[djfago]

wow your explanation is good. i want you to be my teacher. how can i contact you? i am new to web development and i am doing self-Taught.

[NacerCoder]

please can you help me with my vs-code? when i cloned the link that you share with us in Github i didn't see any folder opend in vs-code please can you tell me what should i do?

[samsiddique]

What font you are using in VS Code and extension for comment.

[upzroeq]

Hello Sir, does this website also have a backend for data management??