Skip to content

Commit a7abe72

Browse files
AsabenehAsabeneh
committed
day 30
1 parent a9f9934 commit a7abe72

18 files changed

+13207
-2
lines changed

Diff for: ‎.gitignore

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ draft.md
22
react-for-everyone.md
33
component.md
44
draft
5-
30_conclusions
5+
66

77

88

Diff for: ‎15_Third_Party_Packages/15_third_party_packages.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414

1515
</div>
1616

17-
[<< Day 14](../14_Day_Component_Life_Cycles/14_component_life_cycles.md) | [Day 16 >>]()
17+
[<< Day 14](../14_Day_Component_Life_Cycles/14_component_life_cycles.md) | [Day 16 >>](../16_Higher_Order_Component/16_higher_order_component.md)
1818

1919
![30 Days of React banner](../images/30_days_of_react_banner_day_15.jpg)
2020

Diff for: ‎30_conclusions/30_conclusions.md

+30
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<div align="center">
2+
<h1> 30 Days Of React: Conclusions</h1>
3+
<a class="header-badge" target="_blank" href="https://www.linkedin.com/in/asabeneh/">
4+
<img src="https://img.shields.io/badge/style--5eba00.svg?label=LinkedIn&logo=linkedin&style=social">
5+
</a>
6+
<a class="header-badge" target="_blank" href="https://twitter.com/Asabeneh">
7+
<img alt="Twitter Follow" src="https://img.shields.io/twitter/follow/asabeneh?style=social">
8+
</a>
9+
10+
<sub>Author:
11+
<a href="https://www.linkedin.com/in/asabeneh/" target="_blank">Asabeneh Yetayeh</a><br>
12+
<small> October, 2020</small>
13+
</sub>
14+
15+
</div>
16+
17+
[<< Day 29](../29_explore/29_explore.md)
18+
19+
![30 Days of React banner](../images/30_days_of_react_banner_day_30.jpg)
20+
21+
# Conclusions
22+
23+
In this challenge, we have covered React with and without hooks. All the most important features of React has been included. If you did all the exercises and projects in this challenge I would say your React and JavaScript level is very high. You are ready for developer positions. This challenge was made in this month and it will be updated and improved in the coming months. We will correct grammar and typo mistakes. Some content might be added, the pending exercises in some days challenge will be included. It is good to check it at some point, because there might be some interesting projects.
24+
You have been learning and coding for the last 30 days and you made it to this day. You are a special person and you deserve recognition. Therefore, you can claim a 30 Days React challenge completion certificate. In addition, celebrate your success with a friend and family. I will see you in another challenge or courses. Thank you for being a proactive community member and part of the challenge. Finally, recommend the material for a family, friend or enemy if you believe that it helped you and of course support the author to create more learning materials.
25+
26+
# Exercises
27+
28+
🎉 CONGRATULATIONS ! 🎉
29+
30+
[<< Day 29](../29_explore/29_explore.md)

Diff for: ‎30_conclusions/30_conclusions_boilerplate/.gitignore

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# production
12+
/build
13+
14+
# misc
15+
.DS_Store
16+
.env.local
17+
.env.development.local
18+
.env.test.local
19+
.env.production.local
20+
21+
npm-debug.log*
22+
yarn-debug.log*
23+
yarn-error.log*

Diff for: ‎30_conclusions/30_conclusions_boilerplate/README.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
# 30 Days of React App: Day 25
2+
3+
In the project directory, you can run to start the project
4+
5+
### `npm start`

Diff for: ‎30_conclusions/30_conclusions_boilerplate/package.json

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"name": "30-days-of-react",
3+
"version": "0.1.0",
4+
"private": true,
5+
"dependencies": {
6+
"@testing-library/jest-dom": "^4.2.4",
7+
"@testing-library/react": "^9.3.2",
8+
"@testing-library/user-event": "^7.1.2",
9+
"react": "^16.13.1",
10+
"react-dom": "^16.13.1",
11+
"react-scripts": "3.4.3"
12+
},
13+
"scripts": {
14+
"start": "react-scripts start",
15+
"build": "react-scripts build",
16+
"test": "react-scripts test",
17+
"eject": "react-scripts eject"
18+
},
19+
"eslintConfig": {
20+
"extends": "react-app"
21+
},
22+
"browserslist": {
23+
"production": [
24+
">0.2%",
25+
"not dead",
26+
"not op_mini all"
27+
],
28+
"development": [
29+
"last 1 chrome version",
30+
"last 1 firefox version",
31+
"last 1 safari version"
32+
]
33+
}
34+
}

Diff for: ‎30_conclusions/30_conclusions_boilerplate/public/index.html

+111
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,111 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<link
7+
href="https://fonts.googleapis.com/css?family=Montserrat:300,400,500|Roboto:300,400,500&display=swap"
8+
rel="stylesheet"
9+
/>
10+
<meta
11+
name="description"
12+
content="Web site created using create-react-app"
13+
/>
14+
15+
<title>30 Days Of React App</title>
16+
<style>
17+
18+
/* == General style === */
19+
20+
* {
21+
box-sizing: border-box;
22+
padding: 0;
23+
margin: 0;
24+
}
25+
26+
html,
27+
body {
28+
height: 100%;
29+
line-height: 1.5;
30+
font-family: 'Montserrat';
31+
font-weight: 300;
32+
color: black;
33+
}
34+
35+
.root {
36+
min-height: 100%;
37+
position: relative;
38+
}
39+
40+
.header-wrapper,
41+
.main-wrapper,
42+
.footer-wrapper {
43+
width: 85%;
44+
margin: auto;
45+
}
46+
47+
.header-wrapper,
48+
.main-wrapper {
49+
padding: 10px;
50+
margin: 2px auto;
51+
}
52+
53+
h1 {
54+
font-size: 70px;
55+
font-weight: 300;
56+
}
57+
58+
h2,
59+
h3 {
60+
font-weight: 300;
61+
}
62+
63+
header {
64+
background-color: #61dbfb;
65+
padding: 25;
66+
padding: 10px;
67+
}
68+
69+
main {
70+
padding: 10px;
71+
padding-bottom: 60px;
72+
/* Height of the footer */
73+
}
74+
75+
ul {
76+
margin-left: 15px;
77+
}
78+
79+
ul li {
80+
list-style: none;
81+
}
82+
83+
footer {
84+
position: absolute;
85+
bottom: 0;
86+
width: 100%;
87+
height: 60px;
88+
/* Height of the footer */
89+
background: #6cf;
90+
}
91+
92+
.footer-wrapper {
93+
font-weight: 400;
94+
text-align: center;
95+
line-height: 60px;
96+
}
97+
.user-card {
98+
margin-top: 10px;
99+
}
100+
.user-card > img {
101+
border-radius: 50%;
102+
width: 14%;
103+
}
104+
105+
</style>
106+
107+
</head>
108+
<body>
109+
<div id="root"></div>
110+
</body>
111+
</html>

0 commit comments

Comments
 (0)