diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 0000000..bffb357 --- /dev/null +++ b/.eslintrc.json @@ -0,0 +1,3 @@ +{ + "extends": "next/core-web-vitals" +} diff --git a/.gitignore b/.gitignore index 169056a..6a94682 100644 --- a/.gitignore +++ b/.gitignore @@ -1,26 +1,37 @@ -# Logs -logs -*.log +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js +package-lock.json + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem +*.env + +# debug npm-debug.log* yarn-debug.log* yarn-error.log* -pnpm-debug.log* -lerna-debug.log* -node_modules -dist -dist-ssr -*.local -package-lock.json +# local env files +.env*.local -# Editor directories and files -.vscode/* -!.vscode/extensions.json -.idea -.DS_Store -*.suo -*.ntvs* -*.njsproj -*.sln -*.sw? -node_modules +# vercel +.vercel + +# typescript +*.tsbuildinfo +next-env.d.ts diff --git a/README.md b/README.md new file mode 100644 index 0000000..f4da3c4 --- /dev/null +++ b/README.md @@ -0,0 +1,34 @@ +This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). + +## Getting Started + +First, run the development server: + +```bash +npm run dev +# or +yarn dev +# or +pnpm dev +``` + +Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. + +You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. + +This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. + +## Learn More + +To learn more about Next.js, take a look at the following resources: + +- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. +- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. + +You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! + +## Deploy on Vercel + +The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. + +Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/app/about/friends/page.tsx b/app/about/friends/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/about/me/page.tsx b/app/about/me/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/about/page.tsx b/app/about/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/about/resume/page.tsx b/app/about/resume/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/about/skills/[slug]/page.tsx b/app/about/skills/[slug]/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/about/skills/page.tsx b/app/about/skills/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/about/work/page.tsx b/app/about/work/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/content.mdx b/app/content.mdx new file mode 100644 index 0000000..ad2fdac --- /dev/null +++ b/app/content.mdx @@ -0,0 +1,21 @@ +# Mikayla Dobson | Software Engineer + +Software design at the confluence of efficiency, ingenuity, and artistry. + +## Why do you want me on your team? + +Here are some things I've provided for my teams in the past: + +- Connecting the dots + - My strength lies in the big picture. My background as a composer of classical music has given me a lasting sense + for how to assemble the pieces of a project into a cohesive whole. + - As a software engineer, this means: + - I'm comfortable living in the world between the front-end and back-end + - I love solving emergent problems as a project's stack is expanding + +--- + +## Want to know more? + +You're in the right place! This site is the best place to learn about the work I've done, what I know, and what I've +done with the knowledge I have. diff --git a/app/favicon.ico b/app/favicon.ico new file mode 100644 index 0000000..718d6fe Binary files /dev/null and b/app/favicon.ico differ diff --git a/app/globals.css b/app/globals.css new file mode 100644 index 0000000..fd81e88 --- /dev/null +++ b/app/globals.css @@ -0,0 +1,27 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; + +:root { + --foreground-rgb: 0, 0, 0; + --background-start-rgb: 214, 219, 220; + --background-end-rgb: 255, 255, 255; +} + +@media (prefers-color-scheme: dark) { + :root { + --foreground-rgb: 255, 255, 255; + --background-start-rgb: 0, 0, 0; + --background-end-rgb: 0, 0, 0; + } +} + +body { + color: rgb(var(--foreground-rgb)); + background: linear-gradient( + to bottom, + transparent, + rgb(var(--background-end-rgb)) + ) + rgb(var(--background-start-rgb)); +} diff --git a/app/layout.tsx b/app/layout.tsx new file mode 100644 index 0000000..f6d39b3 --- /dev/null +++ b/app/layout.tsx @@ -0,0 +1,30 @@ +import Navbar from '@/components/Navbar' +import { MDXProvider } from '@mdx-js/react' +import { Inter } from 'next/font/google' +import './globals.css' + +const inter = Inter({ subsets: ['latin'] }) + +export const metadata = { + title: 'Mikayla Dobson | Software Engineer', + description: 'Integrating artistry and technology to create beautiful software', +} + +export default function RootLayout({ + children, +}: { + children: React.ReactNode +}) { + return ( + + + + <> + + {children} + + + + + ) +} diff --git a/app/music/page.tsx b/app/music/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/music/projects/page.tsx b/app/music/projects/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/music/stream/page.tsx b/app/music/stream/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/music/works/page.tsx b/app/music/works/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/page.tsx b/app/page.tsx new file mode 100644 index 0000000..99539c6 --- /dev/null +++ b/app/page.tsx @@ -0,0 +1,9 @@ +import Content from "./content.mdx" + +export default function Home() { + return ( +
+ +
+ ) +} diff --git a/app/projects/[id]/page.tsx b/app/projects/[id]/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/projects/page.tsx b/app/projects/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/components/Navbar.tsx b/components/Navbar.tsx new file mode 100644 index 0000000..1240fa4 --- /dev/null +++ b/components/Navbar.tsx @@ -0,0 +1,8 @@ +export default function Navbar() { + return ( + + ) +} diff --git a/components/SiteTree.tsx b/components/SiteTree.tsx new file mode 100644 index 0000000..e69de29 diff --git a/components/mdx/index.tsx b/components/mdx/index.tsx new file mode 100644 index 0000000..c3ef96f --- /dev/null +++ b/components/mdx/index.tsx @@ -0,0 +1,5 @@ +import { ReactNode } from "react"; + +export const P1TAG = ({ children }: { children: ReactNode }) => ( +

{children}

+) diff --git a/mdx-components.tsx b/mdx-components.tsx new file mode 100644 index 0000000..77f0053 --- /dev/null +++ b/mdx-components.tsx @@ -0,0 +1,12 @@ +// https://github.com/vercel/next.js/blob/canary/examples/app-dir-mdx/mdx-components.tsx + +import type { MDXComponents } from 'mdx/types' + +// This file is required to use MDX in `app` directory. +export function useMDXComponents(components: MDXComponents): MDXComponents { + return { + // Allows customizing built-in components, e.g. to add styling. + // h1: ({ children }) =>

{children}

