Astro GraphQL Starter

Welcome to the astro-graphql-starter! This is a starter kit for those looking to build applications using Astro with GraphQL integration.

Features

• Astro: Build faster websites with less client-side JavaScript.
• Apollo Client: State management library for JavaScript that enables you to manage both local and remote data with GraphQL.
• TailwindCSS: Utility-first CSS framework for rapid UI development.
• NanoStores: Simple state management for React.
• GraphQL Yoga: A fully-featured GraphQL Server with focus on easy setup, performance & great developer experience.
• Vanilla Extract: Zero-runtime Stylesheets-in-TypeScript.
• React: A JavaScript library for building user interfaces.
• ViTest: Testing utility for Vite projects.

Setup

1. Clone the repository:

git clone https://github.com/alanpcurrie/astro-graphql-starter.git
cd astro-graphql-starter

2. Install the dependencies:

pnpm install

Available Scripts

• pnpm dev or pnpm start: Runs the app in development mode.
• pnpm build: Builds the app for production.
• pnpm preview: Runs a preview of the built production app.
• pnpm test: Run the tests using ViTest.

Dependencies

This project uses various packages to provide a rich development and user experience. Here's an overview of the main dependencies:

• Astro Core: astro, @astrojs/node, @astrojs/react, @astrojs/tailwind, @astrojs/ts-plugin.
• State Management & Data Fetching: @apollo/client, graphql, graphql-yoga, nanostores, @nanostores/react.
• UI & Styling: tailwindcss, @vanilla-extract/css, @vanilla-extract/vite-plugin.
• React & Types: react, react-dom, @types/react, @types/react-dom.
• Testing: vitest.

Development Tools

To ensure a consistent codebase and improve developer experience, this project uses:

• Linting: eslint, @typescript-eslint/parser, eslint-plugin-astro, eslint-plugin-jsx-a11y.
• Formatting: prettier, prettier-plugin-astro.

---