https://github.com/stellarpossible/stellarpossible-nuxt

A TypeScript-based headless Nuxt 3 frontend for a WordPress-powered tech solutions website. Features authenticated GraphQL via Apollo Client, responsive images, SCSS theming, and dynamic post routing.
https://github.com/stellarpossible/stellarpossible-nuxt

graphql headless-wordpress nuxtjs scss-styles typescript

Last synced: about 2 months ago
JSON representation

A TypeScript-based headless Nuxt 3 frontend for a WordPress-powered tech solutions website. Features authenticated GraphQL via Apollo Client, responsive images, SCSS theming, and dynamic post routing.

• Host: GitHub
• URL: https://github.com/stellarpossible/stellarpossible-nuxt
• Owner: StellarPossible
• Created: 2025-05-20T12:58:49.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2025-05-20T16:41:00.000Z (about 1 year ago)
• Last Synced: 2025-06-08T23:07:22.461Z (about 1 year ago)
• Topics: graphql, headless-wordpress, nuxtjs, scss-styles, typescript
• Language: Vue
• Homepage: https://www.stellarpossible.com
• Size: 8.66 MB
• Stars: 0
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Stellar Possible — Headless Nuxt 3 + TypeScript Frontend

This project is a fully headless, API-driven frontend for a **tech solutions website**, built using **Nuxt 3 with TypeScript**. It connects to a secure **WordPress + WPGraphQL** backend and renders content using authenticated GraphQL requests.

- ⚙️ Powered by [Nuxt 3](https://nuxt.com/) + [TypeScript](https://www.typescriptlang.org/)

- 🔐 Authenticated GraphQL via [Apollo Client](https://www.apollographql.com/docs/react/)

- 📸 Optimized image delivery with `@nuxt/image-edge`

- 🎨 SCSS theming with modular variables and global styles

- 🧠 Dynamic content routing via WordPress slugs

---

## 🧱 Tech Stack

| Tech                | Role                                 |

|---------------------|--------------------------------------|

| Nuxt 3              | Application framework (SSR/SSG)      |

| TypeScript          | Type-safe development                |

| WordPress + WPGraphQL| CMS and content API                 |

| Apollo Client       | Secure GraphQL data fetching         |

| SCSS                | Custom styles and theming            |

| @nuxt/image-edge    | Optimized, responsive images         |

---

## 🔐 Authentication

This frontend uses **Basic Auth via WP Application Passwords** to securely query the WordPress GraphQL API.

Create a `.env` file in the project root:

```env

WP_USER=your_wp_username

WP_APP_PASSWORD=your_app_password