ASMR Programming - Animated Login Page - No Talking
Рет қаралды 24,562
Күн бұрынCreate a Login Page Design using HTML, CSS and JavaScript.
In this tutorial, I'm going to show you how to use modern HTML, CSS, and JavaScript to create a complete Login Page Design with Login and Sign up animations. We'll be using CSS Flexbox, CSS transition for some cool animation effects!
Source Code : github.com/AsmrProg-YT/animat...
Join the full "100 Days Of JavaScript Code - Web Development Bootcamp" course :
• 100 Days of JavaScript...
Keyboard Link : iqunix.store/collections/80-s...
Keyboard Info : Epomaker TH80 X
Keyboard Link :epomaker.com/products/epomake...
Epomaker Instagram : / epomakerkeyboard
Email : support@epomaker.com
Discord : / discord
Facebook : / epomaker
KZfaq : @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 - Intro
00:45 - Warming hands
00:52 - Main codes
01:16 - Adding icons
01:39 - Google fonts
02:10 - Html coding
05:19 - Main styles
05:58 - Container styles
06:45 - Sections
08:38 - Social buttons
10:05 - Separator styles
10:59 - Form styles
14:08 - JavaScript coding
15:22 - Active styles
16:42 - 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
@AsmrProg 5 ай бұрын
This Design is fully responsive 😉 Please LIKE video to support my channel 🙏❤ Part #01 : kzfaq.info/get/bejne/htKggJV9r73ZXac.html
@raponduty 5 ай бұрын
Love it, unique
@AsmrProg 5 ай бұрын
Thanks so much bro 🙏❤️
@abdullah-ghaffar825 5 ай бұрын
Amazing I want this type of videos❤
@AsmrProg 5 ай бұрын
🙏❤️
@titrersin 5 ай бұрын
nice design ❤
@AsmrProg 5 ай бұрын
Thanks 🙏❤️
@osamapalmarocchi8399 4 ай бұрын
Love this♥ cheers from Argentina
@AsmrProg 4 ай бұрын
Thanks so much 🙏❤️
@VMTCC_25 5 ай бұрын
Amazing ❤
@AsmrProg 5 ай бұрын
Thanks 🙏❤️
@CSGauravChaubey 5 ай бұрын
Amazing✌🏻✌🏻
@AsmrProg 5 ай бұрын
Thanks, please Like video 😉
@JaniDhyey 5 ай бұрын
Nice one bro!!❤❤
@AsmrProg 5 ай бұрын
Thanks 🙏❤️
@user-ot5mr3kn2b 5 ай бұрын
thanks!
@AsmrProg 5 ай бұрын
🙏❤️
@justohechim4822 5 ай бұрын
Hello! Im here again asking you to do a section of projects you would consider useful for landing a first job as a developer. Love your videos man never stop. Thank u for ur efforts
@AsmrProg 5 ай бұрын
Hi, for this we will have full playlist, but not now! We need React for it, after React tutorials we will have a separate playlist for it 😉
@mansyurnasution2493 4 ай бұрын
hopefully next you share the tutorial to build webstore please@@AsmrProg
@AsmrProg 4 ай бұрын
@mansyurnasution2493 e-commerce projects after backend tutorials 🙏😉
@shahzaibbukhari6163 5 ай бұрын
Started following you when you uploaded the sudouku generator and solver with only 800 views and maybe 2k subs (used it as my sem project reference 😛) but now look at you go…❤
@AsmrProg 5 ай бұрын
Oh, we have an old subscriber here 😁 thanks so much for all of supports 🙏❤️
@DevDiario_ 4 ай бұрын
What program do you use to make the mouse cursor have this green circle and red stripe?
@AsmrProg 4 ай бұрын
Hi, it’s screen recorder effects!
@engagemedia.612 4 ай бұрын
Wow I respect that you respond to every single comment
@AsmrProg 3 ай бұрын
Thanks so much, Sorry for late response 🙏
@NimdaMC 5 ай бұрын
good video!
@AsmrProg 5 ай бұрын
Thanks 🙏❤️
@isaiahjackson7592 5 ай бұрын
I have a quick questinon, can you add the modern login page you did the other day ago to the dashboard that you made? So that when you login, it takes you to the dashboard depending on the user.
@AsmrProg 5 ай бұрын
Hi, yes we will do it with more better designs 😉 but after backend tutorials, because it’s need backend 🙏
@iipowerr2280 2 ай бұрын
I have a question if you don’t mind answering… How do you connect the user inputs to a database. Like for example every time they register a new account it appears in a database like in MySQL ? Do you have any feedback on that?
@AsmrProg 2 ай бұрын
Hi, with backend, depending on which language you used in backend, for example with php or … we use MySQL queries to create it 🙏
@iipowerr2280 2 ай бұрын
@@AsmrProg thanks brother!!!
@AsmrProg 2 ай бұрын
@iipowerr2280 🙏❤️
@najmcreatives 5 ай бұрын
nice 🥰
@AsmrProg 5 ай бұрын
Thanks so much 🙏❤️
@user-qq2mx2qj5k 4 ай бұрын
Transition property not working even I write this in ".login-section" in CSS? Help me.
@AsmrProg 4 ай бұрын
Hi, did you check my source code?! Sorry for late response 🙏
@QuikiHub 5 ай бұрын
Hello, I know I already asked this months ago but what software do you use to make the mouse do those cool effects.
@AsmrProg 5 ай бұрын
Hi, EZ Screen Recorder 🙏
@infecta 4 ай бұрын
bro listen, you want a "mouse trajectory" program, that's what it's called, google that. do some research and you'll find it his screen recorder is what adds the effect, it's not there in realtime
@QuikiHub 4 ай бұрын
@@infecta Yes, I understand that, and also thank you.
@AsmrProg 4 ай бұрын
Yes! 🙏❤️
@AsmrProg 4 ай бұрын
🙏❤️
@Rohxntharealest 3 ай бұрын
quick question are these pre coded or do you just come up with it on the spot
@AsmrProg 3 ай бұрын
Hi, videos are edited!
@nerevar4826 5 ай бұрын
Hello bro! Please help me! How to make a responsive website? I don't understand at all.Maybe I should use bootstrap?
@AsmrProg 5 ай бұрын
You can do it in different ways, easiest way is using frameworks such as bootstrap 🙏
@nerevar4826 4 ай бұрын
@@AsmrProgcan you send me the link?
@zryanomer6214 5 ай бұрын
well done , just i wanna ask a question can you tell me how increase ur skills in js?pls
@AsmrProg 5 ай бұрын
Hi, with daily experience and doing mini-projects!
@zryanomer6214 5 ай бұрын
@@AsmrProg thanks bro
@AsmrProg 5 ай бұрын
@zryanomer6214 🙏❤️
@calligraphywriting777 5 ай бұрын
Your are my fan because you from turkey nice design asmr give some video from HTML5 course
@AsmrProg 5 ай бұрын
Hi, thanks 🙏 for course we will have soon 😉
@MrVelionid 5 ай бұрын
What kind of font do you use?
@AsmrProg 5 ай бұрын
Hi, i answered you in your another comment 🙏
@Kaidarkwind1 Ай бұрын
schaue mir deine videos gerne an und mache auch noch eine 2 lehre als applikationsentwickler und lerne gerade html css javascript und php und mysql weil mich fasziniert programmieren einfach schon seit jahren und will es jetzt umsetzen den code kann ich ja immerhin lesen aber programmieren sowie ich es mir vorstelle sitzt noch nichts so ganz
@ahmedraza6984 4 ай бұрын
Hey... What's your theme in vs code and cursor.. i like that
@AsmrProg 4 ай бұрын
Hi, please check my GitHub, there is a repository about all of my vscode settings Sorry for late response 🙏
@unepiic 3 ай бұрын
How do you get that background?
@AsmrProg 3 ай бұрын
Hi, with glassit extension, Sorry for late response 🙏
@bestamazonfinds214 5 ай бұрын
Hello sir, i want to know how to do full webpages please help me
@AsmrProg 5 ай бұрын
Hi, sorry but what means full webpage?!
@notrealaz 4 ай бұрын
how do i make my html vs code run and auto update?
@AsmrProg 4 ай бұрын
Hi, with live server extension 🙏
@notrealaz 4 ай бұрын
@@AsmrProgoh thanks i did that too
@AsmrProg 4 ай бұрын
@thesillyaz 🙏❤️
@fotisrokanis5463 5 ай бұрын
What mic are you using? And in general, what is your setup?
@AsmrProg 5 ай бұрын
Hi, it’s iphone 13 promax mic, you mean my pc specs?!
@fotisrokanis5463 5 ай бұрын
@@AsmrProg Νο, I meant how do you record the keyboard sound. I love the whole video style, and would like to create something similar.
@AsmrProg 5 ай бұрын
Nothing just recording with iphone 13 promax and editing it in Adobe Audition 🙏
@GorkemYazici53 5 ай бұрын
💯💯💯
@AsmrProg 5 ай бұрын
🙏❤️
@yahatkunnarak1919 5 ай бұрын
❤❤
@AsmrProg 5 ай бұрын
🙏❤️
@Ghostlynotme445 5 ай бұрын
What mouse you have?
@AsmrProg 5 ай бұрын
Hi, it’s screen recorder effects!
@Ghostlynotme445 5 ай бұрын
@@AsmrProg so the mouse is fake?
@AsmrProg 5 ай бұрын
@Ghostlynotme445 isn’t fake, animations are with it!
@nassermrine5936 5 ай бұрын
please name of this keyboard
@AsmrProg 5 ай бұрын
Hi, it’s Epomaker TH80-X, full info on description 🙏
@sankarreddy9424 5 ай бұрын
Why there is forgot pass in signup form 🤔
@AsmrProg 5 ай бұрын
Oh! Yes, i added it by mistake, i will fix it in source code, thanks for telling me 🙏❤️
@whshjxu 5 ай бұрын
Can you make SQL code for signup page
@AsmrProg 5 ай бұрын
We will have full backend tutorials soon 😉
@rafileigh790 5 ай бұрын
What happened to 100 days of code?
@AsmrProg 5 ай бұрын
We have a new video of it 😉
@garrettbricker4765 4 ай бұрын
how do you forget ur password when you sign up?
@AsmrProg 4 ай бұрын
Hi, yes, it was a mistake, fixed in source code 🙏
@Hacker1.K 4 ай бұрын
please , What is the name of the app you're working on?
@AsmrProg 4 ай бұрын
Hi, it’s visual studio code 🙏
@Hacker1.K 4 ай бұрын
thanks @@AsmrProg ❤
@AsmrProg 3 ай бұрын
@Hacker1.K 🙏❤️
@Yash_badgujar64 5 ай бұрын
Uiux designer ka interview hard hota hai kya 😢
@AsmrProg 5 ай бұрын
No why!?
@YoussefAhmed-pm1nf 5 ай бұрын
Noice
@AsmrProg 5 ай бұрын
Thanks 🙏❤️
@gagan7092 4 ай бұрын
when is it going to be my idea on the rocket thing
@AsmrProg 4 ай бұрын
🙏❤️😉
@LorenzoBrumDietrich 5 ай бұрын
What is Responsible in Web-Development?
@AsmrProg 5 ай бұрын
Hi, you mean responsive?!
@LorenzoBrumDietrich 5 ай бұрын
@@AsmrProg yes
@AsmrProg 5 ай бұрын
It refers to the design and development approach that ensures a website or application adapts and displays appropriately on various devices and screen sizes.
@MishaNguyen-kv6bi 5 ай бұрын
best keyboard sound chill not like other sound very noisy and uncomfortable
@AsmrProg 5 ай бұрын
Thanks, keyboard info on description 🙏❤️
@TipforyouByD 4 ай бұрын
🤩🥰🥰
@AsmrProg 4 ай бұрын
🙏❤️
@MrVelionid 5 ай бұрын
kzfaq.info/get/bejne/h9CUfsZ6u9qqfH0.htmlsi=elRSrEvt_tkigQD7 What kind of font do you use?
@AsmrProg 5 ай бұрын
Hi, Cascadia Code font 🙏
@tottatta 5 ай бұрын
pls URL
@AsmrProg 5 ай бұрын
Hi, Added ✅
@jamofv. 3 ай бұрын
how do you make the buttons actually work? as in logging them in/signing them up then transitioning to a new page?
@AsmrProg 3 ай бұрын
Hi, you need to add backend to it 🙏
@shush5818 5 ай бұрын
You dont really need a "Forgot password" link in the sign up tab, right? haha
@AsmrProg 5 ай бұрын
Hi, yes, did it by mistake, i will fix it in source code 🙏❤️
@ifeanyinnaemego 5 ай бұрын
Hello am still asking about your editor design
@ifeanyinnaemego 5 ай бұрын
I would love to setup mind like yours
@AsmrProg 5 ай бұрын
Hi, did you checked my github?! There is a repository about all of my vscode settings!
@ifeanyinnaemego 5 ай бұрын
@@AsmrProg let me check
@AsmrProg 5 ай бұрын
🙏
@ifeanyinnaemego 5 ай бұрын
@@AsmrProg I did check it was missing how you added the background image, but I found it online, thanks
@BoosterHSTgamingFF 5 ай бұрын
sir how to learn javascript
@biqavou9059 5 ай бұрын
Bro code course on KZfaq
@AsmrProg 5 ай бұрын
Hi, with courses!
@AsmrProg 5 ай бұрын
Thanks for answering 🙏
@AsmrProg 5 ай бұрын
@rafileigh790 🙏❤️
@AsmrProg 5 ай бұрын
@HuGoVeRdOsE999 🙄🙄
@erdyssloli798 5 ай бұрын
pls make video doing a game with JAVASCRIPT ty
@AsmrProg 5 ай бұрын
Hi, did you checked my ASMR Game Coding playlist?!
@erdyssloli798 5 ай бұрын
@@AsmrProg no but i,m gonna check rn tyy so much and i rlly love ur work keep it up
@AsmrProg 5 ай бұрын
@erdyssloli798 thanks so much 🙏❤️
@FourTran 5 ай бұрын
Face reveal when bro
@AsmrProg 5 ай бұрын
Hi, in courses 😉❤️
@user-yn1sr8ws8w 5 ай бұрын
可以教我吗
@AsmrProg 5 ай бұрын
Sorry!?
@user-yn1sr8ws8w 5 ай бұрын
@@AsmrProg 我想学编程
@AsmrProg 5 ай бұрын
@user-yn1sr8ws8w !!!
@try_again...9107 5 ай бұрын
where are you from brother
@AsmrProg 5 ай бұрын
Hi, sorry but it’s private 🙏
@try_again...9107 5 ай бұрын
I learn coding from KZfaq, in which I have subscribed to 3 channels, one of which is yours. Sir, you are a teacher for me.
@AsmrProg 5 ай бұрын
@try_again...9107 thanks so much, in the future you will surprise with courses 😉
Александр Ламков — Friendly Frontend
Рет қаралды 46 М.