diff --git a/package-lock.json b/package-lock.json
index f7b6666..a74e0eb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4583,6 +4583,15 @@
         "@types/node": "*"
       }
     },
+    "@types/hoist-non-react-statics": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz",
+      "integrity": "sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==",
+      "requires": {
+        "@types/react": "*",
+        "hoist-non-react-statics": "^3.3.0"
+      }
+    },
     "@types/html-minifier-terser": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/@types/html-minifier-terser/-/html-minifier-terser-5.1.1.tgz",
@@ -4679,6 +4688,17 @@
         }
       }
     },
+    "@types/react-redux": {
+      "version": "7.1.16",
+      "resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.16.tgz",
+      "integrity": "sha512-f/FKzIrZwZk7YEO9E1yoxIuDNRiDducxkFlkw/GNMGEnK9n4K8wJzlJBghpSuOVDgEUHoDkDF7Gi9lHNQR4siw==",
+      "requires": {
+        "@types/hoist-non-react-statics": "^3.3.0",
+        "@types/react": "*",
+        "hoist-non-react-statics": "^3.3.0",
+        "redux": "^4.0.0"
+      }
+    },
     "@types/react-transition-group": {
       "version": "4.4.0",
       "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.0.tgz",
@@ -15356,11 +15376,12 @@
       }
     },
     "react-redux": {
-      "version": "7.2.2",
-      "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.2.tgz",
-      "integrity": "sha512-8+CQ1EvIVFkYL/vu6Olo7JFLWop1qRUeb46sGtIMDCSpgwPQq8fPLpirIB0iTqFe9XYEFPHssdX8/UwN6pAkEA==",
+      "version": "7.2.3",
+      "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.3.tgz",
+      "integrity": "sha512-ZhAmQ1lrK+Pyi0ZXNMUZuYxYAZd59wFuVDGUt536kSGdD0ya9Q7BfsE95E3TsFLE3kOSFp5m6G5qbatE+Ic1+w==",
       "requires": {
         "@babel/runtime": "^7.12.1",
+        "@types/react-redux": "^7.1.16",
         "hoist-non-react-statics": "^3.3.2",
         "loose-envify": "^1.4.0",
         "prop-types": "^15.7.2",
diff --git a/package.json b/package.json
index 4a1a5cb..3e31a96 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,7 @@
     "dotenv": "^8.2.0",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
-    "react-redux": "^7.2.2",
+    "react-redux": "^7.2.3",
     "react-router-dom": "^5.2.0",
     "react-scripts": "4.0.1",
     "redux": "^4.0.5",
diff --git a/src/actions/TYPES.js b/src/actions/TYPES.js
index d895687..0ad6667 100644
--- a/src/actions/TYPES.js
+++ b/src/actions/TYPES.js
@@ -11,3 +11,6 @@ export const SET_WEEKS = "SET_WEEKS";
 
 //entries
 export const SET_ENTRIES = "SET_ENTRIES";
+
+//notes 
+export const SET_NOTES = "SET_NOTES";
diff --git a/src/actions/index.js b/src/actions/index.js
index a96b81d..d1c200c 100644
--- a/src/actions/index.js
+++ b/src/actions/index.js
@@ -14,8 +14,11 @@ export const getUser = (cognitoUser) => async (dispatch) => {
 
     const weeks = user.docBody.journal.weeks;
     const entries = user.docBody.journal.weeks[0].entries;
+    const notes = user.docBody.notes;
+
     dispatch({ type: SET_WEEKS, payload: weeks });
     dispatch({ type: SET_ENTRIES, payload: entries });
+    dispatch({ type: SET_NOTES, payload: notes });
   } catch (err) {
     console.log(err);
   }
diff --git a/src/actions/notes.js b/src/actions/notes.js
new file mode 100644
index 0000000..25c8311
--- /dev/null
+++ b/src/actions/notes.js
@@ -0,0 +1,61 @@
+import { SET_NOTES, SET_USER } from "./TYPES";
+import axios from "axios";
+import store from "../store";
+
+const BASE_URL = "https://vip3e81bu0.execute-api.us-east-1.amazonaws.com/test";
+
+export const getNotes = () => (dispatch) => {
+  const state = store.getState();
+  const notes = state.notesData.notes;
+  dispatch({ type: SET_NOTES, payload: notes });
+};
+
+export const addNote = (cognitoUser, content) => async (dispatch) => {
+  try {
+    const data = {
+      note: {
+        content: content,
+      },
+    };
+    const headers = {
+      headers: { Authorization: "Bearer " + cognitoUser.jwtToken },
+    };
+    const path = BASE_URL + `/users/${cognitoUser.cognitoId}/notes`;
+    const res = await axios.post(path, data, headers);
+    console.log(res);
+    const user = res.data.data.Attributes;
+    dispatch({ type: SET_USER, payload: user });
+
+    const notes = user.docBody.notes;
+    dispatch({ type: SET_NOTES, payload: notes });
+  } catch (err) {
+    console.log(err);
+  }
+};
+
+export const updateNote = (cognitoUser, noteID, content) => async (
+  dispatch
+) => {
+  try {
+    const data = {
+      note: {
+        content: content,
+      },
+    };
+    const headers = {
+      headers: { Authorization: "Bearer " + cognitoUser.jwtToken },
+    };
+    const path = BASE_URL + `/users/${cognitoUser.cognitoId}/notes/${noteID}`;
+    const res = await axios.put(path, data, headers);
+    console.log("res: ", res);
+
+    //not sure why its one data only vs 2 for adding notes?
+    const user = res.data.Attributes;
+    dispatch({ type: SET_USER, payload: user });
+
+    const notes = user.docBody.notes;
+    dispatch({ type: SET_NOTES, payload: notes });
+  } catch (err) {
+    console.log(err);
+  }
+};
diff --git a/src/actions/user.js b/src/actions/user.js
index 865bf5a..bd61eba 100644
--- a/src/actions/user.js
+++ b/src/actions/user.js
@@ -1,4 +1,10 @@
-import { SET_USER, SET_COGNITO_DATA, SET_WEEKS, SET_ENTRIES } from "./TYPES";
+import {
+  SET_USER,
+  SET_COGNITO_DATA,
+  SET_WEEKS,
+  SET_ENTRIES,
+  SET_NOTES,
+} from "./TYPES";
 import axios from "axios";
 import { GET_USER_URI } from "../setupEnv";
 
@@ -33,7 +39,10 @@ export const reduceUser = (user, weekIndex = 0) => (dispatch) => {
   if (user === null) return;
   const weeks = user.docBody ? user.docBody.journal.weeks : [];
   const entries = weeks.length > 0 ? weeks[weekIndex].entries : [];
+  const notes = user.docBody ? user.docBody?.notes : {};
+
   dispatch({ type: SET_USER, payload: user });
   dispatch({ type: SET_WEEKS, payload: weeks });
   dispatch({ type: SET_ENTRIES, payload: entries });
+  dispatch({ type: SET_NOTES, payload: notes });
 };
diff --git a/src/components/journal/JournalDash.js b/src/components/journal/JournalDash.js
index a4675bc..eb365c3 100644
--- a/src/components/journal/JournalDash.js
+++ b/src/components/journal/JournalDash.js
@@ -62,14 +62,14 @@ class JournalDash extends Component {
               weekIndex={weekIndex}
             />
           </Grid>
-          <Grid item xs={6}>
+          <Grid item xs={8}>
             <EditorTab
               entries={entries}
               weekIndex={weekIndex}
               entryIndex={entryIndex}
             />
           </Grid>
-          <Grid item xs={4}>
+          <Grid item xs={2}>
             <EntriesTab
               setEntryIndex={this.setEntryIndex}
               entries={entries}
diff --git a/src/components/notes/Note.js b/src/components/notes/Note.js
new file mode 100644
index 0000000..a083c12
--- /dev/null
+++ b/src/components/notes/Note.js
@@ -0,0 +1,86 @@
+import React, { useState, useCallback } from "react";
+import { Button, Paper, Typography, Card } from "@material-ui/core";
+import axios from "axios";
+
+import "../../styles/notes.css";
+import Texteditor from "../TextEditor";
+import { connect } from "react-redux";
+import { reduceUser } from "../../actions/user";
+import { updateNote } from "../../actions/notes";
+
+import { REACT_APP_STAG_BASE } from "../../setupEnv";
+
+// get content from note
+const contentPlaceholder =
+  "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed laoreet erat eu diam condimentum imperdiet. Praesent vitae massa sed neque lobortis viverra. Vestibulum euismod mattis suscipit.";
+
+function Note({ cognitoUser, noteID, content, updateNote, deleteNoteList }) {
+  const [edit, setEdit] = useState(false);
+  const [contentText, setContentText] = useState(content || contentPlaceholder);
+  const [noteId, setNoteId] = useState(noteID);
+
+  const saveUpdateNote = useCallback(async () => {
+    console.log("update: ", noteId, "contentText: ", contentText);
+    await updateNote(cognitoUser, noteId, contentText);
+  }, [contentText, noteId]);
+
+  const handleEdit = useCallback(async () => {
+    if (edit) await saveUpdateNote();
+    const editState = !edit;
+    setEdit(editState);
+  }, [edit, setEdit, saveUpdateNote]);
+
+  const handleText = useCallback(
+    (text) => {
+      setContentText(text);
+    },
+    [setContentText]
+  );
+
+  const deleteNote = async () => {
+    deleteNoteList(noteID);
+    try {
+      const res = await axios.delete(
+        REACT_APP_STAG_BASE + `users/${cognitoUser.cognitoId}/notes/${noteID}`
+      );
+      reduceUser(res.data.Attributes);
+    } catch (e) {
+      console.log(e);
+    }
+  };
+
+  return (
+    <div className="Note">
+      <Card raised="true">
+        <Paper>
+          <div className="cardContainer">
+            {edit ? (
+              <Texteditor
+                entry={{ content: contentText }}
+                onChange={handleText}
+              />
+            ) : (
+              //<Typography variant="body2"> {content} </Typography>
+              <div dangerouslySetInnerHTML={{ __html: contentText }} />
+            )}
+            <Button variant="outlined" size="small" onClick={handleEdit}>
+              {edit ? "save" : "edit"}
+            </Button>
+            <Button variant="outlined" size="small">
+              pin
+            </Button>
+            <Button variant="outlined" size="small" onClick={deleteNote}>
+              delete
+            </Button>
+          </div>
+        </Paper>
+      </Card>
+    </div>
+  );
+}
+
+const mapStateToProps = (state) => ({
+  cognitoUser: state.userData.cognitoUser,
+});
+
+export default connect(mapStateToProps, { updateNote, reduceUser })(Note);
diff --git a/src/components/notes/NotesDash.js b/src/components/notes/NotesDash.js
index 1b26c21..ed55466 100644
--- a/src/components/notes/NotesDash.js
+++ b/src/components/notes/NotesDash.js
@@ -1,14 +1,82 @@
-import React, { Component } from "react";
+import React, { useCallback, useEffect, useState, useMemo } from "react";
+import Note from "./Note.js";
+import { Grid, Button } from "@material-ui/core";
+import { addNote, getNotes } from "../../actions/notes";
+import { connect } from "react-redux";
 
-class NotesDash extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {};
-  }
+const NotesDash = ({ user, cognitoUser, notes, getNotes, addNote }) => {
+  const [notesList, setNotesList] = useState(notes);
+  console.log("notes: ", notes);
+  // map through retrieved notes to display.
+  const handleAddNotes = useCallback(async () => {
+    await addNote(cognitoUser, "");
+    await getNotes();
+  }, []);
 
-  render() {
-    return <div>Notes Dashboard...</div>;
-  }
-}
+  useEffect(() => {
+    const fetchNote = async () => {
+      await getNotes();
+    };
+    fetchNote();
+  }, []);
 
-export default NotesDash;
+  useEffect(() => {
+    setNotesList(notes);
+  }, [notes]);
+
+  const mappedNotes = useMemo(() => {
+    const notesArr = [];
+    for (const key in notesList) {
+      notesArr.push({
+        id: notesList[key]?.id,
+        content: notesList[key]?.content || "",
+      });
+    }
+    return notesArr;
+  }, [notesList]);
+
+  const deleteNoteList = useCallback(
+    (id) => {
+      const updatedNotesList = mappedNotes.filter((note) => note?.id !== id);
+      setNotesList(updatedNotesList);
+    },
+    [notesList, setNotesList]
+  );
+
+  return (
+    <div>
+      <Button
+        variant="contained"
+        color="primary"
+        size="large"
+        onClick={handleAddNotes}
+      >
+        Add+
+      </Button>
+      <Grid container direction="row">
+        {mappedNotes.map((note) => {
+          console.log("note: ", note);
+          return (
+            <Note
+              key={`id_${note?.id}`}
+              noteID={note?.id}
+              content={note?.content}
+              deleteNoteList={deleteNoteList}
+            />
+          );
+        })}
+      </Grid>
+    </div>
+  );
+};
+
+const mapStateToProps = (state) => ({
+  user: state.userData.user,
+  cognitoUser: state.userData.cognitoUser,
+  notes: state?.notesData?.notes,
+});
+
+export default connect(mapStateToProps, {
+  getNotes,
+  addNote,
+})(NotesDash);
diff --git a/src/reducers/index.js b/src/reducers/index.js
index 193cbaf..2ce9fd8 100644
--- a/src/reducers/index.js
+++ b/src/reducers/index.js
@@ -2,9 +2,11 @@ import { combineReducers } from "redux";
 import userReducer from "./userReducer";
 import weeksReducer from "./weeksReducer";
 import entriesReducer from "./entriesReducer";
+import notesReducer from "./notesReducer";
 
 export default combineReducers({
   userData: userReducer,
   weeksData: weeksReducer,
   entriesData: entriesReducer,
+  notesData: notesReducer,
 });
diff --git a/src/reducers/notesReducer.js b/src/reducers/notesReducer.js
new file mode 100644
index 0000000..b7bc0b8
--- /dev/null
+++ b/src/reducers/notesReducer.js
@@ -0,0 +1,18 @@
+import { SET_NOTES } from "../actions/TYPES";
+
+export default function notesReducer (
+    state = {
+        notes: null,
+    },
+    action 
+) {
+    switch(action.type) {
+        case SET_NOTES:
+            return {
+                ...state,
+                notes: action.payload,
+            };
+        default:
+            return state; 
+    }
+}
\ No newline at end of file
diff --git a/src/styles/globals.css b/src/styles/globals.css
index 8cc33c0..8f597e7 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -92,3 +92,6 @@ button:focus {
 .text-editor {
   width: 100%;
 }
+.ck-editor__editable {
+  min-height: 300px;
+}
diff --git a/src/styles/notes.css b/src/styles/notes.css
new file mode 100644
index 0000000..6888c45
--- /dev/null
+++ b/src/styles/notes.css
@@ -0,0 +1,9 @@
+.Note {
+    margin: 10px;
+    max-width: 20vw;
+    height: auto;
+}
+
+.cardContainer{
+    padding: 10px;
+}
\ No newline at end of file