STEM Gharbiya site banner

STEM Gharbiya site

4 devlogs
22h 0m 16s

STEM Gharbiya is a modern, SEO-optimized website built with Astro, featuring dynamic team, alumni, and activities pages, a secure join system using Hono backend APIs, structured data, and smooth client-side transitions for fast, accessible UX.

This project uses AI

Used GitHub Copilot to assist with styling, repetitive tasks, and reviewing portions of my code, as well as helping refine README files, commit and PR summaries, and SEO-related work.

Repository

Loading README...

Saif (A8K)

This phase focused on refining PWA support, improving asset organization, and optimizing image handling across the site.

Work began with a refactor of the PWA manifest configuration to consolidate icon definitions and improve maintainability (PR #56). Building on that, additional PWA assets were introduced, including new 192Ă—192 and 512Ă—512 icons, optimized logo images, and layout updates to better support manifest integration and consistent branding (PR #57).

Asset organization was further improved by renaming dorm facility images to remove spaces and updating import paths. This ensured more reliable asset handling and cleaner naming conventions across the project (PR #58).

The PWA manifest was then enhanced with updated icon definitions and improved glob patterns for asset caching, strengthening offline support and service worker behavior (PR #59).

Finally, image handling was improved by introducing image layout configuration. This enables Astro to automatically generate responsive images, improving performance and ensuring images render efficiently across different screen sizes (PR #60).

Overall, these updates strengthened progressive web app functionality, improved asset reliability, and enhanced performance and maintainability across the project.

Note: stemgharbiya.surge.sh was used from testing the production behavior of the site but it isn’t the production url.

Attachment
Attachment
Attachment
Attachment
0
Saif (A8K)

This phase focused on stability, documentation, structure, and progressive enhancement.

On February 23, the Team page was improved by adding status support for members, displaying former members, and linking the Join page to the current development team (PR #46). In parallel, frontend–workers integration was strengthened with a typed Hono client, unified form logic, shared error handling utilities, and a more reliable Turnstile reset flow (PR #45).

Documentation was overhauled on February 24. The main README and workers README were aligned with the current architecture, including updated environment variables, setup instructions, validation requirements, and deployment guidance (PR #48). Rate limiting documentation was updated to use Cloudflare’s Rate Limiting binding, and the local development port was corrected (PR #47).

On February 28, bundling was optimized by switching the frontend to direct fetch calls, preventing the workers’ Hono dependency from being bundled client-side (PR #53). A main About page was also introduced as a structured hub with summary content, hero section, and navigation links to related pages (PR #51).

Finally, March 3 focused on polish and progressive web app improvements. Theme handling was enhanced to respect saved and system preferences, with automatic dark mode detection and light/dark favicons (PR #54). A full PWA manifest with app details and shortcuts was added, along with proper asset integration and theme color configuration in the layout (PR #55).

Overall, this iteration improved performance, documentation clarity, structural consistency, theming behavior, and PWA completeness, moving the project closer to production-grade quality.

Attachment
Attachment
0
Saif (A8K)

This update focused on consistency and frontend–backend improvements.

The About section was refactored by consolidating headers, removing per-page hero sections, and restyling Staff cards for better alignment with the design system (PR #44). This reduced duplication and improved visual consistency across pages.

On the infrastructure side, a typed Hono client was added to strengthen frontend–workers integration (PR #45). Form logic was unified across the site, and a Turnstile reset issue was fixed to improve reliability during resubmissions.

These changes improved structure, type safety, and overall user experience.

Attachment
0
Saif (A8K)

Work on the STEM Gharbiya website began on February 5 with the initial commit, establishing the foundation of the project. The Astro structure was set up, Tailwind CSS integrated, and global layout and theming refined for scalability. Dynamic meta tags and centralized site configuration were added early (PR #2), followed by PWA support, sitemap generation, and robots.txt integration (PR #3), ensuring strong SEO and architectural fundamentals.

On February 12, the homepage was enhanced with reusable components, layout refactoring, and Astro Icons integration (PR #16), improving structure and visual consistency.

Mid-February focused on backend infrastructure. The join repository was integrated under the workers directory (PR #25), and a full join system was implemented using Hono with D1 persistence, Turnstile protection, Resend email integration, and a connected frontend page (PR #28). This transitioned the site from static to backend-enabled.

Forms were unified through a reusable FormLayout and shared validation utilities, with clearer API validation errors (PR #30, #32).

On February 18, site structure and content were refined. The admission page was reorganized (PR #33), footer and contact configuration improved (PR #34), and an Alumni page with dynamic year filtering was introduced (PR #35).

February 22 marked a major expansion: a Team page (PR #37), improved footer navigation (PR #38), an Activities page with shared social utilities (PR #41), structured data and IndexNow integration for stronger SEO (PR #42), and ClientRouter with Astro lifecycle migration enabling smooth view transitions (PR #43).

In about two weeks, the project evolved into a scalable, SEO-optimized platform with backend APIs, structured content, improved accessibility, and modern navigation.

Attachment
Attachment
Attachment
Attachment
Attachment
Attachment
Attachment
0