Skip to content

Commit 1796ba7

Browse files
abkaaarcursoragent
abkaaar
and
cursoragent
committed
Migrate portfolio to Astro with Notion CMS and GitHub Pages.
Build static pages from Notion at deploy time, seed projects via script, and keep the existing visual design. Co-authored-by: Cursor <cursoragent@cursor.com>
1 parent 7dc9396 commit 1796ba7

66 files changed

Lines changed: 7505 additions & 482 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.env.example‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
NOTION_TOKEN=secret_xxxxxxxx
2+
NOTION_PROJECTS_DB_ID=
3+
NOTION_BLOGS_DB_ID=
4+
NOTION_BOOKS_DB_ID=

‎.github/workflows/deploy.yml‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
name: Deploy to GitHub Pages
2+
3+
on:
4+
push:
5+
branches: [main]
6+
workflow_dispatch:
7+
8+
permissions:
9+
contents: read
10+
pages: write
11+
id-token: write
12+
13+
concurrency:
14+
group: pages
15+
cancel-in-progress: true
16+
17+
jobs:
18+
build:
19+
runs-on: ubuntu-latest
20+
steps:
21+
- name: Checkout
22+
uses: actions/checkout@v4
23+
24+
- name: Setup Node
25+
uses: actions/setup-node@v4
26+
with:
27+
node-version: 22
28+
cache: npm
29+
30+
- name: Install dependencies
31+
run: npm ci
32+
33+
- name: Build
34+
env:
35+
NOTION_TOKEN: ${{ secrets.NOTION_TOKEN }}
36+
NOTION_PROJECTS_DB_ID: ${{ secrets.NOTION_PROJECTS_DB_ID }}
37+
NOTION_BLOGS_DB_ID: ${{ secrets.NOTION_BLOGS_DB_ID }}
38+
NOTION_BOOKS_DB_ID: ${{ secrets.NOTION_BOOKS_DB_ID }}
39+
run: npm run build
40+
41+
- name: Upload Pages artifact
42+
uses: actions/upload-pages-artifact@v3
43+
with:
44+
path: dist
45+
46+
deploy:
47+
needs: build
48+
runs-on: ubuntu-latest
49+
environment:
50+
name: github-pages
51+
url: ${{ steps.deployment.outputs.page_url }}
52+
steps:
53+
- name: Deploy to GitHub Pages
54+
id: deployment
55+
uses: actions/deploy-pages@v4

‎.gitignore‎

Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,5 +2,24 @@
22
logs
33
*.log
44

5-
# fonts
6-
Fonts
5+
# dependencies
6+
node_modules/
7+
8+
# build
9+
dist/
10+
.astro/
11+
12+
# env
13+
.env
14+
.env.local
15+
.env.*.local
16+
17+
# fonts (kept in public/Fonts for Astro; ignore legacy root Fonts if present)
18+
/Fonts
19+
20+
# OS / editor
21+
.DS_Store
22+
Thumbs.db
23+
*.swp
24+
.idea/
25+
.vscode/

‎404.html‎

Lines changed: 0 additions & 37 deletions
This file was deleted.

