- Complete project structure with Next.js frontend - GraphQL API backend with Apollo Server - Portal application with NextAuth - Crossplane Proxmox provider - GitOps configurations - CI/CD pipelines - Testing infrastructure (Vitest, Jest, Go tests) - Error handling and monitoring - Security hardening - UI component library - Documentation
1.7 KiB
1.7 KiB
API Usage Examples
Authentication
Login
const LOGIN_MUTATION = gql`
mutation Login($email: String!, $password: String!) {
login(email: $email, password: $password) {
token
user {
id
email
name
}
}
}
`
const { data } = await client.mutate({
mutation: LOGIN_MUTATION,
variables: {
email: 'user@example.com',
password: 'password123'
}
})
// Store token
localStorage.setItem('token', data.login.token)
Resources
Get All Resources
const GET_RESOURCES = gql`
query GetResources {
resources {
id
name
type
status
site {
name
region
}
}
}
`
const { data } = await client.query({
query: GET_RESOURCES
})
Create Resource
const CREATE_RESOURCE = gql`
mutation CreateResource($input: CreateResourceInput!) {
createResource(input: $input) {
id
name
type
status
}
}
`
const { data } = await client.mutate({
mutation: CREATE_RESOURCE,
variables: {
input: {
name: 'web-server-01',
type: 'VM',
siteId: 'site-id-here',
metadata: {
cpu: 4,
memory: '8Gi'
}
}
}
})
Using React Hooks
import { useResources, useCreateResource } from '@/lib/graphql/hooks'
function ResourcesList() {
const { data, loading, error } = useResources()
const { createResource } = useCreateResource()
if (loading) return <div>Loading...</div>
if (error) return <div>Error: {error.message}</div>
return (
<div>
{data?.resources.map(resource => (
<div key={resource.id}>{resource.name}</div>
))}
</div>
)
}