Purposeful code, one byte at a time.
A developer blog and documentation site built with Docusaurus, focused on coding challenges, development tools, and technical insights. This repository contains the complete source code, content, and automation tools for the Bytes of Purpose website.
This repository serves as both a developer blog and a comprehensive documentation site covering:
- Coding Challenges & Algorithms - Problem-solving techniques and solutions
- Development Tools & Mechanics - Technical implementation guides
- Learning Resources - Deep dives into programming concepts
- Project Documentation - Real-world development experiences
- Process & Workflow Insights - Productivity and development practices
The docs are a topic-based information architecture: each top-level folder is a
reader-facing topic (kebab-case, no numeric name prefix — order is set by each
_category_.json's position, and every doc carries an absolute slug: so a
folder move never changes a URL).
omars-lab.github.io/
├── bytesofpurpose-blog/ # Main Docusaurus site
│ ├── blog/ # Blog posts (publication-ready content)
│ ├── designs/ # System designs / architectural insights
│ ├── docs/ # Topic-organized knowledge base (see below)
│ │ ├── welcome/ # Site introduction and how to browse
│ │ ├── generative-ai/ # GenAI fundamentals + building GenAI systems
│ │ ├── software-development/ # Dev process: experiments, projects, roadmaps
│ │ ├── product-management/ # Idea→ship lifecycle (ideas, research, POCs)
│ │ ├── productivity/ # Organizing/discovering/analyzing/automating
│ │ ├── blogging/ # Authoring + embedding content in the site
│ │ ├── interview-prep/ # DS&A, system design, behavioral prep
│ │ ├── companies/ # Roles, levels, skills, and company culture
│ │ ├── entrepreneurship/ # Engineer → founder notes
│ │ ├── personal-growth/ # Habits, reflection, health, finances
│ │ └── faith/ # Where faith meets craft (Islamic automations)
│ ├── ideas/ # Post-idea seeds → generated /vote page data
│ ├── changelog/ # Changelog seeds → generated /changelog cards
│ ├── src/ # Custom React components, theme swizzles, styles
│ ├── scripts/ # Build/validation tooling (links, structure, data)
│ ├── static/ # Static assets (images, icons, etc.)
│ └── build/ # Generated static site (deployment ready)
├── .claude/ # Claude Code skills, hooks, and plans
├── Makefile # Build, validation, and deployment automation
└── package.json # Root package configuration
The core Docusaurus application containing all content and configuration.
A topic-organized knowledge base. Each top-level folder is a reader-facing topic:
welcome/- Site introduction and how to browse by topicgenerative-ai/- GenAI fundamentals and designing/shipping GenAI systemssoftware-development/- The dev process: experiments, projects, roadmapsproduct-management/- The idea→ship lifecycle (ideas, research, POCs, experiments)productivity/- Organizing, discovering, analyzing, and automating workblogging/- Authoring and embedding content (components, diagrams, code)interview-prep/- Data structures, algorithms, system design, behavioral prepcompanies/- The roles, levels, skills, and culture inside companiesentrepreneurship/- Notes on going from engineer to founderpersonal-growth/- Habits, reflection, reading, mentorship, health, financesfaith/- Where faith meets craft — Islamic automations and trackers
Publication-ready articles covering experiences, insights, and lessons learned.
Architectural decisions, design patterns, and system design insights.
Node scripts wired into the build and the Makefile:
generate-changelog-data.js/generate-ideas-data.js- Turnchangelog/andideas/seeds into the JSON the/changelogand/votepages rendervalidate-links.js- Source-level link hygiene (bare/long/tracking URLs, broken-internal + link-to-draft)validate-docs-structure.js- Enforces the topic-folder contract (absolute slugs, naming, depth)
Skills (the SDLC playbooks), PostToolUse validation hooks, and planning docs.
- Node.js (v18 or higher)
- Yarn package manager
# Clone the repository
git clone https://github.com/omars-lab/omars-lab.github.io.git
cd omars-lab.github.io
# Install dependencies
make install
# Start development server
make start# Build the site
make build
# The built site will be in bytesofpurpose-blog/build/📖 For detailed development instructions, see DEVELOPMENT.md which covers:
- Component development
- Storybook setup and usage
- Testing
- TypeScript & Babel configuration
- Troubleshooting
- Changelog generation system
- Draft System - Content can be marked as draft for work-in-progress
- Frontmatter Standards - Consistent metadata across all content
- Tag System - SEO-friendly tagging for content discovery
- Sidebar Navigation - Organized content hierarchy
- Docusaurus 3.x - Modern static site generator
- React Components - Custom interactive elements
- MDX Support - Rich content with embedded components
- Responsive Design - Mobile-first approach
- Automated Builds - Makefile-based build system
- Link Validation - Automated broken link detection and fixing
- Content Standards - Automated frontmatter validation
- SEO Optimization - Structured metadata and sitemap generation
- Documentation (
/docs/) - Durable, reference material for solving specific problems - Blog Posts (
/blog/) - Experiences, lessons learned, and evolving perspectives - Design Posts (
/designs/) - Architectural decisions and design insights
- All content is thoroughly reviewed for accuracy and clarity
- Code examples are tested and working
- Links are verified and maintained
- Content is regularly updated to reflect current best practices
make validate-links- Link hygiene + broken-internal / link-to-draft checksmake validate-structure- Topic-folder contract (absolute slugs, naming, depth)make secret-scan- gitleaks scan (also runs as a pre-commit hook)make test-regression- Playwright e2e (a11y + SEO gates)
The same checks run automatically as warn-tier PostToolUse hooks while editing
(see .claude/settings.json).
Deployment is run manually with make deploy (from the repo root): it secret-scans,
builds the Docusaurus site with the PostHog env, and pushes the static output to the
gh-pages branch, which serves blog.bytesofpurpose.com.
This repository welcomes contributions in several areas:
- Content Improvements - Fix typos, improve clarity, add examples
- Technical Enhancements - Component improvements, performance optimizations
- Documentation - Additional guides, tutorials, or reference materials
- Automation - New maintenance scripts or build improvements
- Fork the repository
- Create a feature branch
- Make your changes
- Test thoroughly (especially for link integrity)
- Submit a pull request
💡 Developer Guide: See DEVELOPMENT.md for detailed setup, component development, testing, and build instructions. See NAMING_CONVENTIONS.md for changelog entry naming conventions.
- Live: ✅ blog.bytesofpurpose.com
- Content Coverage: Comprehensive across the topics above
- Validation: link hygiene + topic-structure checks run on every edit (warn-tier)
- Live Site: blog.bytesofpurpose.com
- GitHub Repository: omars-lab/omars-lab.github.io
- Author: Omar Eid
This project is open source and available under the MIT License.
Built with ❤️ using Docusaurus and deployed on GitHub Pages