adding docs, to do

src/App.js

@@ -1,15 +1,27 @@
 import { BrowserRouter, Routes, Route } from 'react-router-dom';
+import './App.scss';
+
+// pages
 import Welcome from './pages/Welcome';
 import AboutMe from './pages/AboutMe';
+import Projects from './pages/Projects';
 import Technologies from './pages/Technologies';
 import Links from './pages/Links';
 import CreativeWorks from './pages/CreativeWorks';
-import Projects from './pages/Projects';
-import './App.scss';
 
 function App() {
   return (
     <div className="App">
+
+      {/*
+
+      To do: implement sidebar navigation with Drawer component
+      Work on styling in secondary pages
+      Bug in CSS animation in Technologies
+      Make list items in creative works iterable, as the gallery below
+      Move gallery iteration logic to external util folder? Make reusable?
+
+      */}
       
       <header className="app-navbar">
         <a href="/" className="my-name">Mikayla Dobson</a>

src/pages/Welcome.js

@@ -1,5 +1,5 @@
 import '../App.scss';
-import { useEffect, useState, useRef, useMemo } from 'react';
+import { useEffect, useState, useRef } from 'react';
 
 // MUI components
 
@@ -70,6 +70,22 @@ export default function Welcome() {
     }, [gallery]);
 
     // gallery page change logic
+
+    /**
+     * 
+     * TO DO: port these functions to external utils
+     * these will need to take parameters: array as state, callback function to set state
+     * @param1 = array (stateful object)
+     * @param2 = array of React components to map through
+     * @param3 = callback function to set state
+     * 
+     * In below:
+     * @param1 = gallery
+     * @param2 = galleryButtons
+     * @param3 = setGallery
+     * 
+     */
+    
     const handleDecrement = () => {
         let newState = [];
         for (let each of gallery) {