MrDevKnown

SELECT * FROM world WHERE humanity IS NOT NULL;

  • Home
  • About
  • Contact Us

 Hey fella's,

Here I am with a new post.

In this post, I am gonna create a tic tac toe game but with pure html, css and js. Yeah, it's a little waste of time to not use any help from libraries as such, but I love to code.

So, let's make everything on our own.

Umm, actually it's a very easy project. Nothing needs to be created or hyped like a great work. I just wanted to post something after many months, so I am creating this.


Challenges

  • Build responsive design 😥
  • Code JavaScript on my own 😣
  • No awesome components/functions of React 🤨

I guess, I am acting too much.
Let's Begin


I coded for a few minutes and surprisingly, every logic I made worked.

It took me few minutes to make the basic work, changing the content inside the blocks and adding a few conditions.

But I want perfection.😅

Umm, actually I am not good at finalizing things at once...

So, after a few hours,
This is what I made
MrDevKnown - Tic Tac Toe Game made in HTML, CSS JS

MrDevKnown - Tic Tac Toe Game made in HTML, CSS JS (image 2)

MrDevKnown - Tic Tac Toe Game made in HTML, CSS JS (image 3)

MrDevKnown - Tic Tac Toe Game made in HTML, CSS JS (image 4)

How is it? Let me know in the comments.

Now, let me show you the code.

Actually it's very messed up, I am feeling embarrassed to show it. But, in the next post, I'll try to fix up things a little.


Code

// html part
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>T3 - by Shivesh</title>
</head>

<body>
    <div class="container">
        <div class="main_game">
            <div class="heading">
                <h1>Tic Tac Toe</h1>
                <h1>Game</h1>
            </div>
            <div id="playerTurn" class="player_turn">Tap on the grid</div>
            <div class="game_container">
                <div class="column1">
                    <div id="box1" class="grid grid-1"></div>
                    <div id="box2" class="grid grid-2"></div>
                    <div id="box3" class="grid grid-3"></div>
                </div>
                <div class="column2">
                    <div id="box4" class="grid grid-4"></div>
                    <div id="box5" class="grid grid-5"></div>
                    <div id="box6" class="grid grid-6"></div>
                </div>
                <div class="column3">
                    <div id="box7" class="grid grid-7"></div>
                    <div id="box8" class="grid grid-8"></div>
                    <div id="box9" class="grid grid-9"></div>
                </div>
            </div>
        </div>
        <div class="fullscreen_msg">
            <div id="msg">Game</div>
        </div>
    </div>
</body>
</html>

<body>
    <div class="container">
        <div class="main_game">
            <div class="heading">
                <h1>Tic Tac Toe</h1>
                <h1>Game</h1>
            </div>
            <div id="playerTurn" class="player_turn">Tap on the grid</div>
            <div class="game_container">
                <div class="column1">
                    <div id="box1" class="grid grid-1"></div>
                    <div id="box2" class="grid grid-2"></div>
                    <div id="box3" class="grid grid-3"></div>
                </div>
                <div class="column2">
                    <div id="box4" class="grid grid-4"></div>
                    <div id="box5" class="grid grid-5"></div>
                    <div id="box6" class="grid grid-6"></div>
                </div>
                <div class="column3">
                    <div id="box7" class="grid grid-7"></div>
                    <div id="box8" class="grid grid-8"></div>
                    <div id="box9" class="grid grid-9"></div>
                </div>
            </div>
        </div>
        <div class="fullscreen_msg">
            <div id="msg">Game</div>
        </div>
    </div>
</body>
</html>
// css part
@import url('https://fonts.googleapis.com/css2?family=Handlee&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Catamaran&family=Handlee&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Ruslan+Display&display=swap');
:root {
    --primary-color: white;
    --text-primary: black;
    --x-primary: rgb(120, 231, 120);
    --o-primary: royalblue;
}

* {
    margin: 0%;
    padding: 0%;
}

body {
    height: 100vh;
}

.container {
    height: 100%;
    width: 100%;
    background: var(--primary-color);
    font-family: 'Catamaran', sans-serif;
}

.main_game {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 2rem;
}

.heading {
    text-align: center;
    font-family: 'Ruslan Display', cursive;
    font-size: 3rem;
}

.heading h1:nth-child(1) {
    font-size: 2rem;
}

.game_container {
    height: 20rem;
    width: 20rem;
    background: var(--text-primary);
    display: flex;
    flex-direction: column;
    gap: .1rem;
}

