init build
This commit is contained in:
parent
cb0c819932
commit
0268734336
10 changed files with 115 additions and 31 deletions
1
.idea/inspectionProfiles/Project_Default.xml
generated
1
.idea/inspectionProfiles/Project_Default.xml
generated
|
|
@ -1,7 +1,6 @@
|
|||
<component name="InspectionProjectProfileManager">
|
||||
<profile version="1.0">
|
||||
<option name="myName" value="Project Default" />
|
||||
<inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
|
||||
<inspection_tool class="PyPep8NamingInspection" enabled="true" level="WEAK WARNING" enabled_by_default="true">
|
||||
<option name="ignoredErrors">
|
||||
<list>
|
||||
|
|
|
|||
|
|
@ -1,21 +1,21 @@
|
|||
import Link from "next/link"
|
||||
import { ArrowLeftIcon } from "@heroicons/react/24/solid"
|
||||
import { getArticleData } from "@/lib/articles";
|
||||
import {ArrowLeftIcon} from "@heroicons/react/24/solid"
|
||||
import {getArticleData} from "@/lib/articles";
|
||||
|
||||
const Article = async ({ params }: { params: Promise<{ slug: string }> }) => {
|
||||
const { slug } = await params;
|
||||
const Article = async ({params}: { params: Promise<{ slug: string }> }) => {
|
||||
const {slug} = await params;
|
||||
const articleData = await getArticleData(slug);
|
||||
|
||||
return (
|
||||
<section className={"mx-auto w-10/12 md:w-1/2 mt-20 flex flex-col gap-5"}>
|
||||
<div className={"flex justify-between font-poppins"}>
|
||||
<Link href={"/blog"} className={"flex flex-row gap-1 place-items-center"}>
|
||||
<ArrowLeftIcon width={20} />
|
||||
<ArrowLeftIcon width={20}/>
|
||||
<p>blog homepage</p>
|
||||
</Link>
|
||||
<p>{articleData.date.toString()}</p>
|
||||
</div>
|
||||
<article className={"article"} dangerouslySetInnerHTML={{ __html: articleData.contentHtml }} />
|
||||
<article className={"article"} dangerouslySetInnerHTML={{__html: articleData.contentHtml}}/>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ export default function BlogPage() {
|
|||
<>
|
||||
<section className={"mx-auto w-11/12 md:w-1/2 mt-20 flex flex-col gap-16 mb-20"}>
|
||||
<header className={"font-cormorantGaramond font-light text-6xl text-center"}>
|
||||
<h1>Shrimple blog.</h1>
|
||||
<h1 className={'text-nord-14'}>Blog & talks</h1>
|
||||
</header>
|
||||
<section className={"md:grid md:grid-cols-2 flex flex-col gap-10"}>
|
||||
{articles != null && Object.keys(articles).map((article) => (
|
||||
|
|
|
|||
BIN
app/favicon.ico
BIN
app/favicon.ico
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 175 KiB |
|
|
@ -1,3 +1,4 @@
|
|||
import React from "react";
|
||||
import type {Metadata} from "next";
|
||||
import {Cormorant_Garamond, Poppins} from "next/font/google";
|
||||
import "./globals.css";
|
||||
|
|
@ -10,15 +11,15 @@ const cormorantGaramond = Cormorant_Garamond({
|
|||
})
|
||||
|
||||
const poppins = Poppins({
|
||||
subsets: ['latin'],
|
||||
variable: "--font-poppins",
|
||||
weight: ['400', '600']
|
||||
subsets: ['latin'],
|
||||
variable: "--font-poppins",
|
||||
weight: ['400', '600']
|
||||
})
|
||||
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Create Next App",
|
||||
description: "Generated by create next app",
|
||||
title: "sh ~./caydencodes.sh",
|
||||
description: "Come and see what I'm all about.",
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
|
|
@ -31,8 +32,11 @@ export default function RootLayout({
|
|||
lang="en"
|
||||
className={`${cormorantGaramond.variable} ${poppins.variable} bg-neutral-100 h-full antialiased`}
|
||||
>
|
||||
<Header />
|
||||
<body className="min-h-full flex flex-col bg-polar-night-lighter text-snow-storm text-shadow-snow-storm-dark">{children}</body>
|
||||
<body
|
||||
className="min-h-full flex flex-col bg-polar-night-lighter text-snow-storm text-shadow-snow-storm-dark">
|
||||
<Header/>
|
||||
{children}
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
82
app/page.tsx
82
app/page.tsx
|
|
@ -1,14 +1,84 @@
|
|||
import React from "react";
|
||||
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<section className={"mx-auto w-11/12 md:w-1/2 mt-20 flex flex-col gap-16 mb-20 color-nord-9"}>
|
||||
<header className={"font-cormorantGaramond font-light text-6xl text-center"}>
|
||||
<h1>Hello there, world.</h1>
|
||||
<main className="mx-auto mb-20 mt-20 flex w-11/12 max-w-4xl flex-col gap-12 md:w-2/3">
|
||||
<section className="flex flex-col items-center gap-8 text-center font-cormorantGaramond">
|
||||
<img
|
||||
src="/cayden-portrait.png"
|
||||
alt="Portrait of Cayden"
|
||||
className="h-40 w-40 rounded-full object-cover shadow-lg"
|
||||
/>
|
||||
|
||||
<header className="flex flex-col gap-4">
|
||||
<h1 className="text-5xl font-light leading-tight md:text-6xl">
|
||||
Howdy, I'm Cayden.
|
||||
</h1>
|
||||
|
||||
<p className="font-poppins text-2xl font-light leading-tight">
|
||||
JavaScript · TypeScript · Python · Go · React, NextJS
|
||||
</p>
|
||||
</header>
|
||||
</section>
|
||||
</>
|
||||
|
||||
<section className="flex flex-col gap-6 text-lg leading-8 font-cormorantGaramond">
|
||||
<p>
|
||||
Nice to meet you! I am a Web Developer who specializes in architecting robust, user-centric
|
||||
applications, transforming complex logic into seamless digital experiences.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
My work is driven by a commitment to meeting complex demands in specialized medical markets. With a
|
||||
strong focus on ergonomics, UI/UX optimization, and precision within fast-paced clinical
|
||||
environments, I engineer comprehensive EHR solutions—ranging from portable medical cart workstations
|
||||
to pioneering tracking and fleet management systems.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
Beyond the clinical sector, my architectural experience extends to high-concurrency community
|
||||
platforms. I have developed complex state management systems, robust user infrastructure, and
|
||||
comprehensive governance controls. These applications have successfully scaled to support thousands
|
||||
of daily active users, functioning as mission-critical tools for large digital communities.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
Whether developing a new feature, refining an existing product, or adapting to rapid architectural
|
||||
shifts, I am dedicated to creating software that is accessible, modern, and highly functional.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section className="mt-10 rounded-2xl bg-nord-2 p-8 font-cormorantGaramond text-white shadow-md">
|
||||
<h2 className="mb-6 text-2xl font-semibold tracking-wide border-b border-white/20 pb-3">
|
||||
Core Competencies
|
||||
</h2>
|
||||
|
||||
<ul className="grid gap-4 md:grid-cols-2 text-lg">
|
||||
<li className="flex items-center gap-3">
|
||||
<span className="h-2 w-2 rounded-full bg-blue-300 shadow-sm"></span>
|
||||
Next.js & React Ecosystems
|
||||
</li>
|
||||
<li className="flex items-center gap-3">
|
||||
<span className="h-2 w-2 rounded-full bg-blue-300 shadow-sm"></span>
|
||||
TypeScript & Tailwind CSS
|
||||
</li>
|
||||
<li className="flex items-center gap-3">
|
||||
<span className="h-2 w-2 rounded-full bg-blue-300 shadow-sm"></span>
|
||||
EHR & Fleet Management
|
||||
</li>
|
||||
<li className="flex items-center gap-3">
|
||||
<span className="h-2 w-2 rounded-full bg-blue-300 shadow-sm"></span>
|
||||
High-Concurrency Systems
|
||||
</li>
|
||||
<li className="flex items-center gap-3">
|
||||
<span className="h-2 w-2 rounded-full bg-blue-300 shadow-sm"></span>
|
||||
Infrastructure & Automation
|
||||
</li>
|
||||
<li className="flex items-center gap-3">
|
||||
<span className="h-2 w-2 rounded-full bg-blue-300 shadow-sm"></span>
|
||||
Human-Centric Design & Thinking
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
|
@ -8,19 +8,23 @@ date: "29-06-2026"
|
|||
|
||||

|
||||
|
||||
Squirt is a playful and energetic topic that can represent movement, surprise, and a little bit of chaos. Sometimes, the smallest things can make the biggest splash.
|
||||
Squirt is a playful and energetic topic that can represent movement, surprise, and a little bit of chaos. Sometimes, the
|
||||
smallest things can make the biggest splash.
|
||||
|
||||
In everyday life, a squirt might be something simple: a splash of water, a squeeze from a bottle, or a sudden burst of energy. It is quick, unexpected, and often memorable.
|
||||
In everyday life, a squirt might be something simple: a splash of water, a squeeze from a bottle, or a sudden burst of
|
||||
energy. It is quick, unexpected, and often memorable.
|
||||
|
||||
## A Small Burst of Fun
|
||||
|
||||
There is something fun about the word squirt. It feels lighthearted and informal. It does not take itself too seriously, which makes it a great subject for a personal article.
|
||||
There is something fun about the word squirt. It feels lighthearted and informal. It does not take itself too seriously,
|
||||
which makes it a great subject for a personal article.
|
||||
|
||||
Whether it reminds you of summer days, water fights, or tiny moments of surprise, squirt can be a symbol of simple joy.
|
||||
|
||||
## Final Thoughts
|
||||
|
||||
Not every article needs to be serious or complicated. Sometimes, writing about something small and silly is enough to create a moment of fun.
|
||||
Not every article needs to be serious or complicated. Sometimes, writing about something small and silly is enough to
|
||||
create a moment of fun.
|
||||
|
||||
Squirt may be simple, but it still makes a splash.
|
||||
|
||||
|
|
|
|||
|
|
@ -1,19 +1,20 @@
|
|||
import Link from "next/link"
|
||||
import type { ArticleItem} from "@/types";
|
||||
import type {ArticleItem} from "@/types";
|
||||
|
||||
interface Props {
|
||||
category: string,
|
||||
articles: ArticleItem[]
|
||||
}
|
||||
|
||||
const ArticleItemList = ({ category, articles }: Props) => {
|
||||
const ArticleItemList = ({category, articles}: Props) => {
|
||||
return (
|
||||
<>
|
||||
<div className={"flex flex-col gap-5"}>
|
||||
<h2 className={"font-cormorantGaramond text-4xl"}>{category}</h2>
|
||||
<div className={"flex flex-col gap-2.5 font-poppins text-lg"}>
|
||||
{articles.map((article, id) => (
|
||||
<Link href={`/blog/${article.id}`} key={id} className={"hover:text-nord-12 transition duration-250"}>
|
||||
<Link href={`/blog/${article.id}`} key={id}
|
||||
className={"hover:text-nord-12 transition duration-250"}>
|
||||
{article.title}
|
||||
</Link>
|
||||
))}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
'use client'
|
||||
|
||||
import React, { useState } from 'react'
|
||||
import React, {useState} from 'react'
|
||||
import Image from 'next/image'
|
||||
import Link from 'next/link';
|
||||
import Logo from "../../public/borb.png"
|
||||
|
|
@ -21,7 +21,7 @@ const Header = () => {
|
|||
</div>
|
||||
<div className="md:hidden">
|
||||
<button
|
||||
className="p-2 text-gray-700 rounded-md outline-none focus:border-gray-400 focus:border"
|
||||
className="p-3 text-gray-700 rounded-md outline-none focus:border-gray-400 border-2 focus:border bg-nord-10"
|
||||
onClick={() => setNavbar(!navbar)}>
|
||||
{navbar ? (
|
||||
<div className="bar text-white"></div>
|
||||
|
|
@ -47,6 +47,12 @@ const Header = () => {
|
|||
className='sm:px-52 md:px-0'>Blog</Link>
|
||||
</li>
|
||||
|
||||
|
||||
<li className="text-xl text-white py-2 my-2 md:my-0 px-6 text-center md:border-b-0 border-white hover:text-nord-12 transition duration-250">
|
||||
<Link href="https://gitlab.com/caydens" onClick={() => setNavbar(!navbar)}
|
||||
className='sm:px-48 md:px-0'>GitLab</Link>
|
||||
</li>
|
||||
|
||||
<li className="text-xl text-white py-2 my-2 md:my-0 px-6 text-center md:border-b-0 border-white hover:text-nord-12 transition duration-250">
|
||||
<Link href="/contact" onClick={() => setNavbar(!navbar)}
|
||||
className='sm:px-48 md:px-0'>Contact</Link>
|
||||
|
|
|
|||
BIN
public/cayden-portrait.png
Normal file
BIN
public/cayden-portrait.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 232 KiB |
Loading…
Add table
Add a link
Reference in a new issue