1 of 16

Front-End Development 101:

Introduction to JS

Timonwa Akintokun

2 of 16

Bio

  • Frontend Developer
  • Technical Writer
  • Building Tech Roadmap
  • Open Source Enthusiast
  • https://link.timonwa.com

​

Timonwa Akintokun

3 of 16

TABLE OF CONTENTS

  1. What is JavaScript
  2. How to Use JavaScript
  3. Basic Syntax and Examples
  4. Introduction to DOM (Document Object Model)

4 of 16

What is Javascript

01

5 of 16

01

What is JS?

JavaScript is a widely used programming language that allows you to add interactivity, dynamic content, and functionality to web pages.

​

JavaScript is a client-side scripting language, meaning it runs on the user's browser, and it can be used in conjunction with HTML and CSS to create dynamic web applications.

6 of 16

01

What is JS?

JavaScript is one of the core technologies used for building modern web applications, and it's supported by all major web browsers.

7 of 16

How to Use JavaScript

02

8 of 16

02

How to Use JavaScript

Inline JavaScript: Writing JavaScript code directly within HTML using the <script> element and the src attribute.

​

Internal JavaScript: Including JavaScript code within the <script> element in the <head> or <body> section of an HTML file.

​

External JavaScript: Linking an external JavaScript file to an HTML file using the <script> element and the src attribute.

9 of 16

Basic Syntax and Examples

03

10 of 16

03

Basic Syntax and Examples

Variables: Declaring and assigning values to variables using var, let, or const.

​

Data types: Understanding different data types in JavaScript, such as numbers, strings, booleans, arrays, and objects.

​

Operators: Using operators for arithmetic, comparison, and logical operations.

11 of 16

Introduction to DOM (Document Object Model)

04

12 of 16

04

​

Introduction to DOM (Document Object Model)

DOM is a programming interface that allows JavaScript to interact with HTML elements and manipulate their properties and contents dynamically.

​

Common DOM operations, such as accessing elements, modifying element content, changing element styles, and handling events.

13 of 16

Assignment

05

14 of 16

05

15 of 16

Resources

16 of 16

THANKS

CREDITS: This presentation template was created by Slidesgo, including icons by Flaticon, infographics & images by Freepik.