Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit df7599c

Browse files
node readme
1 parent c16915c commit df7599c

File tree

1 file changed

+19
-13
lines changed

1 file changed

+19
-13
lines changed

‎README.md

Lines changed: 19 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,18 @@
22

33
# FULL STACK COURSE 2023
44

5-
1. [FOR REACT JS MasterClass Course Material - CLICK HERE](#react-js-masterclass)
5+
1. [ REACT MasterClass Course Material - HERE](#react-js-masterclass)
66

77

8-
React JS 2023 Course [Video Link](https://youtu.be/6l8RWV8D-Yo)
8+
React 2023 [Video Link](https://youtu.be/6l8RWV8D-Yo)
99

1010

11-
2. [FOR NODE JS MasterClass Course Material - CLICK HERE](#node-js-masterclass)
11+
1. [ NODE MasterClass Course Material - HERE](#node-js-masterclass)
1212

13-
NODE JS 2023 Course [Video Link](https://youtu.be/ChVE-JbtYbM)
13+
NODE 2023 [Video Link](https://youtu.be/ChVE-JbtYbM)
1414

1515

16-
## React JS MasterClass
16+
# React JS MasterClass
1717

1818

1919

@@ -74,7 +74,7 @@ Hi, This is course page of **CoderDost Youtube Channel** React JS 2023 Course [V
7474

7575
- **Assignment 1** : Create a simple React app for **RESUME Builder**. It will be static website. You have to make components like **Resume** as top level and under it - **Skills**, **Education**, **Experience** etc as components. All resume data will be under 1 big JavaScript object like which you can us in components via props. You can fix the number of items in **Skills**, **Education**, **Experience** or any section. Example you can say that only 3 experience items is allowed.
7676

77-
```
77+
```js
7878
resume = {
7979
experience : [ { year:2012, company:'xyz', role:'something' }],
8080
education:[ ],
@@ -91,10 +91,11 @@ Hi, This is course page of **CoderDost Youtube Channel** React JS 2023 Course [V
9191
### Special Assignments ==============
9292

9393
- **Assignment 2** : Create a Parent Component called **Border** which can provide some CSS border to any component nested into it. [Hint : You will need to use `children` props here
94+
```jsx
9495
< Border>
9596
< Component >
9697
< Border />
97-
98+
```
9899

99100
### Related Videos :
100101
1. De-structuring Assignment : [Long Video](https://youtu.be/sNhqFofQhFs) | [Object De-structure Short Video](https://youtube.com/shorts/H3MKXE69_c8) | [Array De-structure Short Video](https://youtube.com/shorts/ONGyMq49kZY)
@@ -106,7 +107,7 @@ Hi, This is course page of **CoderDost Youtube Channel** React JS 2023 Course [V
106107

107108

108109
- **Assignment 1** : Make a simple component which can conditionally render a list with **number** or **alphabets** or ***bullets*** in HTML for number. e..g. use a prop like `layout` for this. Also use a prop `items` for array of items in list.
109-
```
110+
```jsx
110111
< List layout="numbered" items={items}/>
111112
< List layout="alpha" items={items}/>
112113
< List layout="bullet" items={items}/>
@@ -117,7 +118,7 @@ Hi, This is course page of **CoderDost Youtube Channel** React JS 2023 Course [V
117118
2. You have to use `map` in most places where there are arrays. Like **Skills**, **Education**, **Experience** if there are 3 entries, use `map` to display 3 experience items. You don't need fix number of items. Any array can have 1 to 10(or some Limit) any number of items. You can put some Limit, so that your layout is not affected.
118119
3. Conditionally put some styling to **Resume**. Like `light` theme or `dark` theme or any other way you can switch the CSS layouts.
119120

120-
```
121+
```js
121122
resume = {
122123
experience : [ { year:2012, company:'xyz', role:'something' }],
123124
education:[ ],
@@ -192,7 +193,8 @@ Hi, This is course page of **CoderDost Youtube Channel** React JS 2023 Course [V
192193

193194
- **Assignment 1** : Create a Dropdown (< Select >) menu which is formed by a `nations` array. You can push to this array new items using a 2 **input textbox** (for country name and code) and **button**.
194195
On selection of the any option from dropdown, its value should be displayed on console.log
195-
```
196+
197+
``` js
196198
const nations = [
197199
{ name: 'India', value: 'IN' },
198200
{ name: 'Pak', value: 'PK' },
@@ -317,7 +319,9 @@ https://beta.reactjs.org/learn/passing-data-deeply-with-context#challenges
317319
### Special Assignments
318320

319321
- **Assignment 1** : Make a **useCounter** Hook: To keep track of a number that can be incremented or decremented.
320-
``` const [count, increment, decrement] = useCounter(0);```
322+
```js
323+
const [count, increment, decrement] = useCounter(0);
324+
```
321325

322326

323327
## Chapter 11 - useRef
@@ -330,7 +334,9 @@ https://beta.reactjs.org/learn/referencing-values-with-refs#challenges
330334
https://beta.reactjs.org/learn/manipulating-the-dom-with-refs#challenges
331335

332336
- **Assignment 3** : Make a **useWindowSize** Hook: which returns size of current browser window.
333-
``` const [width, height] = useWindowSize();```
337+
```js
338+
const [width, height] = useWindowSize();
339+
```
334340

335341

336342

@@ -398,8 +404,8 @@ Try to use `window.print` functionality as show in code without flushSync and se
398404

399405
------
400406
--- END OF REACT COURSE ------
401-
------
402407

408+
------
403409

404410

405411
# Node JS MasterClass

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /