20 Web Projects build 20 HTML, CSS and JavaScript projects

Focused View

Vijay Kumar

10:38:20

10 View

1 - Introduction

1 - Introduction.mp4

01:54

2 - 2 Download the Required Softwares for the Course.mp4

06:57

2 - All-Projects-Source-Code-of-20-Protfoilio-Proejcts-Course-in-JS.zip

2 - Key Codes Project

3 - Key Codes Preview.mp4

02:12

4 - Key Codes HTML.mp4

03:50

5 - Key Codes CSS.mp4

13:13

6 - 1-Source-Code-of-Project-Key-Codes-Project.rar

6 - Key Codes JS.mp4

09:57

3 - Drops Animation Project

7 - Drops Animation Preview.mp4

01:17

8 - Drops Animation HTML.mp4

01:23

9 - Drops Animation CSS.mp4

04:44

10 - 2-Source-Code-of-Project-Drops-Animation.rar

10 - Drops Animation JS.mp4

06:23

4 - Name Tag Sticker Project

11 - Name Tag Sticker Preview.mp4

01:03

12 - Name Tag Sticker HTML.mp4

03:14

13 - Name Tag Sticker CSS.mp4

08:52

14 - 3-Source-Code-of-Project-Name-Tag-Sticker.rar

14 - Name Tag Sticker JS.mp4

12:03

5 - Coin Flip Application

15 - Coin Flip Application Preview.mp4

01:37

16 - Coin Flip Application HTML.mp4

03:57

17 - Coin Flip Application CSS.mp4

09:44

18 - 4-Source-Code-of-Project-Coin-Flip-Application.rar

18 - Coin Flip Application JS.mp4

15:25

6 - Smoke Effect

19 - Smoke Effect Preview.mp4

01:16

20 - Smoke Effect HTML.mp4

02:58

21 - Smoke Effect CSS.mp4

06:47

22 - 5-Source-Code-of-Project-Smoke-Effect-Project.rar

22 - Smoke Effect JS.mp4

05:46

7 - Timeline Project

23 - Time Line Project Preview.mp4

02:02

24 - Time Line Project HTML.mp4

03:45

25 - Time Line Project CSS.mp4

11:17

26 - 6-Source-Code-of-Project-Timeline-Project.rar

26 - Time Line Project JS.mp4

11:43

8 - Drag and Drop Application

27 - Drag and Drop Preview.mp4

01:54

28 - Drag and Drop HTML.mp4

02:52

29 - Drag and Drop CSS.mp4

07:05

30 - 7-Source-Code-of-Project-Drag-and-Drop-Project.rar

30 - Drag and Drop JS.mp4

14:27

9 - Temperature Converter Application

31 - Temperature Converter Preview.mp4

01:56

32 - Temperature Converter HTML.mp4

03:50

33 - Temperature Converter CSS.mp4

07:21

34 - 8-Source-Code-of-Project-Temperature-Converter.rar

34 - Temperature Converter JS.mp4

11:04

10 - Click to Visible Application

35 - Click to Visible Letters Preview.mp4

01:01

36 - Click to Visible Letters HTML.mp4

02:27

37 - Click to Visible Letters CSS.mp4

03:58

38 - 9-Source-Code-of-Project-Click-to-Visible-Letters.rar

38 - Click to Visible Letter JS.mp4

04:32

11 - Copy to Clipboard Application

0 - Copy to Clipboard Application JS.mp4

08:54

39 - Copy to Clipboard Application Preview.mp4

01:11

40 - Copy to Clipboard Application HTML.mp4

03:29

41 - Copy to Clipboard Application CSS.mp4

09:21

42 - 10-Source-Code-of-Project-Click-to-Copy-Clipboard.rar

42 - Copy to Clipboard Application JS.mp4

08:54

12 - Slider to Change BG Color

43 - Slider to Change BG Color Preview.mp4

00:45

44 - Slider to Change BG Color HTML.mp4

01:55

45 - Slider to Change BG Color CSS.mp4

09:48

46 - 11-Source-Code-of-Project-Slider-to-Change-BG-Color.rar

46 - Slider to Change BG Color JS.mp4

09:56

13 - Bubbles Particle Application

47 - Bubbles Particle Application Preview.mp4

00:44

48 - Bubbles Particle Application HTML.mp4

02:40

49 - Bubbles Particle Application CSS.mp4

04:20

50 - 12-Source-Code-of-Project-Bubbles-Particle-Application.rar

50 - Bubbles Particle Application JS.mp4

07:44

14 - Testimonial Application

51 - Testimonial Slider Application Preview.mp4

01:40

52 - Testimonial Slider Application HTML.mp4

03:23

53 - Testimonial Slider Application CSS.mp4

14:15

