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 5f634ef7c3 into 8b41cd49c3

Browse Source
pull/74/merge
Danbi Lee 2 years ago committed by GitHub
parent 8b41cd49c3 5f634ef7c3
commit be8083d65f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
41 changed files with 26 additions and 223 deletions
Show Stats Download Patch File Download Diff File

8
02_Day_Introduction_to_React/02_introduction_to_react.md
Unescape View File

@ -726,8 +726,6 @@ Instead of style object using regular styling method is more easy than the one a
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -1004,8 +1002,6 @@ Now, let us put everything together. Here, in the example below, the data is inj
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -1214,8 +1210,6 @@ In the following code example, the list is now containing list elements and it i
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -1420,8 +1414,6 @@ As you can see above, now the lists are formatted properly, but there is a warni
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */

2
03_Day_Setting_Up/03_setting_up_boilerplate/public/index.html
Unescape View File

@ -77,8 +77,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */

8
04_Day_Components/04_components_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

8
05_Day_Props/05_props_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

8
06_Day_Map_List_Keys/06_map_list_keys_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

8
07_Day_Class_Components/07_class_based_components_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

8
08_Day_States/08_states_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

8
09_Day_Conditional_Rendering/09_conditional_rendering_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

4
10_React_Project_Folder_Structure/10_react_project_folder_structure_boilerplate/src/styles/footer.css
Unescape View File

@ -1,6 +1,4 @@
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -11,4 +9,4 @@ footer {
font-weight: 400;
text-align: center;
line-height: 60px;
}
}

1
10_React_Project_Folder_Structure/10_react_project_folder_structure_boilerplate/src/styles/header.css
Unescape View File

@ -1,5 +1,4 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}

8
12_Day_Forms/12_forms_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

8
13_Day_Controlled_Versus_Uncontrolled_Input/13_uncontrolled_input_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

8
14_Day_Component_Life_Cycles/14_component_life_cycles_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

3
15_Third_Party_Packages/15_third_party_packages.md
Unescape View File

@ -85,7 +85,6 @@ After installing node-sass you can start using Sass in React. Create a styles fo
/* ./styles/header.scss */
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
margin: 0;
}
@ -147,7 +146,6 @@ Naming:
/* ./styles/header.module.scss */
.header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
margin: 0;
}
@ -384,7 +382,6 @@ const Title = styled.h1`
`
const Header = styled.header`
background-color: #61dbfb;
padding: 25;
padding: 10px;
margin: 0;
`

8
15_Third_Party_Packages/15_third_pary_packages_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

1
15_Third_Party_Packages/15_third_pary_packages_boilerplate/src/index.js
Unescape View File

@ -19,7 +19,6 @@ const SubTitle = styled.h2`
const Header = styled.header`
background-color: #61dbfb;
padding: 25;
padding: 10px;
margin: 0;
`

8
16_Higher_Order_Component/16_higher_order_component_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

8
17_React_Router/17_react_router_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

8
18_Fetch_And_Axios/18_fetch_and_axios_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

8
19_projects/19_projects_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

8
20_projects/20_projects_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

8
21_Introducing_Hooks/21_introducing_hooks_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

3
21_Introducing_Hooks/21_introducing_hooks_boilerplate/src/index.scss
Unescape View File

@ -45,7 +45,6 @@ h3 {
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -64,8 +63,6 @@ ul li {
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */

8
22_Form_Using_Hooks/22_form_using_hooks_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

3
22_Form_Using_Hooks/22_form_using_hooks_boilerplate/src/index.scss
Unescape View File

@ -45,7 +45,6 @@ h3 {
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -64,8 +63,6 @@ ul li {
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */

8
23_Fetching_Data_Using_Hooks/23_fetching_data_using_hooks_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

3
23_Fetching_Data_Using_Hooks/23_fetching_data_using_hooks_boilerplate/src/index.scss
Unescape View File

@ -45,7 +45,6 @@ h3 {
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -64,8 +63,6 @@ ul li {
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */

8
24_projects/24_projects_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

3
24_projects/24_projects_boilerplate/src/index.scss
Unescape View File

@ -45,7 +45,6 @@ h3 {
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -64,8 +63,6 @@ ul li {
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */

8
25_Custom_Hooks/25_custom_hooks_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

3
25_Custom_Hooks/25_custom_hooks_boilerplate/src/index.scss
Unescape View File

@ -45,7 +45,6 @@ h3 {
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -64,8 +63,6 @@ ul li {
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */

8
26_Context/26_context_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

3
26_Context/26_context_boilerplate/src/index.scss
Unescape View File

@ -45,7 +45,6 @@ h3 {
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -64,8 +63,6 @@ ul li {
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */

8
27_Ref/27_ref_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

3
27_Ref/27_ref_boilerplate/src/index.scss
Unescape View File

@ -45,7 +45,6 @@ h3 {
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -64,8 +63,6 @@ ul li {
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */

8
28_project/28_project_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

3
28_project/28_project_boilerplate/src/index.scss
Unescape View File

@ -45,7 +45,6 @@ h3 {
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -64,8 +63,6 @@ ul li {
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */

8
29_explore/29_explore_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

3
29_explore/29_explore_boilerplate/src/index.scss
Unescape View File

@ -45,7 +45,6 @@ h3 {
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -64,8 +63,6 @@ ul li {
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */

8
30_conclusions/30_conclusions_boilerplate/public/index.html
Unescape View File

@ -14,9 +14,8 @@
<title>30 Days Of React App</title>
<style>
/* == General style === */
* {
box-sizing: border-box;
padding: 0;
@ -62,7 +61,6 @@
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -81,8 +79,6 @@
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */
@ -101,9 +97,7 @@
border-radius: 50%;
width: 14%;
}
</style>
</head>
<body>
<div id="root"></div>

3
30_conclusions/30_conclusions_boilerplate/src/index.scss
Unescape View File

@ -45,7 +45,6 @@ h3 {
header {
background-color: #61dbfb;
padding: 25;
padding: 10px;
}
@ -64,8 +63,6 @@ ul li {
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
/* Height of the footer */

Write Preview
Loading…
Cancel
Save