.column1,
.column2,
.column3 {
    /* background: green; */
    gap: .1rem;
    display: flex;
    height: calc(100% - .2rem / 3);
    /* grid-template-columns: auto auto auto; */
}

.grid {
    cursor: pointer;
    background: var(--primary-color);
    width: calc(100% - .2rem / 3);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Handlee', cursive;
    font-size: 3.5rem;
}

.fullscreen_msg {
    display: none;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 5rem;
    /* display: flex; */
    flex-direction: column;
    text-align: center;
    justify-content: center;
}

.player_turn {
    font-size: 1.3rem;
}

@media (max-width: 400px) {
    .heading {
        font-size: 2rem;
    }

    .game_container {
        width: 15rem;
        height: 15rem;
    }
}
//JS part
playerTurn = 1

document.getElementById("box1").textContent = ""
document.getElementById("box2").textContent = ""
document.getElementById("box3").textContent = ""
document.getElementById("box4").textContent = ""
document.getElementById("box5").textContent = ""
document.getElementById("box6").textContent = ""
document.getElementById("box7").textContent = ""
document.getElementById("box8").textContent = ""
document.getElementById("box9").textContent = ""

const changeBoxElem = (elem) => {
    document.getElementById(elem).addEventListener('click', () => {
        if (document.getElementById(elem).textContent != players[0] && document.getElementById(elem).textContent != players[1]) {
            if (playerTurn === 1) {
                document.querySelector(".container").style.background = "var(--o-primary)"
                document.getElementById(elem).textContent = players[1]
                playerTurn = 2
                document.getElementById("playerTurn").textContent = `${players[0]}'s turn`
            } else if (playerTurn === 2) {
                document.querySelector(".container").style.background = "var(--x-primary)"
                document.getElementById(elem).textContent = players[0]
                playerTurn = 1
                document.getElementById("playerTurn").textContent = `${players[1]}'s turn`
            }
        }
    })
}

list = ["box1", "box2", "box3", "box4", "box5", "box6", "box7", "box8", "box9"]

players = ["O", "X"]

winCombinations = [["box1", "box2", "box3"],
["box4", "box5", "box6"],
["box7", "box8", "box9"],
["box1", "box5", "box9"],
["box3", "box5", "box7"],
["box1", "box4", "box7"],
["box2", "box5", "box8"],
["box3", "box6", "box9"]
]


list.forEach(element => {
    changeBoxElem(element)
});

let gameOver = false

function gameIsOver() {
    console.log("game over")
    document.querySelector(".main_game").style.filter = "blur(5px)"
    document.querySelector(".fullscreen_msg").style.display = "flex"
    document.querySelector(".container").style.background = "lightgreen"
    document.getElementById("msg").textContent = `${wonPlayer} won`
}

function checkGameState() {
    // console.log("hey")
    for (let i = 0; i < winCombinations.length; i++) {
        if (document.getElementById(winCombinations[i][0]).textContent === players[0]) {
            if (document.getElementById(winCombinations[i][1]).textContent === players[0]) {
                if (document.getElementById(winCombinations[i][2]).textContent === players[0]) {
                    // console.log("hey")
                    let gameOver = true
                    wonPlayer = players[0]
                    gameIsOver()
                }
            }
        }
        else if (document.getElementById(winCombinations[i][0]).textContent === players[1]) {
            if (document.getElementById(winCombinations[i][1]).textContent === players[1]) {
                if (document.getElementById(winCombinations[i][2]).textContent === players[1]) {
                    let gameOver = true
                    wonPlayer = players[1]
                    gameIsOver()
                }
            }
        }
        else {
            gameOver = false
        }
    }
}




So, that's it for this post.

I will try to make this code better in the next one.

Till then bye bye, see ya

Hello folks, I guess most of you are using a windows computer or laptop. And since you are visiting this post, that means you're a developer too.

Windows comes with essential softwares installed that you can start with, like notepad for coding, cmd for running commands. But, while you grow up as a developer, you should change yourself with it.

So in this post, I will tell you about the most useful windows software that you should have, if you're a developer.
This post is a description about the softwares as well as an installation guide for them.

Note: This softwares mentioned in this post are based on looks, performance and work requirements.


Moving to our list

VS Code
Git
PowerToys
Terminal



1. VS Code

This is probably the most important software for developers. VS code is made by Microsoft and is thus a great IDE for windows. It is a lightweight and efficient IDE for developers, that's why it's preferred by most of the programmers you see.

