The official engineering blog for Miswag, built with Next.js and deployed on GitHub Pages.
- Markdown-based articles (write in Notion, export as Markdown)
- Clean, responsive design with dark mode support
- Article filtering by category and keyword search
- Team member profiles with LinkedIn links
- Static site generation for fast loading
miswag.engineering/
├── app/ # Next.js App Router pages
│ ├── articles/[id]/ # Dynamic article pages
│ ├── layout.tsx # Root layout
│ └── page.tsx # Home page
├── components/ # React components
│ └── ui/ # shadcn/ui components
├── lib/ # Utilities and data fetching
├── hooks/ # Custom React hooks
├── public/
│ ├── content/ # JSON configuration files
│ │ ├── site.json # Site title and bio
│ │ ├── articles.json # Article metadata
│ │ ├── categories.json # Article categories
│ │ ├── team.json # Team member profiles
│ │ ├── about.json # About page content
│ │ └── footer.json # Footer and social links
│ ├── data/ # Article markdown files and images
│ ├── avatars/ # Team member avatars
│ ├── logo.png
│ └── favicon.png
└── .github/workflows/ # GitHub Actions deployment
Install dependencies:
npm installRun the development server:
npm run devBuild for production:
npm run build-
Write your article in Notion and export it as Markdown.
-
Create the article directory under
public/data/:mkdir public/data/my-new-article
-
Move the exported files:
- Rename the exported
.mdfile toindex.md. - Move
index.mdand any images folder intopublic/data/my-new-article/.
- Rename the exported
-
Add a cover image for the article card:
public/data/my-new-article/cover.png -
Register the article in
public/content/articles.json:{ "article_id": "my-new-article", "article_title": "My Article Title", "author_team_id": 1, "category_id": 1, "article_created_at": "2026-01-15", "article_keywords": ["keyword1", "keyword2"], "article_description": "Brief description of the article.", "article_directory": "my-new-article", "featured_image": "cover.png" }Use
team.jsonto find the correctauthor_team_idandcategories.jsonfor thecategory_id. Add new entries if needed.
-
Add an avatar image to
public/avatars/. -
Add the member to
public/content/team.json:{ "team_id": 4, "team_member_name": "Full Name", "team_member_position": "Position Title", "team_member_linkedin": "https://www.linkedin.com/in/username/", "team_member_avatar": "avatar.png", "team_member_bio": "Short bio about the team member." }
Add a new entry to public/content/categories.json:
{
"category_id": 5,
"category_name": "New Category"
}Reference this category in articles using "category_id": 5.
The site automatically deploys to GitHub Pages on every push to the main branch via GitHub Actions.
MIT