Add more projects

This commit is contained in:
Gabriel Brown 2024-09-17 13:21:17 -05:00
parent 3c6cf095db
commit 458486bee9
8 changed files with 257 additions and 10 deletions

View File

@ -3,6 +3,11 @@ import { PFPName } from "~/components/general/pfpname";
import AboutMe from "~/components/general/aboutme";
import TechChart from "~/components/general/techchart";
import TechTracker from "~/components/projects/techtracker";
import Sunhat from "~/components/projects/sunhat";
import WiredWorld from "~/components/projects/wiredworld";
import Fuse from "~/components/projects/fuse";
import LazyPrimeagen from "~/components/projects/lazyprimeagen";
import TenantPortal from "~/components/projects/tenantportal";
//import Image from "next/image";
//import Link from "next/link";
@ -11,14 +16,19 @@ export default function HomePage() {
<main className="min-h-screen">
<div className="flex flex-row items-end justify-end">
<div className="mr-8 mt-6">
<ThemeToggle />
< ThemeToggle />
</div>
</div>
<PFPName />
<AboutMe />
<TechChart />
< PFPName />
< AboutMe />
< TechChart />
<h1 className="text-3xl font-semibold text-center my-8">Projects</h1>
<TechTracker />
< TechTracker />
< Fuse />
< Sunhat />
< TenantPortal />
< WiredWorld />
< LazyPrimeagen />
</main>
);
}

View File

