From 16f92f90d622d7cf38c44d52f3b7e9c07108a927 Mon Sep 17 00:00:00 2001 From: Cayden Schwechten <4884755-caydens@users.noreply.gitlab.com> Date: Wed, 5 Aug 2026 10:16:44 -0500 Subject: [PATCH] Junie readme gen --- README.md | 84 ++++++++++++++++++++++++++++++++++++++++++------------- 1 file changed, 64 insertions(+), 20 deletions(-) diff --git a/README.md b/README.md index e215bc4..ce6c4cf 100644 --- a/README.md +++ b/README.md @@ -1,36 +1,80 @@ -This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app). +# Cayden's Website -## Getting Started +A professional portfolio and markdown-powered blog built with **Next.js 16**, **React 19**, **TypeScript**, and **Tailwind CSS 4**. -First, run the development server: +This site serves as a digital portfolio for Cayden, a Web Developer & Focus-Driven Leader, highlighting expertise in Clinical UI/UX, EHR systems, and large-scale logistics. It features a custom Nord-inspired design and a dynamic blog system. + +## 🚀 Features + +- **Modern Tech Stack**: Built with React 19 and Next.js 16 using the App Router. +- **Tailwind CSS 4**: Modern, high-performance styling with the Nord color palette. +- **Markdown Blog**: Fully dynamic blog system powered by `remark` and `gray-matter`. +- **Responsive Design**: Elegant mobile-first navigation and layout. +- **Optimized Typography**: Custom Google Fonts (Cormorant Garamond & Poppins) via `next/font`. +- **Type-Safe**: Full TypeScript implementation for robust development. + +## 🛠️ Tech Stack + +- **Framework**: [Next.js 16](https://nextjs.org/) (App Router) +- **Library**: [React 19](https://react.dev/) +- **Styling**: [Tailwind CSS 4](https://tailwindcss.com/) +- **Language**: [TypeScript](https://www.typescriptlang.org/) +- **Content**: Markdown with [Remark](https://github.com/remarkjs/remark) & [Gray-matter](https://github.com/jonschlinkert/gray-matter) +- **Icons**: [Heroicons](https://heroicons.com/) +- **Date Handling**: [Moment.js](https://momentjs.com/) + +## 📂 Project Structure + +```text +├── app/ # Next.js App Router (pages, layouts, globals) +│ ├── blog/ # Blog listing and dynamic article pages +│ ├── contact/ # Contact page +│ └── layout.tsx # Root layout with fonts and navigation +├── articles/ # Markdown content for blog posts +├── components/ # Reusable UI and Layout components +│ ├── layout/ # Header, Footer, etc. +│ └── ui/ # Generic UI elements +├── lib/ # Utility functions and data fetching (markdown parser) +├── public/ # Static assets (images, icons) +├── types/ # TypeScript interface definitions +└── package.json # Dependencies and scripts +``` + +## 🏁 Getting Started + +First, install the dependencies: + +```bash +npm install +# or +bun install +``` + +Then, run the development server: ```bash npm run dev # or -yarn dev -# or -pnpm dev -# or bun 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. +## 📝 Writing Articles -This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel. +To add a new blog post, create a `.md` file in the `/articles` directory with the following frontmatter: -## Learn More +```markdown +--- +title: "Your Title" +date: "YYYY-MM-DD" +category: "Category Name" +description: "Brief summary of the article" +--- -To learn more about Next.js, take a look at the following resources: +Your content here... +``` -- [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. +## 📜 License -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/app/building-your-application/deploying) for more details. +This project is private and intended for portfolio demonstration.