JavaScript can be created with a text editor and a web browser.
There are tools for development, but they are complex and require a lot of learning, so start learning in a simple environment at first.
A text editor can be Notepad for the practice stage.
Other than Notepad, Notepad++ and Sublime Text are candidates.
Chrome is recommended as the web browser.
Simple programming and execution examples
Open Notepad, create a new file, and enter the following code:
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Sample</title>
</head>
<body>
<script>
alert("Hello, World!");
</script>
</body>
</html>A save dialog box will appear, so save the file as "sample.html".
Then, open the saved "sample.html" file with Google Chrome, and a dialog box will appear, displaying "Hello, world!
In Google Chrome, press the F12 key to launch the "Developer Tools".
If there is an error, an error message will appear in the "Console".
If the program does not work, this may lead to a solution.
Display any message on the "Console" tab
In this example, an event listener is registered using addEventListener() to display a log message in the console when the button is clicked. Each time the button is clicked, the message "Button clicked!" is displayed in the console.
<!DOCTYPE html>
<html>
<head>
<title>Console Example</title>
</head>
<body>
<h1>Console Example</h1>
<button id="myButton">Click me!</button>
<script>
var myButton = document.getElementById("myButton");
myButton.addEventListener("click", function() {
console.log("Button clicked!");
});
</script>
</body>
</html>
The Chrome DevTools Console tab is a powerful tool for displaying information about a web page's JavaScript code. In addition to displaying log messages, the console can be used for displaying variable values, debugging messages, and function return values, among other purposes.
---