msb-public
/
30-Days-Of-JavaScript
mirror of https://github.com/Asabeneh/30-Days-Of-JavaScript
1
0
Code Issues Projects Releases Wiki Activity

Small fixes on typos and other minor suggestions

Browse Source 
Changes were made on first page only. If approved I can continue with the rest of the readme files.
pull/143/head
Martín Anzorena 5 years ago committed by GitHub
parent 07143be3b7
commit d177f05a99
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 45 additions and 39 deletions
Show Stats Download Patch File Download Diff File

84
readMe.md
Unescape View File

@ -133,7 +133,7 @@ I believe you have the motivation and a strong desire to be a developer, a compu
### Install Node.js
You may not need node.js right now but you may need it for later. Install [node.js](https://nodejs.org/en/).
You may not need Node.js right now but you may need it for later. Install [node.js](https://nodejs.org/en/).
![Node download](images/download_node.png)
@ -148,7 +148,7 @@ asabeneh $ node -v
v12.14.0
```
When making this tutorial I was using node version 12.14.0, but now the recommended version of node.js for download is 12.17.0.
When making this tutorial I was using Node version 12.14.0, but now the recommended version of Node.js for download is 12.17.0.
### Browser
@ -156,7 +156,7 @@ There are many browsers out there. However, I strongly recommend Google Chrome.
#### Installing Google Chrome
Install [google chrome](https://www.google.com/chrome/) if you do not have one yet. We can write small JavaScript code on the browser console, but we do not use the browser console to develop applications.
Install [Google Chrome](https://www.google.com/chrome/) if you do not have one yet. We can write small JavaScript code on the browser console, but we do not use the browser console to develop applications.
![Google Chrome](images/google_chrome.png)
@ -168,7 +168,7 @@ You can open Google Chrome console either by clicking three dots at the top righ
To open the Chrome console using a keyboard shortcut.
```sh
```
Mac
Command+Option+J
@ -187,7 +187,7 @@ Let us write a JavaScript code on the Google Chrome console:
We can write any JavaScript code on the Google console or any browser console. However, for this challenge, we only focus on Google Chrome console. Open the console using:
```sh
```
Mac
Command+Option+I
@ -197,7 +197,7 @@ Ctl+Shift+I
##### Console.log
To write our first JavaScript code, we used a built-in function **console.log()**. We passed an argument as input data, and the function displays the output. We passed 'Hello, World' as input data or argument in the console.log() function.
To write our first JavaScript code, we used a built-in function **`console.log()`**. We passed an argument as input data, and the function displays the output. We passed `'Hello, World'` as input data or argument in the `console.log()` function.
```js
console.log('Hello, World!')
@ -205,7 +205,7 @@ console.log('Hello, World!')
##### Console.log with Multiple Arguments
The **conole.log()** function can take multiple parameters separated by comma. The syntax looks like as follows:**console.log(param1, param2, param3)**
The **`console.log()`** function can take multiple parameters separated by comma. The syntax looks like as follows: **`console.log(param1, param2, param3)`**
![console log multiple arguments](./images/console_log_multipl_arguments.png)
@ -215,28 +215,31 @@ console.log('HAPPY', 'NEW', 'YEAR', 2020)
console.log('Welcome', 'to', 30, 'Days', 'Of', 'JavaScript')
```
As you can see from the snippet code above, _console.log()_ can take multiple arguments.
As you can see from the snippet code above, `console.log()` can take multiple arguments.
Congratulations! You wrote your first JavaScript code using _console.log()_.
Congratulations! You wrote your first JavaScript code using `console.log()`.
##### Comments
We add comments to our code. Comments are very important to make code more readable and to leave remarks in our code. JavaScript does not execute the comment part of our code.In JavaScript, any text line starting with // in JavaScript is a comment, and anything enclosed like this /\* \*/ is also a comment.
We can add comments to our code. Comments are very important to make code more readable and to leave remarks in our code. JavaScript does not execute the comment part of our code. In JavaScript, any text line starting with `//` in JavaScript is a comment, and anything enclosed like this `/\* \*/` is also a comment.
**Example: Single Line Comment**
```js
// This is the first comment
// This is the second comment
// I am a single line comment
// This is the second comment
// I am a single line comment
```
**Example: Multiline Comment**
/_
```js
/**
This is a multiline comment
Multiline comments can take multiple lines
JavaScript is the language of the web
_/
**/
```
##### Syntax
Programming languages are similar to human languages. English or many other language uses words, phrases, sentences,compound sentences and other more to convey a meaningful message. The English meaning of syntax is _the arrangement of words and phrases to create well-formed sentences in a language_. The technical definition of syntax is _the structure of statements in a computer language._ Programing languages have syntax. JavaScript is a programming language and like other programming languages it has its own syntax. If we do not write a syntax that JavaScript understands, it will raise different types of errors. We will explore different kinds of JavaScript errors later. For now, let us see syntax errors.
@ -250,7 +253,8 @@ console.log('Hello, World!')
console.log('Hello, World!')
```
So far, we saw how to display text using the _console.log()_. If we are printing text or string using _console.log()_, the text has to be inside the single quotes, double quotes, or a backtick quotes.
So far, we saw how to display text using the `console.log()`. If we are printing text or string using `console.log()`, the text has to be inside the single quotes, double quotes, or a backtick quotes.
**Example:**
```js
@ -261,9 +265,9 @@ console.log(`Hello, World!`)
#### Arithmetics
Now, let us practice more writing JavaScript codes using _console.log()_ on google chrome console for number data types.
Now, let us practice more writing JavaScript codes using `console.log()` on Google Chrome console for number data types.
In addition to the text, we can also do mathematical calculations using JavaScript. Let us do the following simple calculations.
The console can directly take arguments without the **_console.log()_** function. However, it is included in this introduction because most of this challenge would be taking place in a text editor where the usage of the function would be mandatory. You can play around directly with instructions on the console.
The console can directly take arguments without the **`console.log()`** function. However, it is included in this introduction because most of this challenge would be taking place in a text editor where the usage of the function would be mandatory. You can play around directly with instructions on the console.
![Arithmetic](images/arithmetic.png)
@ -282,7 +286,7 @@ We can write our codes on the browser console, but it won't do for bigger projec
#### Installing Visual Studio Code
Visual studio code is a very popular open-source text editor. I would recommend to [download Visual Studio Code](https://code.visualstudio.com/), but if you are in favor of other editors, feel free to follow with what you have.
Visual Studio Code is a very popular open-source text editor. I would recommend to [download Visual Studio Code](https://code.visualstudio.com/) but if you are in favor of other editors feel free to follow with what you have.
![Vscode](images/vscode.png)
@ -333,7 +337,7 @@ Create a project folder on your desktop or in any location, name it 30DaysOfJS a
</html>
```
Now, you just wrote your first inline script. We can create a pop up alert message using the _alert()_ built-in function.
Now, you just wrote your first inline script. We can create a pop up alert message using the `alert()` built-in function.
### Internal Script
@ -353,7 +357,7 @@ First, let us write on the head part of the page.
</html>
```
This is how we write an internal script most of the time. Writing the JavaScript code in the body section is the most preferred option. Open the browser console to see the output from the console.log()
This is how we write an internal script most of the time. Writing the JavaScript code in the body section is the most preferred option. Open the browser console to see the output from the `console.log()`.
```html
<!DOCTYPE html>
@ -370,7 +374,7 @@ This is how we write an internal script most of the time. Writing the JavaScript
</html>
```
Open the browser console to see the output from the console.log()
Open the browser console to see the output from the `console.log()`.
![js code from vscode](./images/js_code_vscode.png)
@ -405,19 +409,19 @@ External scripts in the _body_:
<title>30DaysOfJavaScript:External script</title>
</head>
<body>
//it could be in the header or in the body // Here is the recommended place
to put the external script
// It could be in the header or in the body
// Although, here is the recommended place to put the external script
<script src="introduction.js"></script>
</body>
</html>
```
Open the browser console to see the output of the console.log()
Open the browser console to see the output of the `console.log()`.
### Multiple External Scripts
We can also link multiple external JavaScript files to a web page.
Create a helloworld.js file inside the 30DaysOfJS folder and write the following code.
Create a `helloworld.js` file inside the 30DaysOfJS folder and write the following code.
```js
console.log('Hello, World!')
@ -442,7 +446,7 @@ _Your main.js file should be below all other scripts_. It is very important to r
## Introduction to Data types
In JavaScript and also other programming languages, there are different kinds of data types. The following are JavaScript primitive data types:_String, Number, Boolean, undefined, Null_, and _Symbol_.
In JavaScript and also other programming languages, there are different kinds of data types. The following are JavaScript primitive data types: _String, Number, Boolean, undefined, Null_, and _Symbol_.
### Numbers
@ -456,6 +460,7 @@ In JavaScript and also other programming languages, there are different kinds of
### Strings
A collection of one or more characters between two single quotes, double quotes, or backticks.
**Example:**
```js
@ -463,8 +468,9 @@ A collection of one or more characters between two single quotes, double quotes,
'Finland'
'JavaScript is a beautiful programming language'
'I love teaching'
'I hope you are enjoying the first day'`We can also create a string using a backtick`
;('A string could be just as small as one character as big as many pages')
'I hope you are enjoying the first day'
`We can also create a string using a backtick`
('A string could be just as small as one character as big as many pages')
```
### Booleans
@ -486,7 +492,7 @@ In JavaScript, if we don't assign a value to a variable, the value is undefined.
```js
let firstName
console.log(firstName) //not defined, because it is not assigned to a value yet
console.log(firstName) // Not defined, because it is not assigned to a value yet
```
### Null
@ -527,11 +533,11 @@ Multiline commenting:
```js
/*
let location = 'Helsinki';
let age = 100;
let isMarried = true;
This is a Multiple line comment
*/
let location = 'Helsinki';
let age = 100;
let isMarried = true;
This is a Multiple line comment
*/
```
## Variables
@ -571,11 +577,11 @@ year2020
year_2020
```
The first and second variables on the list follows the camelCase convention of declaring in JavaScrip. In this material, we will use camelCase variables.
The first and second variables on the list follows the camelCase convention of declaring in JavaScript. In this material we will use camelCase variables.
Example of invalid variables:
```sh
```js
first-name
1_num
num_#_1
@ -621,7 +627,8 @@ console.log(gravity, boilingPoint, PI)
```
```js
// Variables can also be declaring in one line separated by comma
// Variables can also be declaring in one line separated by comma.
// That said, it's recommended to do make separate assignments to improve code readability.
let name = 'Asabeneh', // name of a person
job = 'teacher',
live = 'Finland'
@ -644,7 +651,6 @@ When you run _index.html_ file in the 01-Day folder you should get this:
2. Write another single comment which says, _Welcome to 30DaysOfJavaScript_
3. Write a multiline comment which says, _comments can make code readable, easy to reuse_
_and informative_
4. Create a variable.js file and declare variables and assign string, boolean, undefined and null data types
5. Create datatypes.js file and use the JavaScript **_typeof_** operator to check different data types. Check the data type of each variable
6. Declare four variables without assigning values

Write Preview
Loading…
Cancel
Save