diff --git a/react/3/NOTES.md b/react/3/NOTES.md
new file mode 100644
index 0000000..38bef8d
--- /dev/null
+++ b/react/3/NOTES.md
@@ -0,0 +1,7 @@
+# Notes
+
+## Props
+Props stands for properties.
+A system for passing data from a parent component to a child component. The goal is to customize or configure the child component.
+
+Props are objects so the fields have to be called as methods: `props.author` for instance.
\ No newline at end of file
diff --git a/react/3/components/src/ApprovalCard.js b/react/3/components/src/ApprovalCard.js
new file mode 100644
index 0000000..10ad94f
--- /dev/null
+++ b/react/3/components/src/ApprovalCard.js
@@ -0,0 +1,16 @@
+import React from 'react';
+
+
+const ApprovalCard = (props) => {
+ return (
+
+ )
+}
+
+export default ApprovalCard
\ No newline at end of file
diff --git a/react/3/components/src/CommentDetails.js b/react/3/components/src/CommentDetails.js
new file mode 100644
index 0000000..7c545fe
--- /dev/null
+++ b/react/3/components/src/CommentDetails.js
@@ -0,0 +1,21 @@
+import React from 'react';
+
+const CommentDetail = (props) => {
+ console.log(props)
+ return (
+
+ )
+}
+
+export default CommentDetail
\ No newline at end of file
diff --git a/react/3/components/src/index.js b/react/3/components/src/index.js
index c1c6033..3549c46 100644
--- a/react/3/components/src/index.js
+++ b/react/3/components/src/index.js
@@ -1,24 +1,23 @@
import React from 'react';
import ReactDOM from 'react-dom';
+import CommentDetail from './CommentDetails';
import faker from 'faker';
+import ApprovalCard from './ApprovalCard';
const App = () => {
return (
-
-
-
-
-
-
Same
-
- Today at 6:00PM
-
-
Nice blog post!
-
-
+
+
+ ApprovalCard>
+
+
+ ApprovalCard>
+
+
+ ApprovalCard>
- )
+ )
};
ReactDOM.render(, document.querySelector('#root'));