Differences
This shows you the differences between two versions of the page.
|
moby:frontend:01 [2020/07/14 19:36] ciprian.dobre [Sesiunea 1 - Concepte de baza] |
moby:frontend:01 [2020/07/14 19:40] (current) ciprian.dobre [Sesiunea 1 - Concepte de baza] |
||
|---|---|---|---|
| Line 2: | Line 2: | ||
| ===== Sesiunea 1 - Concepte de baza ===== | ===== Sesiunea 1 - Concepte de baza ===== | ||
| + | |||
| **React** | **React** | ||
| React.js sau ReactJS | React.js sau ReactJS | ||
| - | Biblioteca de Javascript | + | * Biblioteca de Javascript |
| - | a aparut in 2013 | + | * a aparut in 2013 |
| - | creat si intretinut de Facebook si de o comunitate de dezvoltatori ( open source ) si desigur si de alte companii individuale. | + | * creat si intretinut de Facebook si de o comunitate de dezvoltatori ( open source ) si desigur si de alte companii individuale. |
| **SPA** | **SPA** | ||
| Line 18: | Line 19: | ||
| **JSX** | **JSX** | ||
| - | * Unordered List ItemSyntax Extension to JavaScript | + | * Syntax Extension to JavaScript |
| - | * Unordered List ItemFolosita in React pentru a descrie cum va arata o componenta | + | * Folosita in React pentru a descrie cum va arata o componenta |
| - | * Unordered List ItemJSX se poate sa va duca cu gandul la HTML, diferenta este ca JSX vine si cu toate functionalitatile JavaScript | + | * JSX se poate sa va duca cu gandul la HTML, diferenta este ca JSX vine si cu toate functionalitatile JavaScript |
| - | JSX reprezinta obiecte. | + | * JSX reprezinta obiecte. |
| - | const element = | + | const element = <h1>Hello, world!</h1> |
| - | <h1>Hello, world!</h1> | + | |
| - | const element = | + | const element = ( |
| - | ( | + | |
| <div> | <div> | ||
| <h1>Hello!</h1> | <h1>Hello!</h1> | ||
| <h2>Good to see you here.</h2> | <h2>Good to see you here.</h2> | ||
| </div> | </div> | ||
| - | ); | + | ); |
| **Javascript** | **Javascript** | ||
| Line 44: | Line 43: | ||
| **Variabile si constante** | **Variabile si constante** | ||
| - | let name = "Oliver"; | + | let name = 'Oliver'; |
| - | name = "Olivia"; //ok | + | name = 'Olivia'; //ok |
| - | const name = 'Oliver' | + | const name = 'Oliver'; |
| - | name = 'Oliver' // error | + | name = 'Oliver'; // error |
| **Tipuri de date** | **Tipuri de date** | ||
| Line 71: | Line 70: | ||
| **Rest Example** | **Rest Example** | ||
| - | function sumAll(...args) { | + | function sumAll(...args) { |
| - | // args is the name for the array | + | // args is the name for the array |
| - | let sum = 0; | + | let sum = 0; |
| - | for (let arg of args) sum += arg; | + | for (let arg of args) sum += arg; |
| - | return sum; | + | return sum; |
| - | } | + | } |
| - | alert( sumAll(1) ); // 1 | + | alert( sumAll(1) ); // 1 |
| - | alert( sumAll(1, 2) ); // 3 | + | alert( sumAll(1, 2) ); // 3 |
| - | alert( sumAll(1, 2, 3) ); // 6 | + | alert( sumAll(1, 2, 3) ); // 6 |
| Line 85: | Line 84: | ||
| **Spread Example** | **Spread Example** | ||
| - | let arr1 = [1, -2, 3, 4]; | + | let arr1 = [1, -2, 3, 4]; |
| - | let arr2 = [8, 3, -8, 1]; | + | let arr2 = [8, 3, -8, 1]; |
| - | alert( Math.max(1, ...arr1, 2, ...arr2, 25) ); // 25 | + | alert( Math.max(1, ...arr1, 2, ...arr2, 25) ); // 25 |
