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

Merge 7d1846d445 into d0c066fcb9

Browse Source
pull/236/merge
reiuyuu 3 years ago committed by GitHub
parent d0c066fcb9 7d1846d445
commit ca176cb9fb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 41 additions and 41 deletions
Show Stats Download Patch File Download Diff File

8
10_React_Project_Folder_Structure/10_react_project_folder_structure.md
Unescape View File

@ -86,7 +86,7 @@ Exporting in a function declaration, a regular function
```js ```js
// src/App.js // src/App.js
import React from 'react import React from 'react'
// named export in regular function, function declaration // named export in regular function, function declaration
export function App () { export function App () {
return <h1>Welcome to 30 Days Of React</h1> return <h1>Welcome to 30 Days Of React</h1>
@ -109,7 +109,7 @@ We saw a named export and now let's implement it with default export. We can do
```js ```js
// src/App.js // src/App.js
import React from 'react import React from 'react'
// export default in arrow function // export default in arrow function
export default const App = () => <h1>Welcome to 30 Days Of React</h1> export default const App = () => <h1>Welcome to 30 Days Of React</h1>
@ -117,7 +117,7 @@ export default const App = () => <h1>Welcome to 30 Days Of React</h1>
```js ```js
// src/App.js // src/App.js
import React from 'react import React from 'react'
// export default in arrow function // export default in arrow function
export default function App () { export default function App () {
return <h1>Welcome to 30 Days Of React</h1> return <h1>Welcome to 30 Days Of React</h1>
@ -127,7 +127,7 @@ export default function App () {
```js ```js
// src/App.js // src/App.js
// Recommended for most of the cases // Recommended for most of the cases
import React from 'react import React from 'react'
const App = () => <h1>Welcome to 30 Days Of React</h1> const App = () => <h1>Welcome to 30 Days Of React</h1>
export default App export default App
``` ```

2
11_Day_Events/11_events.md
Unescape View File

@ -48,7 +48,7 @@ Event handling in HTML
<title>30 Days Of React App</title> <title>30 Days Of React App</title>
</head> </head>
<body> <body>
<button>onclick="greetPeople()">Greet People</button> <button onclick="greetPeople()">Greet People</button>
<script> <script>
const greetPeople = () => { const greetPeople = () => {
alert('Welcome to 30 Days Of React Challenge') alert('Welcome to 30 Days Of React Challenge')

2
12_Day_Forms/12_forms.md
Unescape View File

@ -308,7 +308,7 @@ class App extends React.Component {
skills: { ...this.state.skills, [name]: checked }, skills: { ...this.state.skills, [name]: checked },
}) })
} else if (type === 'file') { } else if (type === 'file') {
console.log(type, 'cehck here') console.log(type, 'check here')
this.setState({ [name]: e.target.files[0] }) this.setState({ [name]: e.target.files[0] })
} else { } else {
this.setState({ [name]: value }) this.setState({ [name]: value })

2
13_Day_Controlled_Versus_Uncontrolled_Input/13_uncontrolled_input.md
Unescape View File

@ -14,7 +14,7 @@
</div> </div>
[<< Day 12](../12_Day_Forms/12_forms.md) | [Day 14 >>]() [<< Day 12](../12_Day_Forms/12_forms.md) | [Day 14 >>](../14_Day_Component_Life_Cycles/14_component_life_cycles.md)
![30 Days of React banner](../images/30_days_of_react_banner_day_13.jpg) ![30 Days of React banner](../images/30_days_of_react_banner_day_13.jpg)

14
15_Third_Party_Packages/15_third_party_packages.md
Unescape View File

@ -94,8 +94,8 @@ header {
```js ```js
// Header.js // Header.js
import React from 'react' import React from 'react'
import './styles/header.scss import './styles/header.scss'
const Header = () = ( const Header = () => (
<header> <header>
<div className='header-wrapper'> <div className='header-wrapper'>
<h1>30 Days Of React</h1> <h1>30 Days Of React</h1>
@ -160,11 +160,11 @@ Naming:
```js ```js
// Header.js // Header.js
import React from 'react' import React from 'react'
import headerStyles from './styles/header.module.scss import headerStyles from './styles/header.module.scss'
// We can all destructure the class name // We can all destructure the class name
const {header, headerWrapper} = headerStyles const { header, headerWrapper } = headerStyles
const Header = () = ( const Header = () => (
<header className = {headerStyles.header}> <header className={headerStyles.header}>
<div className={headerStyles.headerWrapper}> <div className={headerStyles.headerWrapper}>
<h1>30 Days Of React</h1> <h1>30 Days Of React</h1>
<h2>Getting Started React</h2> <h2>Getting Started React</h2>
@ -183,7 +183,7 @@ export default Header
import React, { Component } from 'react' import React, { Component } from 'react'
import ReactDOM from 'react-dom' import ReactDOM from 'react-dom'
import './styles/header.scss import './styles/header.scss'
class App extends Component { class App extends Component {
render() { render() {

2
18_Fetch_And_Axios/18_fetch_axios.md
Unescape View File

@ -14,7 +14,7 @@
</div> </div>
[<< Day 17](../17_React_Router/17_react_router.md) | [Day 19>>]() [<< Day 17](../17_React_Router/17_react_router.md) | [Day 19>>](../19_projects/19_projects.md)
![30 Days of React banner](../images/30_days_of_react_banner_day_18.jpg) ![30 Days of React banner](../images/30_days_of_react_banner_day_18.jpg)

2
19_projects/19_projects.md
Unescape View File

@ -14,7 +14,7 @@
</div> </div>
[<< Day 18](../18_Fetch_And_Axios/18_fetch_axios.md) | [Day 20>>]() [<< Day 18](../18_Fetch_And_Axios/18_fetch_axios.md) | [Day 20>>](../20_projects/20_projects.md)
![30 Days of React banner](../images/30_days_of_react_banner_day_19.jpg) ![30 Days of React banner](../images/30_days_of_react_banner_day_19.jpg)

2
20_projects/20_projects.md
Unescape View File

@ -14,7 +14,7 @@
</div> </div>
[<< Day 19](../19_projects/19_projects.md) | [Day 21>>]() [<< Day 19](../19_projects/19_projects.md) | [Day 21>>](../21_Introducing_Hooks/21_introducing_hooks.md)
![30 Days of React banner](../images/30_days_of_react_banner_day_20.jpg) ![30 Days of React banner](../images/30_days_of_react_banner_day_20.jpg)

2
21_Introducing_Hooks/21_introducing_hooks.md
Unescape View File

@ -14,7 +14,7 @@
</div> </div>
[<< Day 20](../20_projects/20_projects.md) | [Day 22>>]() [<< Day 20](../20_projects/20_projects.md) | [Day 22>>](../22_Form_Using_Hooks/22_form_using_hooks.md)
![30 Days of React banner](../images/30_days_of_react_banner_day_21.jpg) ![30 Days of React banner](../images/30_days_of_react_banner_day_21.jpg)

2
27_Ref/27_ref.md
Unescape View File

@ -14,7 +14,7 @@
</div> </div>
[<< Day 25](../25_Custom_Hooks/25_custom_hooks.md) | [Day 27>>]() [<< Day 26](../26_Context/26_context.md) | [Day 28>>](../28_project/28_project.md)
![30 Days of React banner](../images/30_days_of_react_banner_day_27.jpg) ![30 Days of React banner](../images/30_days_of_react_banner_day_27.jpg)

2
28_project/28_project.md
Unescape View File

@ -14,7 +14,7 @@
</div> </div>
[<< Day 27](../27_Ref/27_ref.md) | [Day 29>>]() [<< Day 27](../27_Ref/27_ref.md) | [Day 29>>](../29_explore/29_explore.md)
![30 Days of React banner](../images/30_days_of_react_banner_day_28.jpg) ![30 Days of React banner](../images/30_days_of_react_banner_day_28.jpg)

2
29_explore/29_explore.md
Unescape View File

@ -14,7 +14,7 @@
</div> </div>
[<< Day 28](../27_Ref/27_ref.md) | [Day 29 >>](../29_explore/29_explore.md) [<< Day 28](../27_Ref/27_ref.md) | [Day 30 >>](../30_conclusions/30_conclusions.md)
![30 Days of React banner](../images/30_days_of_react_banner_day_29.jpg) ![30 Days of React banner](../images/30_days_of_react_banner_day_29.jpg)

Write Preview
Loading…
Cancel
Save