54 - 13-Source-Code-of-Project-Testimonial-Application.rar

54 - Testimonial Slider Application JS.mp4

12:10

15 - Icon Hover Project

55 - Icon Hover Effect Application.mp4

01:50

56 - Icon Hover Effect HTML.mp4

03:38

57 - Icon Hover Effect CSS.mp4

06:08

58 - 14-Source-Code-of-Project-Icon-Hover-Effect.rar

58 - Icon Hover Effect JS.mp4

03:36

16 - Navbar Project

59 - Navbar Preview.mp4

01:16

60 - Navbar HTML.mp4

04:14

61 - Navbar CSS.mp4

18:11

62 - 15-Source-Code-of-Project-Navbar-Project.rar

62 - Navbar JS.mp4

04:02

17 - Stopwatch Timer Application

63 - Stopwatch Timer Application Preview.mp4

01:40

64 - Stopwatch Timer Application HTML.mp4

06:00

65 - Stopwatch Timer Application CSS.mp4

16:34

66 - 16-Source-Code-of-Project-Stopwatch-Timer-Application.rar

66 - Stopwatch Timer Application JS.mp4

28:14

18 - Vowel Counter Application

67 - Vowel Counter Application Preview.mp4

01:00

68 - Vowel Counter Application HTML.mp4

03:33

69 - Vowel Counter Application CSS.mp4

12:02

70 - 17-Source-Code-of-Project-Vowel-Counter.rar

70 - Vowel Counter Application JS.mp4

10:07

19 - Poll System Application

71 - Poll System Application Preview.mp4

01:16

72 - Poll System Application HTML.mp4

04:14

73 - Poll System Application CSS.mp4

14:07

74 - 18-Source-Code-of-Project-Poll-System-Application.rar

74 - Poll System Application JS.mp4

29:55

20 - Random Password Application

75 - Random Password Application Preview.mp4

01:57

76 - Random Password Application HTML.mp4

10:51

77 - Random Password Application CSS.mp4

15:58

78 - 19-Source-Code-of-Project-Random-Color-Generator.rar

78 - Random Password Application JS.mp4

32:18

21 - Cash Calculator Application

79 - Cash Calculator Application Preview.mp4

03:24

80 - Cash Calculator Application HTML.mp4

11:23

81 - Cash Calculator Application CSS.mp4

21:38

82 - Cash Calculator Application JS Part 1.mp4

20:19

83 - 20-Source-Code-of-Project-Cash-Calculator-Application.rar

83 - Cash Calculator Application JS Part 2.mp4

32:00

22 - Bonus

84 - All-Projects-Source-Code-of-20-Protfoilio-Proejcts-Course-in-JS.zip

84 - Bonus.html

84 - Bonus.txt

Description

Modern HTML5, CSS3, and JavaScript to build Responsive and Mobile Friendly projects for your dream portfolio and resume!

What You'll Learn?

Immerse yourself in the creation of 20 captivating web projects using pure JavaScript, HTML5, and CSS3, with all the code at your fingertips.
Journey from a total beginner to a confident JavaScript developer, gaining the skills and knowledge needed to excel in the field.
Acquire the art of writing clean, maintainable, and high-performing JavaScript code, setting you apart as a skilled developer.
Navigate the realm of Web APIs, including localStorage, DOM manipulation, and more, to elevate your applications with dynamic functionality.
Harness the potential of modern CSS3, utilizing Animations, Transitions, Variables, and other tools to add flair and interactivity to your designs.
Steer clear of common pitfalls by learning from the mistakes commonly made by JavaScript programmers and beginners.
Unleash your creativity and expertise as you build 20 stunning and customizable real-world front-end applications, each showcasing your newfound skills.

Who is this for?

Anyone who feels like they can't build JavaScript projects on their own

Anyone who wants to become a web developer, switch careers, or freelance as a JavaScript developer.

New or junior developers who want to learn modern JavaScript

Programmers who want to learn frontend web development

Anyone who needs to add more projects to their portfolio or resume

Developers who know the basics of JavaScript and want to deepen their knowledge

What You Need to Know?

Only a basic understanding of HTML & CSS & JavaScript

Any computer and OS will work — Windows, Mac or Linux.

More details

