ASMR Programming - Multi Page Portfolio Website - No Talking
Вставка
- Опубліковано 4 лип 2024
- Create a Responsive Multi Page Portfolio Website using HTML and CSS only!
In this tutorial, I'm going to show you how to use modern HTML and CSS to create a completely responsive Multi Page Website with awesome color theme. We'll be using CSS Flexbox, Media queries for our responsive design and CSS transition for some cool animation effects. This project have 5 pages : Home, Works, Simple-Work, Blog and About 😉
Source Code : github.com/AsmrProg-YT/Person...
Responsive Portfolio Designs Playlist : • Responsive Personal Po...
Join the full "100 Days Of JavaScript Code - Web Development Bootcamp" course :
• 100 Days of JavaScript...
Keyboard Info : Epomaker TH80 X
Keyboard Link :epomaker.com/products/epomake...
Epomaker Instagram : / epomakerkeyboard
Email : support@epomaker.com
Discord : / discord
Facebook : / epomaker
UA-cam : @Epomaker
Web Design Coding Bootcamp Playlist : • ASMR Web Design Bootcamp
source of all projects also will upload in AsmrProg github page :
github.com/AsmrProg-YT
Video Contents :
00:00:00 - Intro
00:01:46 - Warming hands
00:01:53 - Main codes
00:02:19 - Adding icons
00:02:33 - Adding font
00:03:02 - Navbar
00:04:17 - Default styles
00:04:54 - Navbar styles
00:07:40 - Main section
00:08:24 - Main section styles
00:11:27 - Recent blogs
00:13:06 - Recent styles
00:15:51 - Featured
00:18:02 - Featured styles
00:21:37 - Footer
00:22:56 - Footer styles
00:24:26 - Works page
00:28:32 - Works page styles
00:31:06 - Single work page
00:34:48 - Single work styles
00:37:36 - Blog page
00:40:35 - Blog styles
00:45:07 - About page
00:47:05 - Blog other styles
00:48:26 - About styles
00:50:07 - First result
00:51:06 - Responsive 1400px
00:53:56 - Responsive 1200px
00:59:25 - Responsive 992px
01:06:50 - Mobile responsive
01:09:38 - Final Result
Asmr Game Coding Playlist : • ASMR Game Coding
Other Video's :
Coding IOS (Iphone) Calendar : • ASMR Programming - Cod...
Coding IOS (IPhone) Dynamic Music : • ASMR Programming - Cod...
Coding a Snake Game : • ASMR Programming - Cod...
Movie Guide App Coding : • ASMR Programming - Mov...
Coding IOS (IPhone) Dynamic Music : • ASMR Programming - Cod...
Subscriptions, good comments and likes are great support for me 😍
Don't re-upload or edit the videos on your channel.
All copyrights by AsmrProg.
About AsmrProg Channel :
Here I upload ASMR programming tutorials related to HTML, CSS, Sass, JavaScript, React, PHP, Frameworks such as Bootstrap and more along with creative UI/UX Designs.
AsmrProg is a community for web developers from all levels to learn and grow their skills in front-end and back-end web development.
AsmrProg
Asmr Prog
ASMR Programming
ASMR Coding
ASMR keyboard typing
ASMR web design
ASMR coding html
ASMR coding website
No Talking ASMR
No Talking Coding
No Talking Programming
Here we have first Multi Page Website in AsmrProg, We will have more soon 😉 Hope you enjoy it, Please LIKE to support my channel 🙏❤
Marvelous Brother, Aur bhi Aisa Content Laate Raho 😍
Your videos are very helpful for beginners and intermediate people, I also had fun and learned a few things for myself and seeing you do something made me and everyone else happy. man please continue that project.
@Official-UgamerZ thanks 🙏❤️
@Usesamle thanks so much for your such great words and vibe
assets file pls
Hello, I have been following your channel for months, your design and development skills are amazing. Keep up the great work.
Thanks so much 🙏❤️
I came across your channel by accident while. watching ASMR videos and I actually need to do a portfolio website for HTML and css So this is going to be a big help for me. Thank you.
Great to hear that, keep it up 🙏❤️
After seeing your videos my interest level 10x increase in coding thankyou brother for this video this video really changed my thoughts about programming keep it❤.
Thanks, keep going on 😉🙏
Thank you! Your videos have helped me learn and practice programming
🙏❤️
Was very educational. I learned a lot of things. Thank you.
Thanks so much 🙏❤️
It’s a source of inspiration for many ❤️🎉
Thanks 🙏❤️
Hi man, love your work, I’m Learning a lot watching your projects. Can I ask you what extensions are you using on vs code? Keep going 💪🏻💪🏻💪🏻
Thanks, please check my GitHub, there is a repository about all of my vscode settings, sorry for late response 🙏
Which CSS validator extention does AsmrProg use in this video? I saw his CSS file displayed some messages like "{ expected", "Do not use empty rulesets",...
Hi, it’s error lens extension, sorry for late response 🙏
Awesome
Thanks 🙏❤️
Thanks !!!!
🙏❤️
you are my inspiration bro, please next login page video with JavaScript
Thanks so much, I have too many plans for js, wait for it 😉
Bro please show us your Studio/setup including your keyboard, mouse etc. 🤩☺
Hi, maybe in the future, or in my courses 😁❤️
Hey nice video.. Can u pls tell how u change ur mouse cursor to this waves effect.
Thanks, it’s screen recorder effects, Sorry for late response 🙏
amazing
Thanks 🙏❤️
I was struggling with doing the navbar in js while in your video I saw it’s only html and css lmao 😂 thanks for saving a lot of my time!!
🙏❤️
@@AsmrProg Also one question, my footer is at the top of the page not at the bottom. Why is that happening? Can you help me ?
In this source code? sorry for late response 🙏
@@AsmrProg I solved it by puttin bottom:0 at the css code
@dreamzone11 thanks 🙏
Hey bro what laptop do you use for coding
your work is awesome! Is it possible to upload a tutorial video for web development any time soon?
Hi, yes, I have plans for full stack tutorials 😉
I look forward to it! can't wait 🔥@@AsmrProg
@makemehappy2969 thanks 🙏❤️
How do you design the color so that the color code perfectly matches and looks good without any testing? Meanwhile, I just keep trying again and again to match the colors , Wow 🤯
more 1 hours video bro its very help me when i learning code. I want JS too
We will have a playlist for it soon 😉🙏
thx
🙏❤️
Love you from india❤❤
Thanks so much, please like video 🙏❤️
Hello, how you do circle around cursor?
Hi, it’s screen recorder effects!
hi, how do you change the opacity of VSC?
Hi, with glassit extension, Sorry for late response 🙏
If you add some css animations this project will be the best
Yes but it has long codes, so because of video time I didn’t ☹️🙏
How to change the background in vs code?
Hi, with glassit extension, sorry for late response 🙏
🤔bro...if it's not mac, then how vsCode IDE has rounded edges/corner😮04:36
Hi, Win 11
Please upload video on making games bro
Hi, when do you make a website using react
Hi, maybe after 100 days of JavaScript!
can you provide link of desktop wallpapers
Hi, I download them randomly from Pexels website 🙏
how to make vs code the same as yours?
Hi, please check my GitHub, there is a repository about all of my vscode settings 🙏
@@AsmrProg ok, Very thanks, your videos is Very good
🙏❤️
I will soon be traveling to Canada, and as a hobby, people have advised me to learn programming. I want to become a professional in programming. How?
Depends on what you wanna do, I'm going to assume since you are watching this - web development. There is two different sections, front-end and back-end. You'll need to choose where you wanna start learning, and then start with the basics (don't worry about frameworks or libraries). Honestly, UA-cam courses and Udemy courses are just fine for learning. There is no need to waste money on a $2000 bootcamp. When you feel like you somewhat understand the very basics, sign up for Frotnend Mentor. You'll be given projects to work on (can sort by levels, etc) and will get feedback + they have a Disc server where you can ask for help - which is great, doesn't matter your question, someone will help you and explain for you
Edit: Tbh it's pretty easy as long as you spend at least an hour or two a day working. Just don't get caught up in switching back and forth between different stacks, libraries, etc. They all have pros and cons, they all have people who prefer them over the other. Just choose something and stick with it. For example, I use Django (backend) and VueJS (js framework), then nothing but vanilla CSS for CSS
Hi, you need to be a full stack developer!
@@mlchael7267 Thank you very much for your trouble and yay
🤗
@zennotu4672 🙏❤️
@mlchael7267 thanks for your complete answer 🙏
Please upload video on making games bro
PLEASE REPLY
theme name?
Hi, Ayu theme, sorry for late response 🙏
what is your name of theme bro
Hi, in this video Ayu theme 🙏
bro please upload video on making game
please bro
Did you check my game playlist?!
Associative Software Company Pune for Website development
What!
Associative Software Company Pune for Google Cloud Platform GCP
Bro! Spam!
Associative Software Company Pune for iOS app development
Answered in other comment
First one
Please also like video 🙏❤️
Anytime
🙏❤️
when is it going to be my idea
🙏
پشمام باورم نمیشه ایرانی هستی تو یکی از کد نویس های مورد علاقه من هستی تورو خدا جواب بده😍😍😍😍
کی گفته ایرانیه. ترکه
Hi, please write in English! For more info dm me on telegram 😉🙏❤️
🙄
@@AsmrProg He was just asking if you are Persian and I told him you are from Turkey. That's all
Midoonm😂 comment farsi nazarid 😉
Associative Software Company Pune for mobile app development
Video about it?!
Associative Software Company Pune for Gaming App development
🙄
Pleases upload videos on making game using html,css and js only borr!!!!!
Please upload video on making games bro
PLEASE REPLYPlease upload video on making games bro
PLEASE REPLY
What's special about this video?
Sorry?!
@@AsmrProgwhy...? It's good video
Bro mentioned your insta profile
Hi, sorry but it’s private 🙏
Please upload video on making games bro
Please upload video on making games bro
PLEASE REPLY
Please upload video on making games bro
PLEASE REPLY
Please upload video on making games bro
PLEASE REPLY
Please upload video on making games bro
PLEASE REPLY
Please upload video on making games bro
PLEASE REPLY
Please upload video on making games bro
PLEASE REPLY
Hi, answered in your another comment, sorry for late response 🙏