‎NOTION.md‎

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
# Notion setup
2+
3+
Content for projects, blogs, and books is loaded from Notion at **build time**. The site never calls Notion from the browser.
4+
5+
## 1. Create an integration
6+
7+
1. Open [https://www.notion.so/my-integrations](https://www.notion.so/my-integrations)
8+
2. Create a new internal integration (e.g. `abkaaar-site`)
9+
3. Copy the **Internal Integration Secret** → this is `NOTION_TOKEN`
10+
11+
## 2. Create three databases
12+
13+
Share each database with your integration (**⋯ → Connections → your integration**).
14+
15+
### Projects
16+
17+
| Property | Type | Notes |
18+
|----------|------|--------|
19+
| Name | Title | Required |
20+
| Description | Rich text | Short blurb |
21+
| Tags | Multi-select | Shown as bullet list |
22+
| Site URL | URL | Live project link |
23+
| GitHub URL | URL | Optional (name may be `Github URL`) |
24+
| Image | Files | Or use Image URL |
25+
| Image URL | URL | Optional path/URL (e.g. `Images/foodma.png` for files in `public/`) |
26+
| Featured | Checkbox | Visible by default; unchecked goes under “More Projects” |
27+
| Order | Number | Sort ascending |
28+
| Published | Checkbox | Must be checked to appear |
29+
30+
### Blogs
31+
32+
| Property | Type | Notes |
33+
|----------|------|--------|
34+
| Name | Title | Post title |
35+
| Slug | Rich text | URL segment, e.g. `my-first-post` |
36+
| Summary | Rich text | List teaser |
37+
| Date | Date | Sort / display |
38+
| Cover | Files | Optional |
39+
| Published | Checkbox | Must be checked |
40+
41+
Write the article body as normal Notion page content (headings, paragraphs, lists, images, code, quotes).
42+
43+
### Books
44+
45+
| Property | Type | Notes |
46+
|----------|------|--------|
47+
| Name | Title | Book title |
48+
| Author | Rich text | |
49+
| Status | Select | `Reading` / `Finished` / `Want to read` |
50+
| Cover | Files | Optional |
51+
| Notes | Rich text | Optional |
52+
| Order | Number | Sort ascending |
53+
| Published | Checkbox | Must be checked |
54+
55+
## 3. Database IDs
56+
57+
Open each database as a full page. The ID is the 32-character hex in the URL (with or without hyphens):
58+
59+
`https://www.notion.so/workspace/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx?v=...`
60+
61+
## 4. Local env
62+
63+
Copy `.env.example` → `.env` and fill in:
64+
65+
```
66+
NOTION_TOKEN=secret_...
67+
NOTION_PROJECTS_DB_ID=...
68+
NOTION_BLOGS_DB_ID=...
69+
NOTION_BOOKS_DB_ID=...
70+
```
71+
72+
Then:
73+
74+
```bash
75+
npm install
76+
npm run dev
77+
```
78+
79+
If env vars are missing, the homepage uses **seed projects** from `src/lib/seed.ts` so the site still builds.
80+
81+
## 5. GitHub Pages secrets
82+
83+
Repo → **Settings → Secrets and variables → Actions**, add the same four names as above.
84+
85+
Repo → **Settings → Pages → Build and deployment → Source: GitHub Actions**.
86+
87+
Push to `main` or run **Deploy to GitHub Pages** via **Actions → workflow_dispatch**.
88+
89+
Site URL: `https://abkaaar.github.io/abkaaar/`
90+
91+
## 6. Seed existing projects
92+
93+
Create one row per project below (or copy from `src/lib/seed.ts`). Set **Published** and **Featured** as noted. For images already in the repo, set **Image URL** to the path (e.g. `Images/foodma.png`).
94+
95+
Or run the one-time seeder (uses `.env` + `data/seed-projects.json`):
96+
97+
```bash
98+
node scripts/seed-notion-projects.mjs
99+
```
100+
101+
That creates/updates all 8 projects with **Published** checked.
102+
103+
| Name | Featured | Order | Site URL | GitHub URL | Image URL |
104+
|------|----------|-------|----------|------------|-----------|
105+
| Foodma | yes | 1 | https://foodma.co/ | | Images/foodma.png |
106+
| Awadoc | yes | 2 | https://awadoc.com/ | | Images/awadoc.png |
107+
| PangeaMedics | yes | 3 | https://pangeamedics.com | | Images/pangeamedics.png |
108+
| Formlr | yes | 4 | https://formlr.onrender.com/ | https://github.com/abkaaar/formlr | Images/formlr.png |
109+
| Scholardex | yes | 5 | https://scholardex.vercel.app | https://github.com/abkaaar/scholardex | Images/scholadex.png |
110+
| Quizines | yes | 6 | https://quizines.vercel.app | https://github.com/abkaaar/Quiz-App | Images/quizines.png |
111+
| Ecommerce | yes | 7 | https://ecommerce-nu-orpin.vercel.app | https://github.com/abkaaar/ecommerce | Images/ecommerce.png |
112+
| AlloSpace | no | 8 | https://www.allospace.co | https://github.com/abkaaar/allospace | Images/allospace.png |
113+
114+
Copy descriptions and Tags from the previous homepage / `src/lib/seed.ts`.
115+
116+
## Workflow after setup
117+
118+
1. Edit Notion (toggle **Published** when ready)
119+
2. Re-run the deploy workflow (or push a commit)
120+
3. GitHub Pages updates

‎README.md‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
# abkaaar
2+
3+
Personal portfolio for Abubakar Abdullahi — Astro site with **Notion** as the CMS and **GitHub Pages** hosting.
4+
5+
## Stack
6+
7+
- [Astro](https://astro.build) (static output)
8+
- Notion API (projects, blogs, books at build time)
9+
- GitHub Actions → GitHub Pages
10+
11+
## Develop
12+
13+
```bash
14+
npm install
15+
cp .env.example .env # add Notion credentials when ready
16+
npm run dev
17+
```
18+
19+
Without Notion env vars, the homepage falls back to seed projects in `src/lib/seed.ts`.
20+
21+
## Build
22+
23+
```bash
24+
npm run build
25+
npm run preview
26+
```
27+
28+
Configured for `https://abkaaar.github.io/abkaaar/` (`base: '/abkaaar'`). For a custom domain later, set `base: '/'` in `astro.config.mjs` and add a `CNAME` in `public/`.
29+
30+
## Notion + deploy
31+
32+
See [NOTION.md](./NOTION.md) for database schema, secrets, seeding projects, and GitHub Pages setup.

‎astro.config.mjs‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { defineConfig } from 'astro/config';
2+
3+
export default defineConfig({
4+
site: 'https://abkaaar.github.io',
5+
base: '/abkaaar/',
6+
output: 'static',
7+
});

‎data/seed-projects.json‎

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
[
2+
{
3+
"name": "Foodma",
4+
"description": "CTO at Foodma: Digital infrastructure for Restaurants & food businesses.",
5+
"tags": ["Restaurant ordering Apps", "Inventory and payment platforms", "Point of sales systems", "Analytics and performance systems"],
6+
"siteUrl": "https://foodma.co/",
7+
"githubUrl": null,
8+
"imageUrl": "Images/foodma.png",
9+
"featured": true,
10+
"order": 1
11+
},
12+
{
13+
"name": "Awadoc",
14+
"description": "Backend engineer at Awadoc: Instant Healthcare via WhatsApp, Powered by AI.",
15+
"tags": ["Quality Assurance", "API Development", "DevOps & Meta services", "API Integrations"],
16+
"siteUrl": "https://awadoc.com/",
17+
"githubUrl": null,
18+
"imageUrl": "Images/awadoc.png",
19+
"featured": true,
20+
"order": 2
21+
},
22+
{
23+
"name": "PangeaMedics",
24+
"description": "Co-founded Pangeamedics, a healthcare platform that connects patients with medical professionals for online consultations and healthcare services.",
25+
"tags": ["Online consultations", "Healthcare services", "Patient management", "Medical professional networking"],
26+
"siteUrl": "https://pangeamedics.com",
27+
"githubUrl": null,
28+
"imageUrl": "Images/pangeamedics.png",
29+
"featured": true,
30+
"order": 3
31+
},
32+
{
33+
"name": "Formlr",
34+
"description": "Formlr is a survey creation tool that lets users create, distribute, and analyze surveys with ease.",
35+
"tags": ["Forms", "Surveys", "Quizs", "Questionaire"],
36+
"siteUrl": "https://formlr.onrender.com/",
37+
"githubUrl": "https://github.com/abkaaar/formlr",
38+
"imageUrl": "Images/formlr.png",
39+
"featured": true,
40+
"order": 4
41+
},
42+
{
43+
"name": "Scholardex",
44+
"description": "Scholaarship managament system that allows users to manage scholarships, applications, and reviews efficiently. It provides a user-friendly interface for students to apply for scholarships and for administrators to review and award them.",
45+
"tags": ["Manage scholarships", "Applications", "Review Scholarships", "Award Scholarships"],
46+
"siteUrl": "https://scholardex.vercel.app",
47+
"githubUrl": "https://github.com/abkaaar/scholardex",
48+
"imageUrl": "Images/scholadex.png",
49+
"featured": true,
50+
"order": 5
51+
},
52+
{
53+
"name": "Quizines",
54+
"description": "Quizines lets you create and host quizzes with different question types, images, videos, and more. You can also import quizzes from other sources, and get instant results.",
55+
"tags": ["Quizs", "Competitions", "Games", "Gradings"],
56+
"siteUrl": "https://quizines.vercel.app",
57+
"githubUrl": "https://github.com/abkaaar/Quiz-App",
58+
"imageUrl": "Images/quizines.png",
59+
"featured": true,
60+
"order": 6
61+
},
62+
{
63+
"name": "Ecommerce",
64+
"description": "Mordern Ecommerce platform that allows customers to buy products seamlessly online. It provides a user-friendly and modern interface for customers to browse and purchase products.",
65+
"tags": ["Product Catalog", "Shopping Cart", "Order Management", "Payment Integration"],
66+
"siteUrl": "https://ecommerce-nu-orpin.vercel.app",
67+
"githubUrl": "https://github.com/abkaaar/ecommerce",
68+
"imageUrl": "Images/ecommerce.png",
69+
"featured": true,
70+
"order": 7
71+
},
72+
{
73+
"name": "AlloSpace",
74+
"description": "AlloSpace is a platform designed to help space managers seamlessly manage bookings, promote their venues, and connect with individuals or businesses looking for workspaces, meeting rooms, or event spaces. With user-friendly tools and insightful analytics, AlloSpaces empowers you to focus on what matters most — providing exceptional experiences for your clients.",
75+
"tags": ["Workspace", "Office Space", "Reservation", "Flexibility"],
76+
"siteUrl": "https://www.allospace.co",
77+
"githubUrl": "https://github.com/abkaaar/allospace",
78+
"imageUrl": "Images/allospace.png",
79+
"featured": false,
80+
"order": 8
81+
}
82+
]

0 commit comments

Comments
 (0)