101.school
CoursesAbout
Search...⌘K
Generate a course with AI...

    JavaScript 101

    Receive aemail containing the next unit.
    • Introduction to JavaScript
      • 1.1What is JavaScript?
      • 1.2Setting up your environment
      • 1.3Basic syntax and variables
    • Data Types and Variables
      • 2.1Understanding data types
      • 2.2Variables and constants
      • 2.3Operators
    • Control Structures
      • 3.1Conditional statements
      • 3.2Loops
      • 3.3Error handling
    • Functions
      • 4.1Defining functions
      • 4.2Function expressions
      • 4.3Arrow functions
    • Objects and Arrays
      • 5.1Understanding objects
      • 5.2Understanding arrays
      • 5.3Array methods
    • Document Object Model (DOM)
      • 6.1What is the DOM?
      • 6.2Selecting and manipulating elements
      • 6.3Event handling
    • Asynchronous JavaScript
      • 7.1Callbacks
      • 7.2Promises
      • 7.3Async/Await
    • API Interaction
      • 8.1What is an API?
      • 8.2Fetch API
      • 8.3Working with JSON
    • Debugging
      • 9.1Console methods
      • 9.2Debugging tools
      • 9.3Common JavaScript errors
    • JavaScript Libraries
      • 10.1Introduction to libraries
      • 10.2Using jQuery
      • 10.3Using lodash
    • JavaScript Frameworks
      • 11.1Introduction to frameworks
      • 11.2Using React
      • 11.3Using Vue.js
    • Testing and Deployment
      • 12.1Writing tests with Jest
      • 12.2Deployment with Netlify
      • 12.3Continuous integration
    • Final Project
      • 13.1Project proposal
      • 13.2Project development
      • 13.3Project presentation

    Introduction to JavaScript

    Setting Up Your JavaScript Environment

    high-level programming language

    High-level programming language.

    Before you can start writing JavaScript code, you need to set up your development environment. This includes choosing a text editor, understanding how to include JavaScript in a HTML file, and getting familiar with browser developer tools.

    Text Editors

    A text editor is a tool where you write and edit your code. There are many text editors available, but some of the most popular ones among JavaScript developers are Sublime Text, Atom, and Visual Studio Code.

    • Sublime Text is a sophisticated text editor for code, markup, and prose. It's lightweight, fast, and highly customizable.
    • Atom is a free and open-source text editor that's modern, approachable, and hackable to the core.
    • Visual Studio Code (VS Code) is a free source-code editor made by Microsoft. It includes support for debugging, embedded Git control, syntax highlighting, intelligent code completion, snippets, and code refactoring.

    Choose the one that you feel most comfortable with. They all have their strengths and weaknesses, but they are all excellent choices for writing JavaScript code.

    Including JavaScript in a HTML File

    There are two main ways to include JavaScript in a HTML file:

    1. Internal JavaScript: You can write your JavaScript code directly in your HTML file by placing it between <script> tags. This is a good option for small amounts of code, but it can make your HTML file messy and difficult to maintain as your codebase grows.

    2. External JavaScript: You can write your JavaScript code in a separate .js file and then link to it from your HTML file using the src attribute in a <script> tag. This is a better option for larger amounts of code because it keeps your JavaScript separate from your HTML, making both easier to read and maintain.

    Browser Developer Tools

    Most modern web browsers come with built-in developer tools that can help you write and debug your JavaScript code. These tools allow you to do things like inspect the HTML and CSS of a webpage, monitor network requests, and interact with JavaScript.

    To access the developer tools in most browsers, you can right-click on a webpage and select "Inspect" or "Inspect Element". This will open the developer tools panel, where you can navigate to the "Console" tab to interact with JavaScript.

    Running JavaScript in the Browser Console

    The browser console is a part of the developer tools that acts like a JavaScript interpreter. You can write JavaScript code directly in the console, and it will run as soon as you press Enter. This is a great way to test small pieces of JavaScript code and see the results immediately.

    To run JavaScript in the console, simply type your code into the console input line and press Enter. The result of your code will be displayed on the next line.

    Setting up your JavaScript environment properly is the first step towards becoming a proficient JavaScript developer. Once you have your text editor installed, know how to include JavaScript in a HTML file, and are familiar with the browser developer tools, you're ready to start writing JavaScript code.

    Test me
    Practical exercise
    Further reading

    Hi, any questions for me?

    Sign in to chat
    Next up: Basic syntax and variables