Project-with-JavaScript/index.html at main · sujeetkumar-29/Project-with-JavaScript · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Project</title>
    <link rel="stylesheet" href="style.css">
    <link rel="icon" href="projectImg/javascript.png">
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
</head>
<body>
    <div class="topbar">
        <p>Project with JavaScripts</p>
        <hr>
    </div>
    <div class="container">
        <div class="projectBox">
            <img src="projectImg/calender.png" alt="projectImg">
            <h3>Calender</h3>
            <p> It allows users to view and navigate through months and years.</p>
            <a href="/Project-with-JavaScript/Project/Calender/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/Calender" target="_blank">Github</a>

        </div>
        <div class="projectBox">
            <img src="projectImg/bmi_calc.png" alt="projectImg">
            <h3>BMI Calculator</h3>
            <p> It helps users calculate their Body Mass Index based on their weight and height.</p>
            <a href="/Project-with-JavaScript/Project/bmi_calculator/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/BMI%20Calculator" target="_blank">Github</a>

        </div>
        <div class="projectBox">
            <img src="projectImg/calc.png" alt="projectImg">
            <h3>Simple Calculator</h3>
            <p>It performs basic arithmetic operations like addition, subtraction, multiplication, and division.</p>
            <a href="/Project-with-JavaScript/Project/Calculator/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/Calculator">Github</a>
        </div>
        <div class="projectBox">
            <img src="projectImg/digital_clock.png" alt="projectImg">
            <h3>Digital Clock</h3>
            <p>It displays the current time in hours, minutes, and seconds, updating every second.</p>
            <a href="/Project-with-JavaScript/Project/digital_clock/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/Digital%20Clock">Github</a>
        </div>
        <div class="projectBox">
            <img src="projectImg/dum_kit.png" alt="projectImg">
            <h3>Drum Kit</h3>
            <p>It allows users to play drum sounds by clicking on the drum pads or pressing corresponding keyboard keys.</p>
            <a href="/Project-with-JavaScript/Project/drum_kit/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/Drum%20Kit" target="_blank">Github</a>
        </div>
        <div class="projectBox">
            <img src="projectImg/key_code.png" alt="projectImg">
            <h3>Key Codes</h3>
            <p>It displays the key code of the key pressed on the keyboard, helping users understand key events.</p>
            <a href="/Project-with-JavaScript/Project/key_code/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/key%20code" target="_blank" >Github</a>
        </div>
        <div class="projectBox">
            <img src="projectImg/github_profile.png" alt="projectImg">
            <h3>Github Profile Viewer</h3>
            <p>It fetches and displays GitHub user profiles, including their repositories, followers, and other details.</p>
            <a href="/Project-with-JavaScript/Project/github_profile_viewer/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/Github%20Profile%20Viewer" target="_blank">Github</a>
        </div>
        <div class="projectBox">
            <img src="projectImg/joke_gen.png" alt="projectImg">
            <h3>Jokes Generator</h3>
            <p>It generates random jokes for users to enjoy and lighten their mood.</p>
            <a href="/Project-with-JavaScript/Project/joke_generator/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/Joke%20Generator" target="_blank">Github</a>
        </div>
        <div class="projectBox">
            <img src="projectImg/emoji_switcher.png" alt="projectImg">
            <h3>Random Emoji Switcher</h3>
            <p>It switches between random emojis, providing a fun and interactive experience for users.</p>
            <a href="/Project-with-JavaScript/Project/random_emoji_switcher/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/Random%20Emoji%20Switcher" target="_blank">Github</a>
        </div>
        <div class="projectBox">
            <img src="projectImg/tic_tac_toe.png" alt="projectImg">
            <h3>Tic Tac Toe</h3>
            <p>It is a classic two-player game where players take turns marking spaces in a 3x3 grid to achieve three in a row.</p>
            <a href="/Project-with-JavaScript/Project/tic_tac_toe/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/Tic%20Tac%20Toe" target="_blank">Github</a>
        </div>
        <div class="projectBox">
            <img src="projectImg/weather.png" alt="projectImg">
            <h3>Weather app</h3>
            <p>It provides real-time weather updates for any location, including temperature, humidity, and weather conditions.</p>
            <a href="/Project-with-JavaScript/Project/weather_app/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/Weather%20app" target="_blank">Github</a>
        </div>
        <div class="projectBox">
            <img src="projectImg/whack_a_mole.png" alt="projectImg">
            <h3>Whack-a-mole!</h3>
            <p>It is a fun and interactive game where users try to hit the moles as they pop up from their holes.</p>
            <a href="/Project-with-JavaScript/Project/whack_a_mole/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/Whack%20a%20Mole" target="_blank">Github</a>
        </div>

        <div class="projectBox">
            <img src="projectImg/word_counter.png" alt="projectImg">
            <h3>Word counter</h3>
            <p>It counts the number of words in a given text, helping users analyze their content efficiently.</p>
            <a href="/Project-with-JavaScript/Project/word_counter/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/Word%20Counter" target="_blank">Github</a>
        </div>
        <div class="projectBox">
            <img src="projectImg/password_gen.png" alt="projectImg">
            <h3>Random password generator</h3>
            <p>It generates secure and random passwords to enhance user account security.</p>
            <a href="/Project-with-JavaScript/Project/random_password_generator/" target="_blank">Live</a>
            <a href="https://github.com/sujeetkumar-29/Project-with-JavaScript/tree/main/Project/Random%20Password%20Generator" target="_blank">Github</a>
        </div>
    </div>
    <script src="app.js"></script>
</body>
</html>