Welcome to the world of web development! If you're new to JavaScript, follow these steps to set up a basic project on your computer.
Choose a code editor to write your HTML, CSS, and JavaScript code. A recommended choice is:
Git is a version control system that helps you track changes in your code. Follow these steps to install Git:
-
Download and install Git from Git official website.
-
Verify the installation by running the following command in your terminal:
git --version
You should see the Git version printed in the terminal, confirming a successful installation.
GitHub CLI allows you to interact with GitHub from the command line. Follow these steps:
-
Install GitHub CLI on macOS, Windows, or Linux. For more information, see Installation in the GitHub CLI repository.
-
Verify the installation by running the following command in your terminal:
gh --version
You should see the GitHub CLI version printed in the terminal, indicating a successful installation.
-
Authenticate with GitHub by running this command from your terminal:
gh auth login
-
Follow the on-screen prompts.
GitHub CLI automatically stores your Git credentials for you when you choose HTTPS as your preferred protocol for Git operations and answer "yes" to the prompt asking if you would like to authenticate to Git with your GitHub credentials. This can be useful as it allows you to use git push, git pull, and so on, without needing to set up a separate credential manager or use SSH.
Open the file named index.html
in the project root directory and write basic HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Your Web Page Title</title>
<!-- Link to your CSS file (e.g., styles.css) -->
<link rel="stylesheet" href="src/styles.css" />
</head>
<body>
<!-- Your content goes here -->
<script src="src/app.js"></script>
</body>
</html>
js
for JavaScript and css
for CSS. Write your code in these files.
-
main.js
:// Your JavaScript code goes here console.log("Hello, World!");
-
styles.css
:/* Your CSS code goes here */ body { font-family: "Arial", sans-serif; background-color: #f0f0f0; }
Open the index.html
file in your browser to view your web page.
Congratulations! You've set up a basic JavaScript project. Experiment with your HTML, CSS, and JavaScript code to build exciting web applications.