Description
Embark on a transformative journey into the world of JavaScript with our comprehensive course, "JavaScript Mastery: Build 20 Real Projects." Whether you're a total beginner or looking to enhance your coding prowess, this course is your gateway to becoming a confident JavaScript developer. Utilizing modern ES6, ES7, ES8, ES9, and ES10 features, you'll not only master the language but also gain hands-on experience through 20 real-world projects that will elevate your portfolio.
So what are we building? Get ready for this:
1. Key-Codes Application: Uncover the magic behind key codes and implement an application that showcases the real-time interpretation of keyboard input.
2. Drops Animation Project: Dive into the world of animations with a mesmerizing project that simulates animated drops falling on a screen.
3. Name Tag Application: Create a personalized name tag application that allows users to input their names and generates a dynamic, stylized tag.
4. Coin Flip Application: Develop a fun and interactive coin-flipping application, complete with animated flips and dynamic outcomes.
5. Smoke Effect Project: Master the art of visual effects with a captivating smoke effect project, demonstrating the power of JavaScript in creating immersive UI experiences.
6. Timeline Project: Construct a dynamic timeline application that visually represents events chronologically, enhancing your understanding of data visualization.
7. Drag and Drop Project: Learn the principles of drag-and-drop functionality by building an application that enables users to effortlessly rearrange elements.
8. Temperature Converter: Develop a practical temperature converter application, providing users with a seamless tool for converting between Celsius and Fahrenheit.
9. Click on Visible Letters Project: Explore interactivity with an engaging project that reacts to user clicks, revealing hidden letters and enhancing user engagement.
10. Copy to Clipboard Application: Implement a clipboard functionality that empowers users to easily copy text, adding a practical touch to your skill set.
11. Slider to Change BG Color Application: Elevate your design skills by creating a slider application that dynamically changes the background color, emphasizing the power of user interface customization.
12. Testimonial Slider Project: Craft a testimonial slider that seamlessly showcases user reviews, combining JavaScript functionality with a polished user interface.
13. Icon Hover Effect Project: Delve into creative design with an icon hover effect project, demonstrating the synergy between JavaScript and visual aesthetics.
14. Navigation Bar Project: Build a sophisticated navigation bar that enhances user experience, incorporating smooth transitions and responsive design elements.
15. Floating Bubbles Project: Dive into the world of dynamic visual effects by creating a floating bubbles project, adding an extra layer of interactivity to your repertoire.
16. Stopwatch Timer Application: Develop a versatile stopwatch timer application that combines precision timekeeping with a user-friendly interface.
17. Vowel Counter Application: Explore string manipulation and build a vowel counter application, showcasing practical JavaScript applications in text analysis.
18. Poll System Application: Construct a robust poll system application, demonstrating your ability to manage and display user-generated data dynamically.
19. Random Password Generator Application: Enhance your cybersecurity skills by creating a random password generator application, emphasizing the importance of secure coding practices.
20. Cash Calculator Application: Develop a financial tool with a cash calculator application, showcasing the versatility of JavaScript in real-world applications.
Why Learn HTML, CSS, and JavaScript:
Mastering HTML, CSS, and JavaScript is the cornerstone of web development. HTML structures the content, CSS styles the presentation, and JavaScript brings interactivity to life. Together, they form the essential trio that empowers you to build dynamic and engaging web applications.
HTML (HyperText Markup Language): Learn the foundation of web development, as HTML structures the content of websites. Understand how to create well-organized and semantic markup for enhanced accessibility and SEO.
CSS (Cascading Style Sheets): Elevate your design skills with CSS, as it enables you to style and format HTML elements. Dive into animations, transitions, and responsive design to create visually stunning and user-friendly interfaces.
JavaScript: Unleash the full potential of web development with JavaScript. From dynamic content updates to interactive user interfaces, JavaScript is the scripting language that adds life and functionality to your web applications.
By mastering these technologies, you not only gain the skills to build captivating projects but also open the door to endless opportunities in the ever-evolving world of web development. Enroll today to start your journey toward becoming a well-rounded and proficient developer.
Your journey starts now. See you on the course! :)
Who this course is for:
Anyone who feels like they can't build JavaScript projects on their own
Anyone who wants to become a web developer, switch careers, or freelance as a JavaScript developer.
New or junior developers who want to learn modern JavaScript
Programmers who want to learn frontend web development
Anyone who needs to add more projects to their portfolio or resume
Developers who know the basics of JavaScript and want to deepen their knowledge

User Reviews

Rating

average 0

Total votes0

Focused display

Welcome to the "Dino Code Academy" and "Info with Vijay" YouTube Channels Here, you'll discover a treasure trove of free courses covering Android programming, graphics designing, and various programming languages. But that's not all! Get ready for a plethora of game programming lectures too.I created this channel to share my learning journey and showcase the exciting projects I've developed through my own exploration. My goal is to make learning accessible and enjoyable for everyone. That's why I strive to create videos that are clear, concise, and easy to understand.So, whether you're a beginner looking to dive into the world of programming or an experienced developer seeking to enhance your skills, you've come to the right place. Join our growing community of learners, hit that subscribe button, and embark on a transformative learning experience. Get ready to unlock your full potential and create amazing things with code. Let's start this incredible journey together!

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.