One more thing that makes VS code a great pick are the extensions present in it. It has a lot of essential pre built tools, that can just be installed and used. You can even customize the themes, code the look and almost everything inside it with the use of extensions.

VS Code Installation


If you want a specific post on which VS code extensions do I use, just let me know in the comments below.


2. Git

This software is really useful for programmers. Suppose you are writing 100's of lines of code from a week and by mistake your file gets corrupted. You lost all your work?

With Git you don't need to worry about it. It will manage all your previous work, files and modifications you did from time to time.

Just commit your code every time you make major changes, and it will not be lost.

Git Installation


If you want Git tutorial then visit the link Git tutorial


3. PowerToys

Now comes the software that I think not much people know about.

PowerToys is also a software developed by Microsoft itself and is a really good and powerful software. It gives you a lot more features on Windows. You can have fast search, rename/modify files easily. Change file size, etc very easily.

For me, this is a must have software on windows, whether you're a developer or not.

Let me show you some screenshots of the features it gives.



PowerToys Installation

Or install from Github


4. Terminal

There comes another really interesting software from Microsoft, that looks really great by design.

If you're a preogrammer, you must be aware of the PowerShell and Command Prompt on Windows. But if you are looking for a really good looking area to run your scripts, Windows Terminal is made for you. This also adds a lot of features in your hands, like tabs in the same window.

I mean, just look at it.




Windows Terminal Installation


So, that's all for this list. If you liked the post, just leave a comment and please share it with your other developer friends, to make their Windows better too.

See you in the next post.

Till then Bye Bye :)

Hello folks, in this post, we will explore how can you create an effect like this using HTML, CSS and JS.




The simple logic

Just replace the "divname" in the code by the name given to the div to that you want to apply this hover effect. We will use jQuery. So firstly, import this line:


<!-- paste this line either in the 'title' tag or at the end of body -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.css" />




//JS part
document.getElementById("divname").onmousemove = e => {
	const divname = document.getElementById("divname")
    const rect = projects.getBoundingClientRect(),
    	x = e.clientX - rect.left,
    	y = e.clientY - rect.top;

	projects.style.setProperty("--mouse-x", `${x}px`);
    projects.style.setProperty("--mouse-y", `${y}px`);
};

The CSS (playing with logic)

Now we will add some css to make this effect working.



/* CSS part -- this is the most important part to show the effect */
#divname::before {
    content: '';
    opacity: 0;
    position: absolute;
    height: 100%;
    width: 100%;
    /* background: white; */
    top: 0;
    left: 0;
    background: radial-gradient(
        800px circle at var(--mouse-x) var(--mouse-y), 
        rgba(255, 255, 255, 0.1),
        transparent 40%);
    transition: .5s all;
}
#divname:hover::before {
    opacity: 1;
}

Complete Code

Now I will show you how you can make the same thing as I showed you in the preview.

HTML part:


<!-- This is the html of the preview -->

<html lang="en">

<head>
    <meta charset="UTF-8"></meta>
    <meta content="IE=edge" http-equiv="X-UA-Compatible"></meta>
    <meta content="width=device-width, initial-scale=1.0" name="viewport"></meta>
    <title>Hover glow effect</title>
    <link href="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.css" rel="stylesheet"></link>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/all.min.css" rel="stylesheet"></link>
</head>

<body>
<section id="skills">
        <div class="character">
            <img src="Assets/Images/AREmoji_20220823_102301_38219.gif" alt="Shivesh Tiwari">
        </div>
        <div class="skills-container">
            <h1>Skills</h1>
            <br /><br />
            HTML/CSS
            <div class="skill-meter">
                <div class="skill-reading skill-reading-transition" id="html" style="width: 100%;"></div>
            </div>
            <br />
            React JS
            <div class="skill-meter">
                <div class="skill-reading skill-reading-transition" style="width: 70%;"></div>
            </div>
            <br />
            JavaScript
            <div class="skill-meter">
                <div class="skill-reading skill-reading-transition" style="width: 90%;"></div>
            </div>
            <br />
            UI/UX
            <div class="skill-meter">
                <div class="skill-reading skill-reading-transition" style="width: 85%;"></div>
            </div>
        </div>
    </section>
</body>
</html>



