Updated file management

src/componets/About.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import picture from '../assets/itsa_me.JPG'
+import AOS from 'aos'
+
+export default function About(){
+    return(
+        <>
+        <div data-aos="fade-in">
+            <h2>A biography</h2>
+            <p>Ahoy, I'm Andrew Simonson</p>
+            <p>I'm primarily an <strong>extremely</strong> forgetful person 
+                who, when productive, rewrites fate in favor of my own 
+                short-term interests, or rather, whatever half-assed mistake
+                results from the attempt.</p>
+            <p>When I'm not <del>losing my mind</del>wasting time, 
+                you can find me building discord bots, playing chess, 
+                or actually exercising, doing things like, idk, playing
+                racquetball or soccer.</p>
+            <p>I'm a first year student at <strong>Rochester Institute of Technology </strong>
+                in the <b>Computing Exploration</b> program.  I'm from Hagerstown, 
+                Maryland.</p>
+        </div>
+            <img alt='me' src={picture} className='sideimg' data-aos='fade-up' />
+        </>
+    )
+}

src/componets/Nav.js

@@ -0,0 +1,18 @@
+import React from 'react';
+
+export default function Nav(props){
+    let items;
+    for(let i = 0; i < props.children.length; i++){
+        items = (
+            <>
+                {items}
+                <li>{props.children[i]}</li>
+            </>
+        )
+    }
+    return(
+        <ul className='navBar'>
+            {items}
+        </ul>
+    )
+}

src/componets/Project.js

@@ -0,0 +1,22 @@
+import React from 'react'
+
+export default class Project extends React.Component {
+    constructor(props){
+        super(props)
+    }
+
+    render(){
+        return (
+            <li className={'project'} data-aos='fade-in' data-aos-offset={0}>
+                <div className='topBox'>
+                    <h3>{this.props.title}</h3>
+                    <p className={this.props.status + " tab"}>⬤</p>
+                    <p className='body'>{this.props.children}</p>
+                </div>
+                <div className='bottomBox'>
+                    <a href={this.props.link}>{this.props.linkText}</a>
+                </div>
+            </li>
+        )
+    }
+}

src/componets/ProjectList.js

@@ -0,0 +1,20 @@
+import React from 'react'
+
+export default function ProjectList(props){
+    let projects;
+    props.children.forEach(function(x){
+        projects = (
+            <>
+            {projects}
+            {x}
+            </>
+        );
+    });
+    return(
+        <>
+        <ul className='projectList'>
+            {projects}
+        </ul>
+        </>
+    );
+} 

src/componets/Socials.js

@@ -0,0 +1,19 @@
+import React from 'react';
+
+import github from '../assets/github.svg'
+import instagram from '../assets/instagram.svg'
+import linkedin from '../assets/linkedin.svg'
+import email from '../assets/email.svg'
+
+export default function Socials(){
+    return(
+        <table class='socials'>
+            <tr>
+                <td><a href='https://github.com/asimonson1125'><img alt='Github' src={github} /></a></td>
+                <td><a href='https://www.instagram.com/an_a.simonson/'><img alt='Instagram' src={instagram} /></a></td>
+                <td><a href='https://www.linkedin.com/in/simonsonandrew/'><img alt='LinkedIn' src={linkedin} /></a></td>
+                <td><a href='mailto:asimonson1125@gmail.com'><img alt='E-mail' src={email} /></a></td>
+            </tr>
+        </table>
+    )
+}