@ -18,6 +18,7 @@ const chartData = [
{ technology: "TypeScript", proficiency: 85 },
{ technology: "Next.js", proficiency: 80 },
{ technology: "React", proficiency: 80 },
{ technology: "SQL", proficiency: 80 },
{ technology: "React Native", proficiency: 75 },
{ technology: "Java", proficiency: 75 },
{ technology: "PHP", proficiency: 70 },
@ -34,7 +35,7 @@ const chartConfig = {
export default function Component() {
return (
<Card className="max-w-xl mx-auto">
<Card className="max-w-2xl mx-auto">
<CardHeader/>
<CardContent>
<ChartContainer config={chartConfig}>
@ -63,7 +64,7 @@ export default function Component() {
type="category"
tickLine={false}
axisLine={false}
width={90}
width={100}
/>
<ChartTooltip
cursor={false}

View File

@ -0,0 +1,49 @@
import {
Accordion,
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "~/components/ui/accordion"
import Link from "next/link";
import { FaGithub } from "react-icons/fa";
export default function Fuse() {
return (
<section className="my-6 flex flex-col items-center justify-center m-auto">
<Accordion type="single" collapsible className="w-1/3">
<AccordionItem value="item-1">
<AccordionTrigger>
<div className="flex flex-row mx-auto">
<h1 className="text-2xl font-semibold text-center mx-auto">
Fuse (React Native, Next.js, & PostgreSQL)
</h1>
<Link href="https://git.gbrown.org/gib/fuse_expo"
className="my-auto"
>
< FaGithub className="my-auto ml-2" size={22} />
</Link>
</div>
</AccordionTrigger>
<AccordionContent>
<div className="flex flex-col">
<p className="indent-4">
Fuse is an Expo Application that served as a way to learn React
Native. This application was made for my girlfriend & I in order to send
each other messages, as well as provide a countdown timer for the next
time we would be together, as we are in a long distance relationship.
This application uses API&apos;s provided by a
<Link href="https://ismadelinethecutest.gibbyb.com"
className="underline hover:text-blue-500"
>
Next.js Web Application I also made for my girlfriend.
</Link>
This Web Application connect to a PostgreSQL
Database & is also self-hosted using a Docker Container.
</p>
</div>
</AccordionContent>
</AccordionItem>
</Accordion>
</section>
);
};

View File

@ -0,0 +1,41 @@
import {
Accordion,
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "~/components/ui/accordion"
import Link from "next/link";
import { FaGithub } from "react-icons/fa";
export default function LazyPrimeagen() {
return (
<section className="my-6 flex flex-col items-center justify-center m-auto">
<Accordion type="single" collapsible className="w-1/3">
<AccordionItem value="item-1">
<AccordionTrigger>
<div className="flex flex-row mx-auto">
<h1 className="text-2xl font-semibold text-center mx-auto">
Lazy Primeagen Neovim Config (Lua)
</h1>
<Link href="https://github.com/gibbyb/Lazy_Primeagen"
className="my-auto"
>
< FaGithub className="my-auto ml-2" size={22} />
</Link>
</div>
</AccordionTrigger>
<AccordionContent>
<div className="flex flex-col items-center justify-center">
<p className="indent-4 items-center justify-center">
Lazy Primeagen is simply ThePrimeagen&apos;s Neovim Config, but with the
deprecated Packer.nvim replaced with Lazy.nvim. This project is meant
to be exactly the same as ThePrimeagen&apos;s Neovim Config, just with Lazy.nvim
instead of Packer.nvim.
</p>
</div>
</AccordionContent>
</AccordionItem>
</Accordion>
</section>
);
};

View File

@ -0,0 +1,41 @@
import {
Accordion,
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "~/components/ui/accordion"
import Link from "next/link";
import { FaGithub } from "react-icons/fa";
export default function Sunhat() {
return (
<section className="my-6 flex flex-col items-center justify-center m-auto">
<Accordion type="single" collapsible className="w-1/3">
<AccordionItem value="item-1">
<AccordionTrigger>
<div className="flex flex-row mx-auto">
<h1 className="text-2xl font-semibold text-center mx-auto">Sunhat (Bash)</h1>
<Link href="https://git.gbrown.org/gib/sunhat"
className="my-auto"
>
< FaGithub className="my-auto ml-2" size={22} />
</Link>
</div>
</AccordionTrigger>
<AccordionContent>
<div className="flex flex-col">
<p className="indent-4">
Sunhat is a fork of DHH&apos;s Omakub, an opinionated Ubuntu setup that
I have contributed to in the past. Sunhat is a complete rewrite as it
supports Fedora rather than Ubuntu. This project serves as my own personal
Fedora setup script, but provides a lot of wisdom to newcomers in the
Fedora / Linux community.
</p>
</div>
</AccordionContent>
</AccordionItem>
</Accordion>
</section>
);
};

View File

@ -13,7 +13,7 @@ export default function TechTracker() {
<Accordion type="single" collapsible className="w-1/3">
<AccordionItem value="item-1">
<AccordionTrigger>
<h1 className="text-2xl font-semibold text-center mx-auto">Tech Tracker</h1>
<h1 className="text-2xl font-semibold text-center mx-auto">Tech Tracker (Next.js, Swift & MySQL)</h1>
</AccordionTrigger>
<AccordionContent>
<div className="flex flex-col">
@ -23,7 +23,9 @@ export default function TechTracker() {
Tech Tracker Web Application
</h2>
</Link>
<Link href="https://git.gbrown.org/gib/Tech_Tracker_Web">
<Link href="https://git.gbrown.org/gib/Tech_Tracker_Web"
className="my-auto"
>
< FaGithub className="my-auto ml-2" size={22} />
</Link>
</div>
@ -46,7 +48,9 @@ export default function TechTracker() {
<h2 className="text-lg font-semibold text-center">
Tech Tracker Native iOS Application
</h2>
<Link href="https://git.gbrown.org/gib/Tech_Tracker_iOS">
<Link href="https://git.gbrown.org/gib/Tech_Tracker_iOS"
className="my-auto"
>
< FaGithub className="my-auto ml-2" size={22} />
</Link>
</div>

View File

@ -0,0 +1,53 @@
import {
Accordion,
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "~/components/ui/accordion"
import Link from "next/link";
import { FaGithub } from "react-icons/fa";
export default function TenantPortal() {
return (
<section className="my-6 flex flex-col items-center justify-center m-auto">
<Accordion type="single" collapsible className="w-1/3">
<AccordionItem value="item-1">
<AccordionTrigger>
<div className="flex flex-row mx-auto">
<h1 className="text-2xl font-semibold text-center mx-auto">
Tenant Portal (Next.js & PostgreSQL)
</h1>
<Link href="https://git.gbrown.org/gib/rent_portal"
className="my-auto"
>
< FaGithub className="my-auto ml-2" size={22} />
</Link>
</div>
</AccordionTrigger>
<AccordionContent>
<div className="flex flex-col items-center justify-center">
<div className="flex flex-row my-4 mx-auto">
<Link href="https://tenantportal.gibbyb.com">
<h2 className="text-lg font-semibold text-center underline hover:text-blue-500">
Tenant Portal Website
</h2>
</Link>
</div>
<p className="indent-4 items-center justify-center">
Tenant Portal is a Next.js Web Application that is a work in progress,
but will serve as an interface for future tenants of the company I rent
from. This application currently is only used by myself & my roommate,
as we continue to beta test the application & as I continue to develop it.
</p>
<p className="indent-4 items-center justify-center">
This web application uses the T3 Stack which includes Next.js, TypeScript,
TailwindCSS, Auth.js, PostgreSQL, Drizzle, & Shadcnui.
</p>
</div>
</AccordionContent>
</AccordionItem>
</Accordion>
</section>
);
};

View File

@ -0,0 +1,48 @@
import {
Accordion,
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "~/components/ui/accordion"
import Link from "next/link";
import { FaGithub } from "react-icons/fa";
export default function WiredWorld() {
return (
<section className="my-6 flex flex-col items-center justify-center m-auto">
<Accordion type="single" collapsible className="w-1/3">
<AccordionItem value="item-1">
<AccordionTrigger>
<div className="flex flex-row mx-auto">
<h1 className="text-2xl font-semibold text-center mx-auto">
Wired World (PHP & MySQL)
</h1>
<Link href="https://github.com/gibbyb/WiredWorld"
className="my-auto"
>
< FaGithub className="my-auto ml-2" size={22} />
</Link>
</div>
</AccordionTrigger>
<AccordionContent>
<div className="flex flex-col">
<div className="flex flex-row my-4 mx-auto">
<Link href="https://wiredworld.gbrown.org">
<h2 className="text-lg font-semibold text-center underline hover:text-blue-500">
Wired World Website
</h2>
</Link>
</div>
<p className="indent-4">
Wired World is a strange project of mine which was made as an assignment
while I was in school for my Database Management class. Wired World is
an online store written entirely from scratch using PHP & MySQL & is
self-hosted using a PHP Docker Container & Caddy as the reverse proxy.
</p>
</div>
</AccordionContent>
</AccordionItem>
</Accordion>
</section>
);
};