/* add this css to the html */
* {
    margin: 0%;
    padding: 0%;
}
body {
    /* font-family: "Poppins"; */
    background: var(--default-theme);
    /* background: black; */
    overflow-x: hidden;
	font-family: 'Montserrat', sans-serif;
	min-height: 100vh;
}
section {
    min-height: 100vh;
    width: 100%;
    position: relative;
    z-index: 1;
}
#skills .character img {
    height: 100%;
    position: absolute;
    left: 0%;
    top: 0%;
}
#skills .skills-container {
    color: var(--dark-text-color);
    width: 30%;
    height: auto;
    padding: 2rem;
    /* background: red; */
    position: absolute;
    top: 50%;
    left: 55%;
    transform: translate(0,-50%);
}
#skills .skill-meter {
    width: 100%;
    height: .7rem;
    background: white;
    border-radius: 1rem;
    margin-top: .6rem;
    padding: .1rem;
}
#skills .skill-meter .skill-reading {
    background: #4e33a4;
    height: 100%;
    border-radius: 2rem;
    transition: 5s linear;
}
#skills {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--dark-text-color);
    /* animation: 10s shape_color linear infinite; */
    backdrop-filter: blur(10px);
    background: rgba(74, 255, 165, 0.1);
    box-shadow: 0 25px 45px rgba(0,0,0,0.1);
    border-top: 1px solid rgba(255,255,255,0.5);
    border-bottom: 1px solid rgba(255,255,255,0.5);
}
#skills::before {
    content: '';
    opacity: 0;
    position: absolute;
    height: 100%;
    width: 100%;
    /* background: white; */
    top: 0;
    left: 0;
    background: radial-gradient(
        800px circle at var(--mouse-x) var(--mouse-y), 
        rgba(255, 255, 255, 0.1),
        transparent 40%);
    transition: .5s all;
}
#skills:hover::before {
    opacity: 1;
}

That's all for this post, see you in the next.

Hello there,


In this article you will learn how can you let the user input something when the website loads and the site will display that input on the screen.
We are going to use JavaScript Prompt to take the input from the user.


Prerequisites

Very basic knowledge of JavaScript



So, let's start the coding part...


HTML

Firstly create a html file. I've created a basic template with heading tag just to display the information. You can modify your html according to that.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>
        Hello
        <div id="name">User</div>
    </h1>
</body>
</html>

Just give a id to the element whose content you have to change.

Here, I have to change the content inside the div with id "name".


So, we are all set. Now let's jump to the main JS part...

It's just a two line script and you're done.


JS

<script>
    const name = prompt("Enter your name");
    document.getElementById("name").innerText = name;
</script>

What we are doing here is taking a prompt input from the user and storing it in the variable called "name".

Then we're changing the content of the div with id "name".


So, that's it for this post. This was a small basic tutorial on JavaScript. Have a look on my other JavaScript projects by clicking the button below.

Hello there! In this article we are going to create a programmer way to write an application. We will write an application using Python.



Ideation

So, as you all know that we have a specific format to write an application. In this post, I've chosen a leave application. Firstly, what we want is the sample of the application. Then, we are going to format the sample of the application with the important information. And at the end, we'll create a new file to output the text application and save it.


Prerequisites

A basic knowledge of file handling and string formatting.

The way I am going to make the program is using file handling in Python with string formatting. But you can also just make the use of string formatting to modify the program.


How?

Firstly I saved a very raw and simple sample of application written in a file named, "letter.txt". I've used a simple format. Modify the file as per your requirements.

To

the Principal

{school_name}


Subject: Sick Leave Application


I am {name} of {class_name} of your institute. I am writing this application to inform you that I am suffering from {reason} and therefore, I want sick leave from school. I got this infection last night and I will not be capable to come to the office for from {start_date} for a several days. As advised by my doctor, I should take rest and recover appropriately before continuing work. The report from the doctor is also attached for your reference.


Kindly grant me a leave for {no_days} days.


Yours Sincerely,

{name}


Note: Just keep the data that is to be changed with the application inside "{ }" brackets. And use a single unique word to define the information used inside it. We are going to change this information using string formatting


Now create a Python script file, say "letter.py" and start to code.


Coding

Firstly, we are using the template saved in our file, "letter.txt". So, we'll have to use it, open and read the content inside it. We are going to use the concept of file handling here.

letter = open("letter.txt", "r")
text = letter.read()

In these two lines, I've opened the file, in read mode (because we don't want to modify the file) and then I've read the content inside the file using read function and stored it in a variable, text.

Now, we have got the format in the text variable. Now, just replace those reference variables written inside the "{ }" brackets with the required data.

We're going to make the user input the required data. So, let's make some variables to let the user input some data.