, + ...components, + } +} diff --git a/next.config.js b/next.config.js new file mode 100644 index 0000000..e1f35af --- /dev/null +++ b/next.config.js @@ -0,0 +1,26 @@ +// more about configuring mdx +// https://nextjs.org/docs/pages/building-your-application/configuring/mdx + +const withMDX = require('@next/mdx')({ + extension: /\.mdx?$/, + options: { + // If you use remark-gfm, you'll need to use next.config.mjs + // as the package is ESM only + // https://github.com/remarkjs/remark-gfm#install + remarkPlugins: [require("remark-prism")], + rehypePlugins: [], + // If you use `MDXProvider`, uncomment the following line. + // providerImportSource: "@mdx-js/react", + }, +}); + +/** @type {import('next').NextConfig} */ +const nextConfig = { + pageExtensions: ['js', 'jsx', 'ts', 'tsx', 'md', 'mdx'], + reactStrictMode: true, + experimental: { + appDir: true, + } +} + +module.exports = withMDX(nextConfig); diff --git a/package.json b/package.json new file mode 100644 index 0000000..5393650 --- /dev/null +++ b/package.json @@ -0,0 +1,29 @@ +{ + "name": "mikayla-dobson-dev", + "version": "0.1.0", + "private": true, + "scripts": { + "dev": "next dev", + "build": "next build", + "start": "next start", + "lint": "next lint" + }, + "dependencies": { + "@mdx-js/loader": "^2.3.0", + "@mdx-js/react": "^2.3.0", + "@next/mdx": "^13.4.4", + "@types/node": "20.2.5", + "@types/react": "18.2.7", + "@types/react-dom": "18.2.4", + "autoprefixer": "10.4.14", + "eslint": "8.41.0", + "eslint-config-next": "13.4.4", + "next": "13.4.4", + "postcss": "8.4.24", + "react": "18.2.0", + "react-dom": "18.2.0", + "remark-prism": "^1.3.6", + "tailwindcss": "3.3.2", + "typescript": "5.0.4" + } +} diff --git a/postcss.config.js b/postcss.config.js new file mode 100644 index 0000000..33ad091 --- /dev/null +++ b/postcss.config.js @@ -0,0 +1,6 @@ +module.exports = { + plugins: { + tailwindcss: {}, + autoprefixer: {}, + }, +} diff --git a/previous/README.md b/previous/README.md deleted file mode 100644 index 39ddc34..0000000 --- a/previous/README.md +++ /dev/null @@ -1,5 +0,0 @@ -# Mikayla Dobson, Web Developer, Software Engineer, Musician - -Thanks for checking out my portfolio site! This repo has been migrated over from an [older version](https://github.com/innocuous-symmetry/about-mikayla) which is no longer being maintained. This version will stay up to date with my latest projects and experience! - -Created using React, Sass, Material UI, and Vite. Hosted with Github pages. \ No newline at end of file diff --git a/previous/index.html b/previous/index.html deleted file mode 100644 index bc48649..0000000 --- a/previous/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - - - - - - Mikayla Dobson | Developer - - -
- - - diff --git a/previous/package.json b/previous/package.json deleted file mode 100644 index 78ad9b7..0000000 --- a/previous/package.json +++ /dev/null @@ -1,27 +0,0 @@ -{ - "name": "about-mikayla-0722", - "private": true, - "version": "0.0.0", - "scripts": { - "dev": "vite", - "build": "vite build", - "preview": "vite preview" - }, - "dependencies": { - "@emotion/react": "^11.9.3", - "@emotion/styled": "^11.9.3", - "@mui/icons-material": "^5.8.4", - "@mui/material": "^5.8.7", - "react": "^18.0.0", - "react-dom": "^18.0.0", - "react-router-dom": "^6.3.0", - "sass": "^1.53.0", - "uuid": "^8.3.2" - }, - "devDependencies": { - "@types/react": "^18.0.0", - "@types/react-dom": "^18.0.0", - "@vitejs/plugin-react": "^1.3.0", - "vite": "^2.9.9" - } -} diff --git a/previous/src/App.jsx b/previous/src/App.jsx deleted file mode 100644 index 4ca9c12..0000000 --- a/previous/src/App.jsx +++ /dev/null @@ -1,33 +0,0 @@ -import { BrowserRouter, Routes, Route } from 'react-router-dom'; - -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 Navbar from './components/Navbar'; - -import './sass/App.scss'; - -function App() { - return ( -
- - -
- - } /> - } /> - } /> - } /> - } /> - } /> - -
- -
- ); -} - -export default App; diff --git a/previous/src/components/AboutMe/AboutSection.jsx b/previous/src/components/AboutMe/AboutSection.jsx deleted file mode 100644 index 4583a2a..0000000 --- a/previous/src/components/AboutMe/AboutSection.jsx +++ /dev/null @@ -1,15 +0,0 @@ -import { useState } from "react" - -export function AboutSection({ data }) { - const [visible, setVisible] = useState(false); - - return ( -
-
-

{data.title}

- -
- { visible && data.jsx } -
- ) -} \ No newline at end of file diff --git a/previous/src/components/AboutMe/SectionData.jsx b/previous/src/components/AboutMe/SectionData.jsx deleted file mode 100644 index 83942d5..0000000 --- a/previous/src/components/AboutMe/SectionData.jsx +++ /dev/null @@ -1,126 +0,0 @@ -import { Card, Chip } from "@mui/material" -import { v4 } from 'uuid'; - -export const WhatIDo = { - title: "What I Do", - jsx: ( -
- -

Create full stack web applications

-

I have experience building web applications with and without back-end integrations.

-

I am comfortable conceptualizing and organizing complex structures, and as such, my projects tend to be - natural in their structure and easy to maintain.

- - - -

Collaborative software engineering

-

I have consulted on small teams with:

-
-

Dization, a Pittsburgh-based company developing an enterprise resource planning solution for small businesses

-

Metazu Studio, a Nashville-based startup connecting clients with services in video production, AR/VR, social media, photography, and web design.

-
- -

My work on these projects deals with managing the complexities of full-stack web engineering, as well as delivering beautiful user experiences to end customers.

- - - -

Creative minded problem solver

-

- My background as a musician, composer, producer, and artistic - collaborator provide me with a unique frame of reference for solving technical - problems and adapting to dynamic environments. -

- - - -

Database Operations and Management

-

My projects have featured both relational and non-relational databases, in particular - PostgreSQL and MongoDB. I also have experience with various methods of connecting these - to front-end applications.

- -
- ) -} - -export const Education = { - title: "Education", - jsx: ( -
- -

Bachelors of Arts, Music

-

Southern Methodist University, 2014 - 2017

-

Concentrations: Piano Performance, Music Composition, Music Theory

-

Minor: French Language and Culture

- - - -

Self Directed Study, Web Engineering

-

2021 - present

-

Codecademy Pro, Front End Engineer Career Path

-

Concentrations: React, Redux, Express, PostgreSQL

- -
- ) -} - -const MetazuConcepts = [ - "UI/UX design", "Pair Programming", "REST APIs", "Database management", "Consulting with clients" -] - -const DizationConcepts = [ - "Enterprise Resource Planning", "AWS", "System Design", "UI/UX Design", "Database management" -] - -const MusicExperiences = [ - "Avant Chamber Ballet", "Dallas Symphony Orchestra", "Boston University", "National Public Radio" -] - -export const Employment = { - title: "Employment", - jsx: ( -
- -

Full Stack Engineer, intern

-

Dization, Inc | Pittsburgh, PA (remote)
Sept 2022 - present

-

Relevant Duties: contributing to the development of a full-stack enterprise resource planning application built using - the LAMP stack hosted on AWS.

-
- { DizationConcepts.map(each => )} -
- - -

Web Design Consultant

-

Metazu Studio | Nashville, TN
Mar 2022 - present

-

Relevant Duties: collaboration on the design and production of responsive web apps, using skills including:

-
- { MetazuConcepts.map(each => ) } -
- - - -

Singer-Songwriter, Composer

-

- Contract, Independent -
- 2010 - present -

-

- Multi-instrumentalist, singer-songwriter, and producer, well-versed in a number of musical idioms - and music technologies. -

-
- { MusicExperiences.map(each => ) } -
- - - -

Barista, Barista Trainer

-

Starbucks Coffee Co.
2017 - 2021

-

- Relevant Duties: collaboration, problem-solving, streamlined execution of a process, - attention to detail, adhering to standardized safety protocols, observing best practices, training new hires. -

- -
- ) -} \ No newline at end of file diff --git a/previous/src/components/Navbar.jsx b/previous/src/components/Navbar.jsx deleted file mode 100644 index dda4cbd..0000000 --- a/previous/src/components/Navbar.jsx +++ /dev/null @@ -1,95 +0,0 @@ -import { Button, Drawer, List, ListItem } from "@mui/material" -import { useEffect, useState } from "react" -import { useNavigate } from "react-router-dom"; - -import MenuIcon from '@mui/icons-material/Menu'; -import '../sass/Navbar.scss'; -import { v4 } from "uuid"; - -const navOptions = [ - "Home", - "About Me", - "My Projects", - "My Technologies", - "Links", - "Creative Work" -] - -export default function Navbar() { - const [open, setOpen] = useState(false); - const [selected, setSelected] = useState(null); - - const navigate = useNavigate(); - - useEffect(() => { - setOpen(false); - switch (selected) { - case 0: - navigate('/'); - break; - case 1: - navigate('/about-me'); - break; - case 2: - navigate('/projects'); - break; - case 3: - navigate('/technologies'); - break; - case 4: - navigate('/links'); - break; - case 5: - navigate('/creative-works'); - break; - default: - navigate('/'); - break; - } - }, [selected, navigate]); - - return ( -
-
- Mikayla Dobson -

Web Engineer

-
- -
- -
- - setOpen(false)} - open={open} - > - - - - { - navOptions.map(each => { - let idx = navOptions.indexOf(each); - return ( - setSelected(idx)}> - {each} - - ) - }) - } - - - -
- ) -} \ No newline at end of file diff --git a/previous/src/components/ProjectsArray.jsx b/previous/src/components/ProjectsArray.jsx deleted file mode 100644 index cd7caeb..0000000 --- a/previous/src/components/ProjectsArray.jsx +++ /dev/null @@ -1,136 +0,0 @@ -import { Card } from "@mui/material"; -import { v4 } from 'uuid'; - -export const projectsArray = [ - { - name: "Express Spice Shop", - languages: ["TypeScript", "React", "PERN", "REST_API"], - inProgress: true, - jsx: ( - -

Express Spice Shop

-

A sample, fully-featured e-commerce platform

-

Built in React with TypeScript, Node/Express, and PostgreSQL

-

Payment processing supported through Stripe (in progress)

-

API documentation with Swagger

-

IN PROGRESS

- - ) - }, - { - name: "Procedural Drones", - languages: ["JavaScript", "HTML/CSS"], - inProgress: true, - deployed: true, - jsx: ( - -

Procedural Music Generation

-

An experimental space for building out procedural music generation using vanilla JavaScript

-

Uses Tone.js to interact with the Web Audio API

-

Features a plain HTML/CSS front end to interact with the program

-
- GitHub Repo - Deployed version -
- - ) - }, - { - name: "Reddit, but it's all cats", - languages: ["React", "Redux"], - inProgress: false, - deployed: true, - jsx: ( - -

Reddit, but it's all cats

-

A read-only Reddit client -- this site fetches data from Reddit and displays a curated feed.

-

This was built on Reddit's JSON API, using React/Redux and CSS.

-

And yes, it's all cats.

-
- GitHub Repo - Deployed version -
- - ) - }, - { - name: "Personal Timestamp Generator", - languages: ["Python", "SQLite"], - inProgress: false, - jsx: ( - -

Personal Timestamp Generator

-

A small-scale timestamp/productivity management tool for individual use and logging of - time, including compartmentalization by task and some aggregate functions based on queries. -

-

Command-line interface built on Python with a SQLite Database.

- View the repo here! - - ) - }, - { - name: "Password Game", - languages: ["React", "MongoDB", "MERN", "React", "REST_API", "Socket.io", "Sass", "MaterialUI"], - inProgress: true, - jsx: ( - -

Password Game

-

As part of a mentorship program hosted by Metazu Studio

-

Implemented using MongoDB, React, and Node/Express, styled with Material UI/SCSS.

-

In progress, building in collaboration with others at Metazu Studio.

- - ) - }, - { - name: "Splendor Clone", - languages: ["React", "TypeScript"], - inProgress: true, - jsx: ( - -

Splendor -- a clone of the board game by Marc André

-

A clone of a popular card-based resource gathering game

-

Local multiplayer, with plans to build out online multiplayer and solo vs. CPU

-

In progress. Using React, Node/Express, and PostgreSQL.

- - ) - }, - { - name: "Recipin", - languages: ["React", "TypeScript", "PERN"], - inProgress: true, - jsx: ( - -

Recipin -- a home recipe management solution

-

Manage a collection of your own commonly-used recipes

-

Features a full user-auth workflow and enables the sharing of recipes between users

-

Allows the user to build shopping lists from collections of their recipes

-

Built using full end-to-end TypeScript for the React front end and the Express server

- - ) - }, - { - name: "Photosorting with VGG16", - languages: ["Python", "TensorFlow", "PostgreSQL"], - inProgress: true, - jsx: ( - -

Photosorting with VGG16

-

A tool written in Python for sorting photos based on the output of VGG16, the pre-trained image recognition model included with TensorFlow.

-

The user may also integrate the results of their photo sort into a PostgreSQL database.

-

The repository may be found here!

- - ) - }, - { - name: "About Mikayla", - languages: ["React", "Sass", "MaterialUI"], - inProgress: true, - jsx: ( - -

And, last but not least, the site you see here!

-

This site is built using React, Material UI, and SCSS, and is hosted with Netlify.

- View the site repo here! - - ) - } -] \ No newline at end of file diff --git a/previous/src/components/Technologies/MainTopic.jsx b/previous/src/components/Technologies/MainTopic.jsx deleted file mode 100644 index bc0ebb3..0000000 --- a/previous/src/components/Technologies/MainTopic.jsx +++ /dev/null @@ -1,26 +0,0 @@ -import { useState } from "react"; -import { SubTopic } from "./SubTopic"; -import { Card, Chip } from "@mui/material"; -import { v4 } from "uuid"; - -export function MainTopic({ name, subtopics }) { - const [collapsed, setCollapsed] = useState(true); - - return ( - -

{name}

-
- { - collapsed || subtopics.map(inner => { - return ( - inner.subtopics ? - - : - ) - }) - } -
- - - ) -} \ No newline at end of file diff --git a/previous/src/components/Technologies/SubTopic.jsx b/previous/src/components/Technologies/SubTopic.jsx deleted file mode 100644 index f73df74..0000000 --- a/previous/src/components/Technologies/SubTopic.jsx +++ /dev/null @@ -1,26 +0,0 @@ -import { Card, Chip } from "@mui/material"; -import { useEffect, useState } from "react"; -import { v4 } from "uuid"; - -export function SubTopic({ data }) { - const [contents, setContents] = useState(); - - useEffect(() => { - setContents(() => { - if (data.subtopics.length) { - return data.subtopics.map(each => ); - } else { - return

In progress!

- } - }) - }, []); - - return ( - - {data.topic} -
- {contents} -
- - ) -} \ No newline at end of file diff --git a/previous/src/components/Technologies/techList.js b/previous/src/components/Technologies/techList.js deleted file mode 100644 index 4e430b6..0000000 --- a/previous/src/components/Technologies/techList.js +++ /dev/null @@ -1,104 +0,0 @@ -export const techList = [ - { - topic: "Programming Languages", - subtopics: [ - { - topic: "JavaScript", - subtopics: [ - "TypeScript", - "React", - "Redux", - "jQuery", - "NodeJS", - "Express", - "ToneJS", - "Jest" - ] - }, - { - topic: "Python", - subtopics: [ - "Pandas", - "Beautiful Soup", - "TensorFlow, Keras", - "Flutter with Flet" - ] - }, - { - topic: "Java", - subtopics: [ - "Spring Boot", - "Swing" - ] - }, - { - topic: "PHP", - subtopics: [] - } - ] - }, - { - topic: "Front End Engineering", - subtopics: [ - { - topic: "React", - subtopics: [ - "Redux", - "React / TypeScript", - "React Native", - "React Testing Library", - "React Router" - ] - }, - { - topic: "Styling", - subtopics: [ - "CSS", - "Sass", - "Bootstrap", - "Material UI", - "Responsive Design", - ] - } - ] - }, - - { - topic: "Back End Engineering", - subtopics: [ - { - topic: "SQL", - subtopics: [ - "PostgreSQL", - "MySQL", - "Apache Web Server", - "MongoDB", - "Supabase" - ] - }, - { - topic: "REST API", - subtopics: [ - "Express.js", - "Express-Session", - "PHP / Apache / MySQL", - "Java / Spring Boot", - "API Documentation with Swagger", - "MVC Architecture" - ] - } - ] - }, - { - topic: "Developer Tools", - subtopics: [ - "Git", - "GitHub", - "Visual Studio Code", - "Vite", - "Netlify", - "Heroku", - "Figma", - ] - } -] diff --git a/previous/src/favicon.svg b/previous/src/favicon.svg deleted file mode 100644 index de4aedd..0000000 --- a/previous/src/favicon.svg +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - - - - - - - - - - diff --git a/previous/src/index.scss b/previous/src/index.scss deleted file mode 100644 index ec2585e..0000000 --- a/previous/src/index.scss +++ /dev/null @@ -1,13 +0,0 @@ -body { - margin: 0; - font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', - 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', - sans-serif; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -code { - font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', - monospace; -} diff --git a/previous/src/main.jsx b/previous/src/main.jsx deleted file mode 100644 index a3171de..0000000 --- a/previous/src/main.jsx +++ /dev/null @@ -1,10 +0,0 @@ -import React from 'react' -import ReactDOM from 'react-dom/client' -import App from './App' -import './index.scss' - -ReactDOM.createRoot(document.getElementById('root')).render( - - - -) diff --git a/previous/src/media/GitHub-Mark-120px-plus.png b/previous/src/media/GitHub-Mark-120px-plus.png deleted file mode 100644 index ea6ff54..0000000 Binary files a/previous/src/media/GitHub-Mark-120px-plus.png and /dev/null differ diff --git a/previous/src/media/LI-In-Bug.png b/previous/src/media/LI-In-Bug.png deleted file mode 100644 index 8bc2d53..0000000 Binary files a/previous/src/media/LI-In-Bug.png and /dev/null differ diff --git a/previous/src/media/bandcamp-button-circle-line-black-128.png b/previous/src/media/bandcamp-button-circle-line-black-128.png deleted file mode 100644 index 16d2022..0000000 Binary files a/previous/src/media/bandcamp-button-circle-line-black-128.png and /dev/null differ diff --git a/previous/src/media/modulars.jpeg b/previous/src/media/modulars.jpeg deleted file mode 100644 index 43b2bde..0000000 Binary files a/previous/src/media/modulars.jpeg and /dev/null differ diff --git a/previous/src/media/paper_score.jpeg b/previous/src/media/paper_score.jpeg deleted file mode 100644 index 246a43f..0000000 Binary files a/previous/src/media/paper_score.jpeg and /dev/null differ diff --git a/previous/src/media/profile.jpeg b/previous/src/media/profile.jpeg deleted file mode 100644 index bfe7d44..0000000 Binary files a/previous/src/media/profile.jpeg and /dev/null differ diff --git a/previous/src/media/soundcloud-icon.png b/previous/src/media/soundcloud-icon.png deleted file mode 100644 index 4871885..0000000 Binary files a/previous/src/media/soundcloud-icon.png and /dev/null differ diff --git a/previous/src/media/with_guitar.png b/previous/src/media/with_guitar.png deleted file mode 100644 index b91b61e..0000000 Binary files a/previous/src/media/with_guitar.png and /dev/null differ diff --git a/previous/src/pages/AboutMe.jsx b/previous/src/pages/AboutMe.jsx deleted file mode 100644 index 20225be..0000000 --- a/previous/src/pages/AboutMe.jsx +++ /dev/null @@ -1,14 +0,0 @@ -import Card from '@mui/material/Card'; -import { AboutSection } from '../components/AboutMe/AboutSection'; -import { WhatIDo, Education, Employment } from '../components/AboutMe/SectionData'; -import '../sass/pages/AboutMe.scss'; - -export default function AboutMe() { - return ( -
- - - -
- ) -} \ No newline at end of file diff --git a/previous/src/pages/CreativeWorks.jsx b/previous/src/pages/CreativeWorks.jsx deleted file mode 100644 index f700708..0000000 --- a/previous/src/pages/CreativeWorks.jsx +++ /dev/null @@ -1,49 +0,0 @@ -import "../sass/pages/CreativeWorks.scss"; -import { Card } from "@mui/material"; - -import modulars from "../media/modulars.jpeg"; -import score from "../media/paper_score.jpeg"; -import bandcamp from "../media/bandcamp-button-circle-line-black-128.png"; -import soundcloud from "../media/soundcloud-icon.png"; - -export default function CreativeWorks() { - return ( -
-

Creative works

- -
- Original handwritten music notation - Patch on a modular synthesizer -
- -
-

I would be remiss not to take the opportunity to speak about how I feel my experience as a musician informs my work as a developer!

-

Working as a musician helped me to develop invaluable skills that provide me with a unique frame of reference in regards to my approach to technical problems.

-

See below some of the relevant applications of my musical experience:

-
- -
-

Modular synthesis, which heavily involves fundamentals of arithmetic and data flow

-

Orchestration; ensuring all instrumental parts are executable and comfortable to play within a given set of parameters

-

Learning to play new instruments, and adapt my pre-existing knowledge to apply to new frames of reference

-

Audio engineering, and the associated practices of learning/using music technology

-

Proper interaction of components within a complex system

-

Managing proportional integrity in musical forms

-
- -
-

If you're interested, you can find some samples of my music at the links below:

-
- - SoundCloud logo - My SoundCloud - - - Bandcamp logo - My Bandcamp - -
-
-
- ) -} \ No newline at end of file diff --git a/previous/src/pages/Links.jsx b/previous/src/pages/Links.jsx deleted file mode 100644 index 701747d..0000000 --- a/previous/src/pages/Links.jsx +++ /dev/null @@ -1,23 +0,0 @@ -import "../sass/pages/Links.scss"; -import Card from '@mui/material/Card'; -import github from "../media/GitHub-Mark-120px-plus.png"; -import linkedin from "../media/LI-In-Bug.png"; - -export default function Links() { - return ( -
-

Check out the links below to get a better look at my work!

- -
- - GitHub logo - Github - - - LinkedIn logo - LinkedIn Profile - -
-
- ) -} \ No newline at end of file diff --git a/previous/src/pages/Projects.jsx b/previous/src/pages/Projects.jsx deleted file mode 100644 index 9ffff91..0000000 --- a/previous/src/pages/Projects.jsx +++ /dev/null @@ -1,113 +0,0 @@ -import { useState, useEffect, useRef } from 'react'; -import { projectsArray } from '../components/ProjectsArray'; -import { Divider } from '@mui/material'; -import '../sass/pages/Projects.scss'; - -export default function Projects() { - const [results, setResults] = useState(); - const [search, setSearch] = useState(null); - const [text, setText] = useState(); - - const searchInput = useRef(); - - useEffect(() => { - let result = new Set(); - - if (!search) { - setResults(projectsArray.map(card => card.jsx)); - return; - } - - if (search && text) { - for (let entry of text) { - for (let field of entry.text) { - if (field.toLowerCase().includes(search)) { - result.add(projectsArray[entry.projectID]); - } - } - } - } - - if (search && result.size == 0) { - setResults( -

No results found for search "{search}"

- ) - } else { - setResults(Array.from(result).map(card => card.jsx)); - } - }, [search]); - - useEffect(() => { - function unpack(element) { - if (typeof element == "string") return element; - - if (typeof element.props.children != "string") { - if (Array.isArray(element.props.children)) { - let composite = ""; - - for (let each of element.props.children) { - composite += unpack(each); - } - - return composite; - } - - return unpack(element.props.children); - } - - return element.props.children; - } - - let projectText = []; - let i = 0; - while (i < projectsArray.length) { - let project = { - projectID: i, - text: [] - } - - let newText; - - for (let each of projectsArray[i].jsx.props.children) { - newText = unpack(each); - project.text.push(newText); - } - - projectText.push(project); - i++; - } - - setText(projectText); - setResults(projectsArray.map(card => card.jsx)); - }, []) - - const handleReset = () => { - setSearch(null); - searchInput.current.value = null; - } - - return ( -
-

Check out these projects from my portfolio!

-

A selection of my projects:

- -
-

Filter by:

-
- setSearch(e.target.value.toLowerCase())} - placeholder="Enter a search term"> - - -
-
- - - -
- {results} -
-
- ) -} \ No newline at end of file diff --git a/previous/src/pages/Technologies.jsx b/previous/src/pages/Technologies.jsx deleted file mode 100644 index 766fd35..0000000 --- a/previous/src/pages/Technologies.jsx +++ /dev/null @@ -1,23 +0,0 @@ -import '../sass/pages/Technologies.scss'; -import { MainTopic } from '../components/Technologies/MainTopic'; -import { techList } from '../components/Technologies/techList'; -import { v4 } from 'uuid'; - -export default function Technologies() { - return ( -
-

These are some of my most frequently used skills and technologies:

-
- {techList.map(item => { - return ( - - ); - })} -
-
- ) -} \ No newline at end of file diff --git a/previous/src/pages/Welcome.jsx b/previous/src/pages/Welcome.jsx deleted file mode 100644 index 8087810..0000000 --- a/previous/src/pages/Welcome.jsx +++ /dev/null @@ -1,35 +0,0 @@ -import { Avatar, Card, Divider } from '@mui/material'; -import profile from '../media/profile.jpeg'; -import '../sass/pages/Welcome.scss'; - -export default function Welcome() { - return ( -
- - -

Hi, my name is Mikayla Dobson!

-

Thanks for taking the time to learn more about me!

- - - - - -

- I am a software engineer based in Nashville, Tennessee. I build performant - web applications, seek out simple solutions to complex problems, and emphasize - elegance of design. -

-

- Some of my most frequently used technologies include React, Redux, Node.js, - Express, TypeScript, Vite, PostgreSQL, MongoDB, and Sass, among others. -

- - - - -
-

© Mikayla Dobson 2022

-
-
- ); -} \ No newline at end of file diff --git a/previous/src/sass/App.scss b/previous/src/sass/App.scss deleted file mode 100644 index 029122c..0000000 --- a/previous/src/sass/App.scss +++ /dev/null @@ -1,30 +0,0 @@ -@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap'); -@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap'); - -@import "helper/queries"; -@import "helper/variables"; -@import "components/Page"; - -.App { - .mobile-show { - display: none; - } - - button { - border: transparent; - border-radius: 6px; - } - - main { - text-align: center; - position: relative; - top: 4.5rem; - - .page { - @extend %page; - } - } - - @extend %tablet-queries; - @extend %mobile-queries; -} \ No newline at end of file diff --git a/previous/src/sass/Navbar.scss b/previous/src/sass/Navbar.scss deleted file mode 100644 index d362438..0000000 --- a/previous/src/sass/Navbar.scss +++ /dev/null @@ -1,83 +0,0 @@ -@import "helper/variables"; -@import "components/Button"; - -.app-navbar { - display: flex; - position: fixed; - top: 0; - - background-color: $darkGreen; - color: $indigoWhite; - font-family: 'Open Sans', sans-serif; - border-bottom: 1px solid black; - - width: 100vw; - height: 4.5rem; - z-index: 9; - - button { - @extend %button-style; - color: $indigoWhite; - border-color: transparent; - border-radius: 0; - position: absolute; - right: 0; - height: 100%; - &:hover { - background-color: $mintGreen; - } - } - - .navbar-left { - display: flex; - flex-direction: row; - width: 75%; - justify-content: flex-start; - align-items: baseline; - } - - .navbar-right { - display: flex; - flex-direction: row; - justify-content: flex-end; - padding-right: 1rem; - width: 25%; - } - - // top right corner, Mikayla Dobson text - a { - transition: color 150ms ease; - font-weight: 900; - font-size: 2rem; - padding-left: 1rem; - border-right: 1px solid black; - padding-right: 1rem; - text-decoration: none; - &:visited { - color: inherit; - } - &:hover { - color: $mintGreen; - transition: color 150ms ease; - } - } - h2 { - font-weight: 400; - position: relative; - padding-left: 1rem; - } - - // styles for open sidebar - .drawer { - .MuiButtonBase-root { - background-color: red; - } - .drawer-list { - height: 100vh; - background-color: red; - } - .drawer-list-item { - background-color: orange; - } - } -} \ No newline at end of file diff --git a/previous/src/sass/components/_Button.scss b/previous/src/sass/components/_Button.scss deleted file mode 100644 index 3b484ed..0000000 --- a/previous/src/sass/components/_Button.scss +++ /dev/null @@ -1,15 +0,0 @@ -@import "../helper/variables"; - -%button-style { - border: transparent; - background-color: inherit; - color: $indigoOne; - padding: 10px 1rem; - &:hover { - background-color: $lightIndigo; - color: $indigoOne; - } - &:active { - background-color: $indigoWhite; - } -} \ No newline at end of file diff --git a/previous/src/sass/components/_Divider.scss b/previous/src/sass/components/_Divider.scss deleted file mode 100644 index 2e42e49..0000000 --- a/previous/src/sass/components/_Divider.scss +++ /dev/null @@ -1,5 +0,0 @@ -%divider { - width: 80%; - color: #000; - border-width: 2px; -} \ No newline at end of file diff --git a/previous/src/sass/components/_FadeAll.scss b/previous/src/sass/components/_FadeAll.scss deleted file mode 100644 index afa0053..0000000 --- a/previous/src/sass/components/_FadeAll.scss +++ /dev/null @@ -1,5 +0,0 @@ -@import "../helper/animations"; - -%fadeAll { - animation: 0.5s fade-in 0.6s linear forwards; -} \ No newline at end of file diff --git a/previous/src/sass/components/_Page.scss b/previous/src/sass/components/_Page.scss deleted file mode 100644 index deedc17..0000000 --- a/previous/src/sass/components/_Page.scss +++ /dev/null @@ -1,11 +0,0 @@ -@import "../helper/variables"; -@import "../components/FadeAll"; - -%page { - display: flex; - flex-direction: column; - align-items: center; - min-height: 100vh; - width: 100vw; - background-color: #fff; -} \ No newline at end of file diff --git a/previous/src/sass/helper/_animations.scss b/previous/src/sass/helper/_animations.scss deleted file mode 100644 index cd9cff0..0000000 --- a/previous/src/sass/helper/_animations.scss +++ /dev/null @@ -1,8 +0,0 @@ -@keyframes fade-in { - from { - opacity: 0; - } - 100% { - opacity: 1; - } -} \ No newline at end of file diff --git a/previous/src/sass/helper/_mixins.scss b/previous/src/sass/helper/_mixins.scss deleted file mode 100644 index a82b7d7..0000000 --- a/previous/src/sass/helper/_mixins.scss +++ /dev/null @@ -1,9 +0,0 @@ -@import "../helper/animations"; - -@mixin step-entry($len) { - @for $i from 1 through $len { - &:nth-child(#{$i}) { - animation: 0.5s fade-in #{$i * 0.6 - 0.6}s linear forwards; - } - } -} \ No newline at end of file diff --git a/previous/src/sass/helper/_queries.scss b/previous/src/sass/helper/_queries.scss deleted file mode 100644 index 65bb31c..0000000 --- a/previous/src/sass/helper/_queries.scss +++ /dev/null @@ -1,236 +0,0 @@ -@import "./mixins"; -@import "./variables"; - -%tablet-queries { - @media only screen and (max-width: 1050px) { - .welcome-page { - #header-card { - padding: 0.7rem; - h3 { - font-size: 1.2rem; - } - h4 { - font-size: 1rem; - } - } - } - - .about-me-page { - height: auto; - .about-me-section { - h1 { - font-size: 2.25rem; - } - button { - padding: 8px; - } - } - .about-gallery { - margin-top: 0; - width: 90vw; - height: 100%; - flex-flow: column nowrap; - align-items: center; - .MuiPaper-root { - width: 55%; - height: auto; - overflow-y: scroll; - } - } - } - - .projects-page { - .filter-panel { - margin-bottom: 2rem; - width: 65%; - } - } - - .technologies-page { - .main-topic { - width: 70vw; - } - } - - .creative-works-page { - > * { - width: 100%; - } - - .cw-gallery img { - max-width: 45%; - } - - .cw-information, .cw-experiences { - width: 90%; - } - - .cw-examples { - .examples-left { - width: 40vw; - } - .examples-right { - margin-right: 1rem; - h2 { - padding: 1rem; - } - width: 50vw; - } - } - } - } -} - -%mobile-queries { - @media only screen and (max-width: 600px) { - // universal tags for handling mobile-sensitive elements - .mobile-hide { - display: none; - } - - .app-navbar { - .navbar-left { - width: 80vw; - align-items: center; - .my-name { - border-right: none; - } - } - .navbar-right { - width: 20vw; - align-items: center; - button { - padding: 0; - height: auto; - } - } - a, h2 { - color: inherit; - font-weight: 600; - font-size: 1.25rem; - } - } - - .welcome-page { - #header-card { - animation: none; - width: 75vw; - } - #welcome-info { - animation: none; - } - } - - .about-me-page { - .about-me-section { - .am-section-mini { - background-color: $darkLilac; - position: sticky; - top: 4.5rem; - width: 88vw; - z-index: 8; - - h1 { - font-size: 1.35rem; - } - button { - padding: 4px; - height: 1.5rem; - } - } - .about-gallery { - .MuiPaper-root { - width: 85%; - height: auto; - margin-bottom: 12px; - .card-title { - font-size: 1.2rem; - } - h3 { - font-size: 1rem; - } - } - } - } - } - - .projects-page { - .mobile-show { - display: block; - font-size: 1.35rem; - } - .filter-panel { - position: sticky; - top: 5.5rem; - height: 4rem; - margin: 1.5rem; - h2 { - margin-top: 0; - font-size: 1.15rem; - } - .filter-controls input, button { - margin: 0 8px; - border-radius: 8px; - } - } - - .project-cards { - margin-top: 1.5rem; - .MuiPaper-root { - padding: 8px; - h1 { - font-size: 1.5rem; - } - } - } - } - - .technologies-page { - .tech-title { - width: 95vw; - } - .main-topic { - width: 85vw; - - h1 { - font-size: 1.2rem; - } - button { - padding: 6px; - } - } - } - - .links-page { - margin-top: 1rem; - - a { - text-decoration: none; - } - - h1 { - font-size: 1.35rem; - width: 85%; - margin-top: 1rem; - } - justify-content: flex-start; - height: 20rem; - } - - .creative-works-page { - .cw-gallery { - flex-flow: column nowrap; - img { - max-width: 65%; - margin: 1rem 0; - } - } - - .cw-information { - width: 95vw; - margin: 0; - text-align: left; - } - } - } -} diff --git a/previous/src/sass/helper/_variables.scss b/previous/src/sass/helper/_variables.scss deleted file mode 100644 index cd49bd6..0000000 --- a/previous/src/sass/helper/_variables.scss +++ /dev/null @@ -1,12 +0,0 @@ -$indigoOne: #301755; -$indigoWhite: #e8eaf6; -$lightIndigo: #8191ec; - -$lilac: #e2e0fe; -$lilacWhite: #eae4f4; -$darkLilac: #caa5dd; - -$darkBlueGreen: #1a6f6d; - -$darkGreen: #264935; -$mintGreen: #bef9ca; \ No newline at end of file diff --git a/previous/src/sass/pages/AboutMe.scss b/previous/src/sass/pages/AboutMe.scss deleted file mode 100644 index 79c762e..0000000 --- a/previous/src/sass/pages/AboutMe.scss +++ /dev/null @@ -1,102 +0,0 @@ -@import "../helper/variables"; -@import "../helper/mixins"; - -.about-me-page { - .about-me-section { - display: flex; - flex-flow: column nowrap; - align-items: center; - - background-color: $darkLilac; - border: 1px solid $indigoOne; - border-radius: 12px; - margin: 1rem; - padding: 8px 2rem; - width: 75vw; - - border: transparent; - - opacity: 0; - transition: 0.5s transform ease; - - @include step-entry(4); - - .am-section-mini { - display: inline-flex; - flex-flow: row wrap; - align-items: center; - justify-content: space-between; - width: 100%; - - h1 { - font-size: 2.5rem; - } - - > * { - margin: 8px; - } - - button { - display: inline-flex; - align-items: center; - height: 2rem; - padding: 1rem; - } - } - .about-gallery { - display: flex; - flex-flow: row wrap; - height: auto; - width: 95%; - justify-content: space-around; - margin: 2rem; - - .MuiCard-root { - .card-title { - text-transform: uppercase; - } - - display: flex; - flex-direction: column; - background-color: $indigoOne; - color: $indigoWhite; - text-align: center; - align-items: center; - - opacity: 0; - transition: 0.5s transform ease; - - width: 40%; - height: 400px; - border-radius: 12px; - - padding: 1rem; - margin: 0.5rem; - margin-bottom: 3rem; - - overflow-y: scroll; - @include step-entry(4); - - .MuiChip-root { - background-color: $indigoWhite; - max-width: 75%; - margin: 4px; - } - } - } - } - h1 { - color: $indigoOne; - font-weight: 800; - font-size: 4rem; - } - a { - color: white; - border-radius: 12px; - transition: color 0.3s linear; - &:hover { - color: white; - transition: color 0.3s linear; - } - } -} \ No newline at end of file diff --git a/previous/src/sass/pages/CreativeWorks.scss b/previous/src/sass/pages/CreativeWorks.scss deleted file mode 100644 index 0063664..0000000 --- a/previous/src/sass/pages/CreativeWorks.scss +++ /dev/null @@ -1,88 +0,0 @@ -@import "../helper/variables"; - -.creative-works-page { - display: flex; - flex-direction: column; - - section { - margin-bottom: 3rem; - p { - display: inline-block; - background-color: white; - margin: 4px 8px; - padding: 1rem; - border-radius: 12px; - list-style: none; - } - h2 { - font-size: 1.2rem; - } - } - - .cw-gallery { - display: flex; - align-items: center; - justify-content: center; - width: 100%; - height: 30rem; - margin-bottom: 3rem; - img { - display: inline; - height: 90%; - width: auto; - object-fit: cover; - margin: 0 1rem; - } - } - - .cw-information { - display: flex; - flex-flow: row wrap; - justify-content: flex-end; - text-align: right; - margin: 0 2rem 3rem 0; - p { - background-color: rgb(200, 219, 225); - } - } - - .cw-experiences { - display: flex; - flex-flow: row wrap; - text-align: left; - p { - background-color: $indigoWhite; - } - } - - .cw-examples { - display: flex; - min-width: 100%; - flex-flow: column nowrap; - align-items: center; - .sources { - display: inline-flex; - flex-flow: row nowrap; - justify-content: space-evenly; - width: 100%; - > * { - display: inline-flex; - flex-flow: column nowrap; - width: 35%; - height: 15rem; - align-items: center; - justify-content: space-evenly; - background-color: $indigoWhite; - margin-top: 1rem; - img { - width: 100px; - height: 100px; - margin-bottom: 1rem; - } - a { - color: $indigoOne; - } - } - } - } -} \ No newline at end of file diff --git a/previous/src/sass/pages/Links.scss b/previous/src/sass/pages/Links.scss deleted file mode 100644 index 5a62837..0000000 --- a/previous/src/sass/pages/Links.scss +++ /dev/null @@ -1,53 +0,0 @@ -@import "../helper/variables"; -@import "../helper/mixins"; - -.links-page { - background-color: $lilac; - justify-content: center; - - .links-container { - display: flex; - flex-flow: row wrap; - - .MuiCard-root { - @include step-entry(2); - - opacity: 0; - transition: 0.5s transform ease; - - display: inline-flex; - flex-direction: column; - align-items: center; - justify-content: space-between; - - height: 8rem; - width: 20vw; - - padding: 2rem; - margin: 1rem; - - background-color: $lilacWhite; - - a { - color: $indigoOne; - text-transform: uppercase; - text-underline-offset: 5px; - - &:hover { - color: $darkGreen; - } - &:active { - color: $indigoOne; - } - &:visited { - color: inherit; - } - } - - img { - width: 4rem; - height: auto; - } - } - } -} \ No newline at end of file diff --git a/previous/src/sass/pages/Projects.scss b/previous/src/sass/pages/Projects.scss deleted file mode 100644 index b767aad..0000000 --- a/previous/src/sass/pages/Projects.scss +++ /dev/null @@ -1,72 +0,0 @@ -@import "../components/Divider"; -@import "../helper/variables"; - -.projects-page { - .divider { - @extend %divider; - } - - .filter-panel { - display: flex; - position: static; - flex-direction: column; - align-items: center; - - background-color: $darkGreen; - color: $indigoWhite; - - padding: 1rem; - margin-bottom: 2rem; - border-radius: 12px; - - width: 40vw; - - .filter-controls { - display: flex; - justify-content: center; - width: 80%; - > * { - margin: 1rem; - } - input { - padding: 6px; - border-radius: 4px; - } - } - } - - .project-cards { - display: flex; - flex-direction: column; - align-items: center; - margin-top: 2rem; - - a { - color: $indigoWhite; - &:hover { - color: lightblue; - } - } - - > * { - display: flex; - flex-direction: column; - align-items: center; - background-color: $indigoOne; - color: $indigoWhite; - width: 80vw; - height: auto; - margin-bottom: 2rem; - border-radius: 12px; - .links { - display: flex; - width: 75%; - align-items: baseline; - justify-content: space-around; - } - a:last-child { - margin-bottom: 1rem; - } - } - } -} \ No newline at end of file diff --git a/previous/src/sass/pages/Technologies.scss b/previous/src/sass/pages/Technologies.scss deleted file mode 100644 index c9c1989..0000000 --- a/previous/src/sass/pages/Technologies.scss +++ /dev/null @@ -1,65 +0,0 @@ -@import "../helper/variables"; -@import "../helper/animations"; -@import "../helper/mixins"; -@import "../components/Button"; - -.technologies-page { - .tech-title { - font-size: 1.4rem; - font-weight: bold; - } - - .main-topic { - display: flex; - flex-direction: column; - align-items: center; - - opacity: 0; - transition: 0.5s transform ease; - - @include step-entry(4); - - background-color: $indigoOne; - color: $indigoWhite; - - width: 50vw; - border-radius: 16px; - - margin: 1rem 0; - padding: 1rem; - button { - @extend %button-style; - background-color: $indigoWhite; - } - } - - .subtopic-container { - display: flex; - flex-flow: row wrap; - justify-content: center; - - .subtopic-card { - width: 75%; - margin: 1rem; - padding: 1rem; - .subtopics { - display: flex; - flex-flow: row wrap; - justify-content: center; - padding: 1rem; - & > * { - padding: 0.5rem; - margin: 0.5rem; - } - } - &:last-child { - margin-bottom: 2rem; - } - } - - .MuiChip-root { - margin: 5px 4px 1rem; - background-color: $indigoWhite; - } - } -} \ No newline at end of file diff --git a/previous/src/sass/pages/Welcome.scss b/previous/src/sass/pages/Welcome.scss deleted file mode 100644 index 4f5adec..0000000 --- a/previous/src/sass/pages/Welcome.scss +++ /dev/null @@ -1,52 +0,0 @@ -@import "../helper/animations"; -@import "../helper/variables"; -@import "../components/Divider"; - -.welcome-page { - display: flex; - flex-direction: column; - align-items: center; - min-height: 100vh; - overflow-x: hidden; - - #header-card { - display: flex; - flex-direction: column; - align-items: center; - - width: 35vw; - height: 18rem; - - padding: 1rem; - margin: 2rem; - - font-size: 1.2rem; - border-radius: 12px; - background-color: $indigoOne; - color: $lilac; - - // animation: sideToSide 10s infinite; - } - - #welcome-info { - margin: 2rem 0; - width: 75%; - font-size: 1rem; - font-weight: 500; - padding: 0.6rem; - // animation: sideToSide 15s infinite; - - background-color: $indigoOne; - color: $lilac; - } - - .divider { - @extend %divider; - } - - footer { - width: 80%; - display: block; - text-align: right; - } -} diff --git a/previous/vite.config.js b/previous/vite.config.js deleted file mode 100644 index b1b5f91..0000000 --- a/previous/vite.config.js +++ /dev/null @@ -1,7 +0,0 @@ -import { defineConfig } from 'vite' -import react from '@vitejs/plugin-react' - -// https://vitejs.dev/config/ -export default defineConfig({ - plugins: [react()] -}) diff --git a/public/next.svg b/public/next.svg new file mode 100644 index 0000000..5174b28 --- /dev/null +++ b/public/next.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/vercel.svg b/public/vercel.svg new file mode 100644 index 0000000..d2f8422 --- /dev/null +++ b/public/vercel.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/tailwind.config.js b/tailwind.config.js new file mode 100644 index 0000000..8c4d1b2 --- /dev/null +++ b/tailwind.config.js @@ -0,0 +1,18 @@ +/** @type {import('tailwindcss').Config} */ +module.exports = { + content: [ + './pages/**/*.{js,ts,jsx,tsx,mdx}', + './components/**/*.{js,ts,jsx,tsx,mdx}', + './app/**/*.{js,ts,jsx,tsx,mdx}', + ], + theme: { + extend: { + backgroundImage: { + 'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))', + 'gradient-conic': + 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))', + }, + }, + }, + plugins: [], +} diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..e06a445 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,28 @@ +{ + "compilerOptions": { + "target": "es5", + "lib": ["dom", "dom.iterable", "esnext"], + "allowJs": true, + "skipLibCheck": true, + "strict": true, + "forceConsistentCasingInFileNames": true, + "noEmit": true, + "esModuleInterop": true, + "module": "esnext", + "moduleResolution": "node", + "resolveJsonModule": true, + "isolatedModules": true, + "jsx": "preserve", + "incremental": true, + "plugins": [ + { + "name": "next" + } + ], + "paths": { + "@/*": ["./*"] + } + }, + "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"], + "exclude": ["node_modules"] +}