Build a Beautiful Automatic Calendar | HTML, CSS & JavaScript Tutorial
HTML-код
- Опубликовано: 5 июн 2024
- Hey Everyone, Welcome back to my tutorial. In this tutorial, I will show you, how to create a beautiful automatic changing Calendar, using HTML, CSS and JavaScript.
• Please Be Sure to drop a LIKE on this video, and SUBSCRIBE to my Channel for more videos.
==============================================================
• Timestamps:-
00:00 - Introduction
00:54 - HTML Code
04:18 - CSS Code
17:44 - JavaScript Code
29:51 - Giving Calendar A More Cleaner Look
30:56 - Fixing Bug
31:30 - Final Output
==============================================================
• Important Links:-
1. VSCode - code.visualstudio.com/
2. Live Server Extension - marketplace.visualstudio.com/...
3. BG Image - bit.ly/38V4vFD
4. Moment JS Library - momentjs.com/
==============================================================
• Follow me on Instagram: @techy_sharnav
• Add me on Discord: TechySharnav#1615
===============================================================
◘ My other Programming Tutorials →
• Random Hex Color Generator (HTML, CSS, JS):- • Adaptive Random Hex Co...
Multi-layered Text Shadow Effect (HTML & CSS):- • Multi-layered Text Sha...
• My Python Tutorial Playlist : tiny.cc/amwaqz
• Auto Typer (Visual Basic Script): • How to make an Auto Ty...
• Prank Virus (Visual Basic Script): • How to create a Prank...
===============================================================
◘ Some of my How-to Tutorials →
• Add Custom Theme to IDLE: • How to add Custom Them...
• Change OEM information on Windows: • How to Change OEM Logo...
• Add Icons to Folders: • How to Customize Folde...
• Change skin of your mouse cursor: • How to add Custom Them...
• Download RUclips videos using VLC: • How to download YouTub...
• Change Lockscreen Background in Windows 7: • How to Change Lockscre...
Download Source Code:- bit.ly/3NMai3P
Hey! I just found your channel and subscribed, love what you're doing! Particularly, I like how clear and detailed your explanations are as well as the depth of knowledge you have surrounding the topic! Since I run a tech education channel as well, I love to see fellow Content Creators sharing, educating, and inspiring a large global audience. I wish you the best of luck on your RUclips Journey, can't wait to see you succeed!
Your content really stands out and you've put so much thought into your videos!
Cheers, happy holidays, and keep up the great work :)
Very Very Much Thank you brother! Your words mean a lot to me.
I also wish you luck and success for your channel.
@@SharnavTech No problem, I'm so glad I could help you out!
First tutorial video on youtube with the most number of ads. I counted out of curiosity and noticed 20+ ads in 32 minutes video. Not fair mate! I know we all do it to make some cash but not to this extent. Honestly!
Thank you for bringing this to my attention. It's not me who has placed the ads. It's added by RUclips automatically. Now, I'll manually place 3-4 ads only. Kindly check after a few hours.
I like the code it so look professional I would like to add how see the list of month like they have an additional buttons to see every month
Thanks! The buttons can be implemented, but its quite a bit of work to do.
(with the animation)
Thank You 👌👌👌
Welcome :)
I love this your videos
Thanks man
at 23:11, i dont understand where that "obj" comes from ? .... cause i dont see you calling the function "getDate()" inside the function generateCalendar(), to get the returned values from "getDate()" ? its confusing to me !! thank you.. !!
'obj' is a global variable, that is declared after declaring the getDate function. See 22:32
Hello please where from the calendar number class you called in the CSS?
Sorry, I am not able to get you properly. If you meant where the 'calender__number' class came from, then it comes from JavaScript (see 28:30).
спасибо за видео,привет из россии,подписался!
Добро пожаловать и спасибо за подписку!
Can I ask? where does "calendar__number" came from?
That class comes from JavaScript, from the for loop.
at 24:40 I have error ,
moment is not defined at generateCalendar
You need to include moment.js library into the project. See 3:05 - 3:50
Fantastic 😍💋 💝💖♥️❤️
Thanks dude!!
brother can i have the source code?
Check pinned comment.
I need source code
Check pinned comment.
no working... full problems importing moment.js to my vscode project... dislike
What problems are you facing? Please elaborate.
@@SharnavTech Uncaught SyntaxError: The requested module '../../etc' does not provide an export named 'moment' (at '../../etc), i have this problem and i try to solve it with many syntax to import the node.js Moment.js to my javascript project... but nothing working... all my route is ok and the links too.. i doesnt have idea what i do now. My project based vscode and y have html, css and javascript. y copy and all it, but the problems is the import of Moment.js to my javascript...
Moment is available as a library for NodeJS. You can simply install it by executing 'npm i moment' in the root directory of your project.
Then you can simply import by using
import moment from 'moment';
www.npmjs.com/package/moment
@@SharnavTech not working...if you have discord pass me you id and i talk to you for solve this problem.. (edited: i have seen your id on your description, I'm talking to you right now)