name = str(input("Enter your name: "))
school_name = str(input("Enter your school's name: "))
class_name = str(input("Enter the class: "))
reason = str(input("Enter the reason for being absent: "))
start_date = str(input("Enter the date from which leave starts: "))
end_date = str(input("Enter the date from which leave ends: "))
no_days = str(input("Enter the no. of days: "))

Note: I've used the same word references stored in the file inside "{ }" brackets. You can also do the same to remove any confusion.

Now, everything is well setup for us.

At last, We have to change the content in the text variable.

temp_str = f"{text}".format(name=name, school_name=school_name,
class_name=class_name, reason=reason, start_date=start_date,
end_date=end_date, no_days=no_days)

I've created a variable and then changed its content with the text content of text variable, using string formatting. And after that in the same variable I've replaced the references with the variables.

This is a bit complicated to see as I've combined two steps in one. But, just look at it once and you will get it easily. If not, separate the two steps and print them one by one and see the difference.

At the end, close the opened file, "letter.txt".

letter.close()

Now, you have created your application using python. Print the "temp_str" variable and see the output.

Here, we are going to make a new output file to save the application.

So, we'll again use the concept of file handling.

output = open("output.txt", "w")

output.write(temp_str)

output.close()


Congratulations! You have created a Python program to create your own application.


Code:

print("""



         ___         ___   ___            ___
|    |  |     |     |     |   |  |\\  /|  |
|    |  |__   |     |     |   |  | \\/ |  |__
| /\\ |  |     |     |     |   |  |    |  |
|/  \\|  |___  |___  |___  |___|  |    |  |___



""")


letter = open("letter.txt", "r")


text = letter.read()


name = str(input("Enter your name: "))
school_name = str(input("Enter your school's name: "))
class_name = str(input("Enter the class: "))
reason = str(input("Enter the reason for being absent: "))
start_date = str(input("Enter the date from which leave starts: "))
end_date = str(input("Enter the date from which leave ends: "))
no_days = str(input("Enter the no. of days: "))


temp_str = f"{text}".format(name=name, school_name=school_name,
class_name=class_name, reason=reason, start_date=start_date,
end_date=end_date, no_days=no_days)


letter.close()


# print(temp_str)


output = open("output.txt", "w")


output.write(temp_str)


output.close()



Django is a very powerful python framework for web development. It is used to create very powerful backend servers using python.

Run this command to create a django project on your pc in the specifeid directory.

 django-admin startproject myapp


To start creating the django app, run this command after going into the project directory created in last step.

python manage.py startapp chat


To start the server, run this command in the parent directory where manage.py is saved.

python manage.py runserver

 Hello People! If you are an absolute beginner with Github and you heard about it recently, then this post is for you.

So, if you don't know what Github actually is, then let me tell you about it. Github is a place where you can manage your code, manage your projects and keep versions of your projects. So, Github has become important these days in industrial and personal uses.

In this post, you will come across uploading your code on github.

So, firstly, you need to install a program on your computer. This is to get access to all the awesome features of Github. Follow the Link to download Git. Configure the download as per you need. Then run the installer file.

Run the below file (downloaded right now, in you downloads folder to setup Git on your pc)




Note: Make sure all the things shown in the above picture are selected...

Now let me quickly tell you about Git. Git is the actual manager of your code. Github is just a website where your code is visible. As simple as this.

So, now if git is installed on your pc, you are ready to do awesome things with it.

Make your Github account and you are ready to go...


Terms used in this post: Repo (meaning, repository)


Duplicate (clone) any project on Github

Do you know that you can clone any project on github by using just one command on your pc. You can clone the directory and edit the code locally as you want.

To do this, first you need to go to the folder where you want to clone the project. Then right click there and click on Git bash here.


This will open a terminal on your pc.

To clone the project, you need to have the url of the project on gihub.

For example, I want to clone my project TextUtyls, I have the url:

    https://github.com/TheShiveshNetwork/TextUtyls  

Now I will type in the terminal

    git clone https://github.com/TheShiveshNetwork/TextUtyls   

Boom! now the project has been cloned on your pc. You will see the directory of the project at the location you ran the command.


Upload your project to github

For this, you will first have to go to the github website. Now create a new repository by clicking on the + icon.


Name your repo, choose from public or private then click on on Create.

When your repo is created, follow the steps shown on the screen.

In this case, I consider that you already have made a project file, that you want to push to Github.

So, just go to the project directory you want and right click, open git bash.

Now follow the below steps

    git init   

