https://github.com/vishal-raj-1/web-development-tutorials
Web Development Tutorials For Beginners
https://github.com/vishal-raj-1/web-development-tutorials
css hacktoberfest hacktoberfest2020 html5 javascript webdevelopment webdevelopmentcourse
Last synced: 7 months ago
JSON representation
Web Development Tutorials For Beginners
- Host: GitHub
- URL: https://github.com/vishal-raj-1/web-development-tutorials
- Owner: Vishal-raj-1
- Created: 2020-08-12T13:53:29.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2020-10-24T08:35:47.000Z (almost 5 years ago)
- Last Synced: 2025-01-14T02:12:58.934Z (9 months ago)
- Topics: css, hacktoberfest, hacktoberfest2020, html5, javascript, webdevelopment, webdevelopmentcourse
- Language: HTML
- Homepage:
- Size: 188 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Web-Development-Tutorials
This Repository contains everything you should know to become an awesome web developer including some great projects.
## Table of Content
1. [HTML5](#HTML5)
2. [CSS3](#CSS3)
3. JAVASCRIPT
4. NodeJs
5. MongoDb
6. [Projects](#Projects)
HTML5
Hypertext Markup Language, a standardized system for tagging text files to achieve font, colour, graphic, and hyperlink effects on World Wide Web pages.
**Topics covered in HTML5 are :**
1. [What are tags and Meta tags](https://youtu.be/EZCc_4abdcE)
2. [Heading and Paragraph](https://www.youtube.com/watch?v=ulv_q6-b7uI&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=5)
3. [Img and Anchor Tags](https://www.youtube.com/watch?v=z6H22xGAZEA&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=6)
4. [List and Tables](https://www.youtube.com/watch?v=N69xumSjg5Q&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=7)
5. [Forms and Input Tags](https://www.youtube.com/watch?v=KqJikDzb3l4&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=8)
6. [Inline and Block Elements](https://www.youtube.com/watch?v=DFT9qxVCF6k&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=9)
7. [Ids and Classes](https://www.youtube.com/watch?v=BucLTOfLQsk&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=10)
8. [HTML Entities](https://www.youtube.com/watch?v=gw1efv5WF_Q&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=11)
9. [Semantic Tags](https://www.youtube.com/watch?v=FKfsmV6otEM&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=12)
CSS3
* CSS stands for Cascading Style Sheets
* CSS describes how HTML elements are to be displayed on screen, paper, or in other media
* CSS saves a lot of work. It can control the layout of multiple web pages all at once
* External stylesheets are stored in CSS files
**Topics covered in CSS3 are :**
1. [Types of CSS](https://www.youtube.com/watch?v=ArUL-He_AN0&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=14)
2. [Selectors in CSS](https://www.youtube.com/watch?v=oPPym7UaSIo&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=15)
3. [Chrome Developers tools](https://www.youtube.com/watch?v=buxedopZbKM&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=16)
4. [Fonts](https://www.youtube.com/watch?v=5Gz7j4gDrXM&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=17)
5. [Colors](https://www.youtube.com/watch?v=EEw5OJCsiDs&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=18)
6. [Borders and Backgrounds](https://www.youtube.com/watch?v=2zcHiaHo4Jo&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=19)
7. [Box Model, Margin and Padding](https://www.youtube.com/watch?v=5koxb4JaDqc&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=20)
8. [Float and Clear](https://www.youtube.com/watch?v=6G42rXal5-g&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=21)
9. [Styling links and Buttons](https://www.youtube.com/watch?v=3lAl7RNqp1c&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=22)
10. [Navigation Menu](https://www.youtube.com/watch?v=OsPOBsclJLU&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=23)
11. [Display Property](https://www.youtube.com/watch?v=YJtlXrzXXFk&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=24)
12. [Different types of Positions](https://www.youtube.com/watch?v=MwGHiVl-gqk&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=25)
13. [Visibility and Z-Index](https://www.youtube.com/watch?v=Uzuq2FGxgK4&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=27)
14. [CSS Flexbox](https://www.youtube.com/watch?v=4ykmsTpIn08&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=28)
15. [em, rem , vh, vw Units](https://www.youtube.com/watch?v=DVjrb52C5Gs&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=29)
16. [Media Queries](https://www.youtube.com/watch?v=WTz4A8IdeEQ&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=30)
17. [More on CSS selectors](https://www.youtube.com/watch?v=WwUM7qOimbo&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=31)
18. [Attribute and nth child Pseudo Selectors](https://www.youtube.com/watch?v=P-hZDC5YkJE&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=32)
19. [Before and After Pseudo Selectors](https://www.youtube.com/watch?v=PlKG1fooswU&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=33)
20. [Box Shadow and Text Shadow](https://www.youtube.com/watch?v=ASNldCkFBcM&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=34)
21. [Variables and Custom Properties](https://www.youtube.com/watch?v=ghlm_94oR90&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=35)
22. [Animations and Keyframes](https://www.youtube.com/watch?v=jiK6Mf-ILSg&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=36)
23. [Creating Transitions](https://www.youtube.com/watch?v=k4Dr0PJKidI&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=37)
24. [Transform Property](https://www.youtube.com/watch?v=K0Gz7CKNJzY&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=38)
25. [CSS Grids](https://www.youtube.com/watch?v=MPl9bevckUE&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=40)
Projects
1. Gym Website
2. Online Meal Delivery Website