https://github.com/ahmedsomaa/portfolio

My personal portfolio built with Next.js 15 & contentlayer ✨
https://github.com/ahmedsomaa/portfolio

contentlayer lucide-react mdx nextjs15 shacnui shiki-highlighter tailwindcss

Last synced: 14 days ago
JSON representation

My personal portfolio built with Next.js 15 & contentlayer ✨

• Host: GitHub
• URL: https://github.com/ahmedsomaa/portfolio
• Owner: ahmedsomaa
• Created: 2024-11-21T18:09:59.000Z (about 1 month ago)
• Default Branch: main
• Last Pushed: 2024-12-08T15:53:16.000Z (14 days ago)
• Last Synced: 2024-12-08T16:30:46.356Z (14 days ago)
• Topics: contentlayer, lucide-react, mdx, nextjs15, shacnui, shiki-highlighter, tailwindcss
• Language: MDX
• Homepage: https://som3aware.vercel.app
• Size: 4.74 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Portfolio ✨

My personal portfolio built with Next.js 15 & contentlayer.

## Built With

- [Next.js](https://nextjs.org/) for bootstrapping the project.

- [Contentlayer](https://contentlayer.dev/) for content management.

- [Tailwindcss](https://tailwindcss.com/) for styling.

- [Shiki](https://shiki.style/) for syntax highlighting.

- [Lucide React](https://lucide.dev/) for icons.

- [Shadcn/ui](https://ui.shadcn.com/) for components.

- [Enhanced version of shadcn-button component](https://enhanced-button.vercel.app/) for better shadcn buttons.

- [Origin UI](https://originui.com/) for extended shadcn components.

- [Deployment](https://vercel.com/) for deployment.

## Running Locally

```sh

git clone https://github.com/ahmedsomaa/portfolio

cd portfolio

bun install

bun run content:build && bun run dev

```

## How to use

### Fonts

I use 4 font variables. Change them to your own styles in `app/layer.tsx`.

- `font-logo` for the website's logo.

- `font-display` for the landing page headline.

- `font-sans` for the website's body.

- `font-mono` for code blocks.

### Content

Replace my content under the `/content` directory with yours. This includes:

- Navigation items.

- Social links.

- Projects.

- Education & Experience.

### Blog Posts

I use contentlayer alongside mdx. Delete the files under `/posts`, and add your own.

### Syntax Highlighting

I made a custom cod block component `/components/code-block.tsx` using shiki. Change your

light & dark themes there.