This command will make a .git file in your directory that stores a record of your file locally. If you have enabled "show hidden files in your file explorer, then you can see the file.

Note: In case you come across a problem with managing the files on git, just delete the .git folder and reinitialize it, by running the above command.

The next step is to add all the files of your directory to git.

    git add .  

This command will add all the files to git.

After these two commands, you are all set.

Now commit the files

    git commit -m "first-commit"  

The name first-commit will be specified as the name of your commit, just ignore that for now.

Now add the reference of your repo on github.

Get the url of your repo and run the below command

    git remote add origin   

Paste your url after "origin" and then run the command...

Now just run the below two commands and your project will be uploaded to github.

    git branch -M main   

    git push -u origin main   

Now reload the page of your repo and you will see your code there.


Thanks for reading. Hope you liked the idea and project. Do comment down you opinions. Also, share this project with your friends and programmers.



Newer Posts Older Posts Home

ABOUT ME

Web developer, designer. A self taught programmer. Don't hesitate to come for say a small "hello!"
Shivesh Tiwari

POPULAR POSTS

  • How to make your own Screen Recorder with Python - Python OpenCV Tutorial
  • Pyhton Notification System Complete Project with Code
  • Python IDE + Text Editor
  • Chrome Dino Game Automation in Python
  • How to make a Kali Linux themed Terminal Website Portfolio using React JS
  • Logic Building in Python
  • How to make Windows 11 Website Design | Adding Working App Windows | Dark Mode and other things
  • Complete guide on managing code with Github (Git Tutorial)
  • First React Project - TextUtyls Website
  • Make a Windows 11 themed Website - HTML, CSS Windows 11 design

Categories

  • best javascript project 12
  • code 5
  • dino game 1
  • dislike 1
  • easy python projects 9
  • flask 1
  • free python code 10
  • game 2
  • git 1
  • github 1
  • hack 2
  • hack chrome dino game 1
  • hack game 1
  • html best website 4
  • javascript website 6
  • learn javascript 9
  • learn programming 13
  • learn python 15
  • like 1
  • like dislike system php 1
  • mrdevknown 5
  • music player 1
  • notification 1
  • php 2
  • programming 9
  • project 9
  • pyqt5 4
  • python 16
  • python IDE 2
  • python projects 8
  • React 5
  • react js 6
  • software 5
  • Tkinter 2
  • web app 4
  • website 4
Powered by Blogger
MrDevKnown

Search This Blog

Archive

  • August 20231
  • March 20231
  • December 20221
  • September 20222
  • August 20221
  • June 20221
  • March 20221
  • January 20226
  • December 20211
  • November 20213
  • October 202111
  • September 20213
  • August 20213
Show more Show less
  • Home
  • About
  • Contact Us

Subscribe

Posts
Atom
Posts
All Comments
Atom
All Comments

Subscribe

Posts
Atom
Posts
All Comments
Atom
All Comments

Categories

  • React5
  • Tkinter2
  • best javascript project12
  • code5
  • dino game1
  • dislike1
  • easy python projects9
  • flask1
  • free python code10
  • game2
  • git1
  • github1
  • hack2
  • hack chrome dino game1
  • hack game1
  • html best website4
  • javascript website6
  • learn javascript9
  • learn programming13
  • learn python15
  • like1
  • like dislike system php1
  • mrdevknown5
  • music player1
  • notification1
  • php2
  • programming9
  • project9
  • pyqt54
  • python16
  • python IDE2
  • python projects8
  • react js6
  • software5
  • web app4
  • website4

Translate

Pages

  • Home
  • Privacy Policy

Popular Posts

Music Player web app made in HTML, CSS, Javascript

Music Player web app made in HTML, CSS, Javascript

August 03, 2021
Top must have windows software for a developer

Top must have windows software for a developer

September 17, 2022
Javascript code to display a welcome message after accepting the name of the user using a prompt box

Javascript code to display a welcome message after accepting the name of the user using a prompt box

August 20, 2022

Trending Articles

  • How to make your own Screen Recorder with Python - Python OpenCV Tutorial
  • Pyhton Notification System Complete Project with Code
  • Python IDE + Text Editor
  • Chrome Dino Game Automation in Python

Popular Posts

  • Music Player web app made in HTML, CSS, Javascript
  • How to create a shining / glowing effect around the cursor on mouse hover over a div? Glassmorphism Tutorial
  • Javascript code to display a welcome message after accepting the name of the user using a prompt box

Labels

Distributed By Gooyaabi | Designed by OddThemes