Build a Real world Website Using HTML CSS JavaScript
HTML-код
- Опубликовано: 13 июл 2024
- 📁 Source code & Figma UI
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
Figma UI: www.patreon.com/posts/digital...
Source code: www.patreon.com/posts/digital...
In this course, you will create a completely responsive real-world website with a modern UI in HTML, CSS, and JavaScript.
HI 👋
I'm Sadee(web dev)
In this channel, I make videos about the Complete Responsive website.
You can check out my channel 👇
📺 My Channel: / @codewithsadee
🔔 Subscribe: / @codewithsadee
🔗 Starter file
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
Download the starter file to practice: drive.google.com/file/d/1pYmE...
⏱️ Timestamps
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
0:00 - Demo
1:41 - Project initial
12:59 - Header
30:40 - Hero section
48:42 - Process section
1:00:26 - Work section
1:12:06 - Footer
1:27:34 - Media queries
1:40:51 - Parallax effect
1:46:17 - Media queries
💜💜 PATREON BUDDIES 💜💜
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
Many thanks to our lovely Patreons (from / codewithsadee ) who support us every month and encouraged us to make this video:
Danish Khan, Jose Galvez, Kesu Endalkachew, vagdrak, Frank GP Systems, Stan Price, Tin Tran
🎶 Music
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
- Bcalm x Banks - Anemone
- Provided by Lofi Records
- Watch: • Bcalm x Banks - Anemone
- Download/Stream: fanlink.to/FeelingsPt2
- Bcalm x Banks - Hiraeth
- Provided by Lofi Records
- Watch: • Bcalm x Banks - Hiraeth
- Download/Stream: fanlink.to/FeelingsPt2
- Bcalm x Banks - Bluebird
- Provided by Lofi Records
- Watch: • Bcalm x Banks - Bluebird
- Download/Stream: fanlink.to/FeelingsPt2
- Bcalm x Banks - Just Breathe
- Provided by Lofi Records
- Watch: • Bcalm x Banks - Just B...
- Download/Stream: fanlink.to/FeelingsPt2
- Bcalm x Banks - Gentle Hills
- Provided by Lofi Records
- Watch: • Bcalm x Banks - Gentle...
- Download/Stream: fanlink.to/FeelingsPt2
- Bcalm x Banks x Purrple Cat - I'll Be There
- Provided by Lofi Records
- Watch: • Bcalm x Banks x Purrpl...
- Download/Stream: fanlink.to/FeelingsPt2
- Bcalm x Banks x cxlt - Yours
- Provided by Lofi Records
- Watch: • Bcalm x Banks x cxlt -...
- Download/Stream: fanlink.to/FeelingsPt2
- Bcalm x Banks - Back Then
- Provided by Lofi Records
- Watch: • Bcalm x Banks - Back Then
- Download/Stream: fanlink.to/FeelingsPt2
👍 Like - Follow & Support
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
Twitter: / codewithsadee
Github: github.com/codewithsadee
Facebook: / codewithsadeefan
Instagram: / codewithsadee
⚠️ Disclaimer
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
Disclaimer video is for educational purposes only. Copyright Disclaimer Under Section 107 of the Copyright Act 1976, allowance is made for "fair use" for purposes such as criticism, comment, news reporting, teaching, scholarship, and research. Fair use is permitted by copyright statute that might otherwise be infringing. Non-profit, educational or personal use tips the balance in favour of fair use
#codewithsadee
#responsivewebsite
#agencywebsite
Hi Sadee, It makes such a difference when you explain your code, especially for new coders wanting to learn the base fundamentals of HTML/CSS/JS looking forward to seeing more in the future ⭐⭐⭐⭐⭐
😭😭😭😭😭 I am very emotional to see you are uploading exactly the kind of videos that I have always wished to watch. Thank You, Sir, I am learning, and your videos are miracles.
Wish you very good luck Motit and I'm really happy to hear that ❤
The way you explained the code is commendable, people who struggle in frontend like me needs tutor like you , please bring more projects using javascript logics .
Thanks for this awesome tutorial along with best explanation.
Love from India 😊🇮🇳
WOW sir , great to here your voice it's very very hepful. please upload more video like this one with your voice
Beautiful we need more website with the modern ui like these
More to come!
Beautiful as always ❤️🔥
Thank you Sadee Sir ❤️🔥
My pleasure 😊
Awesome man 👌
Really awesome
Thank very much sir for speaking in the video💝💯
Most welcome
So good that you have started to add commentary but again some things change or dont work when following along.
Thanks for informing me, let me know what's that 😊😊
Thank for this video I think this is the first video you are explaining
There are other video with explanations ❤
Thanks for speaking in this vedio
Hi you are awesome but which software you used for making the intro of this video. thanks
Hello Sadee, when you explain the video everything becomes easier to understand the basics of HTML/CSS/JS.
Help me by asking a question, what is the name of the font you used in the logo.svg?
i love you so much brother you are the best
Hello sir, if I learn and work on all the sites on your channel, will I be able to work after learning how to design them, or are there more things that I should know
Beautiful 😍
Thank you! 😊
May I ask where to get such high-quality image though? Cause I when I resize the image ( bigger) the quality just drops down pretty bad
Thanks for speaking ✨✨✨✨✨
You're welcome
True 🎉
Hey bro great work plz tell me which extension you are using for beautiful comments😊
Why do You set width and height to images in html? And then change it in css? Can You explain it? I completely don't understand it. :(
😊😊
Explanation is very important in coding for beginners and intermediate.
I will suggest you repeat most of your amazing videos with explanation. You will discovered that this video views will be more than some without explanation
You've saved me time
Glad to hear that
you are the best ever please in the next videos can you put an image for the design because every time while praticing i need to return to youtue to look at the design
Okay, I'll remember this
wow really great content!! will save to watch it later
Thanks
My teacher, no need to pain creating a big project until you are free, so my request is please give us a short message which is effective to create a real website. like... documentation, comments, and which property is perfect for a live website. etc. Thank you very much
what is extension and VS setup?
Big fan such an amazing work, i have a question can i know your vs code font, please?
Thanks ❤
I use Cascadia code
Can u give the tutorial on how u make the theme on figma???
welcome 😎😎in previous videos
Why do you display the site on a mobile interface instead of displaying it on the browser, I mean Google or any browser, what is the purpose of that, such as the travel site, the gym, the fitness site, the books site, and many sites on the channel? This does not help me understand, brother.
sir or may be anybody can tell me what are (--) in css used for as these are used in root in beginning of properties of css. for example:- --text-white: 0000;(what are these hifens in the beginning and why are they used )
pls explain it important for me to understand
'Parallax Elements' function is not working ...
I have written the same code but in my code not working why, please give me solution
hi bro, your videos are very clear and stright. can you please tell me what software are you using to record your screen. can you plese replay me it helps a lot. and also can you tell me what are the extensions are used in vs code. can you please give the replay.
Thank you Gngasai ❤
extension name is: `MobileView`
and I'm using OBS studio for recording
@@codewithsadee thanks bro
Completed
congratulation dear! 🎉
Hi Sadee, What you are doing to open thé responsive frame? It is extension ? What?
Can you explain that!
How to create a sports theme like sportskeeda
hyy pls make on "'service on wheel" website layout
yoo broo you deserve a beautiful woman for this😭😭😭😭
please help my navlist isn't showing on clicking the toggle
Join our discord community to discuss with your issue.
bro not everyone can pay for source code
Hello 🤗
I want to make a video on how
to design a complete website using html, css, php
I really need help from the community if any one completed this video and pushed the code on github it would be great help to share the link i tried to make this project but my code is breaking many time and not getting the proper results, anyone plzzzz?
Join our discord server to discuss this issues
can i have your theme name?
can you share your style guide md?
Style guide is in the starter file.
Check description
@@codewithsadee oh yeah I didn't see it thanks
man your figma link dont work
Hey can you join discord server and share screenshot.
give me source code for free... plaese
Sir, I need one website and app. Digital marketing, Pls suggest how to contact you
plzz make a video on how to make website like insta or facebook
Note it
Sir, How can I contact you
Instagram, twitter, email.
Sir, Pls share email ID
codewithsadee@gmail.com@@lakshmipathi2688
Can u stop using patreon to upload your codes, it has been blocked from many countries including mine.. we cant have access to it.. Cant you find an alertanative? GitHub or maybe post the google drive link to the complete project???