John Chen

Build Applications from Website to Mobile

Hackernews Clone Site with GraphQL (includes GraphQL subscriptions)

A Hackernews clone site built with next.js implementing GraphQL APIs, for which Apollo Client is adopted in the frontend and GraphQL Yoga in the backend server. Full functionality of the GraphQL server, including queries, mutations, and subscriptions, is implemented in this app.

GitHub

This is a Hackernews clone site built with next.js implementing GraphQL APIs, for which Apollo Client is adopted in the frontend and GraphQL Yoga in the backend server.

Subscriptions are a GraphQL feature that allows a server to send data to its clients when a specific event happens. Subscriptions are usually implemented with WebSockets or Server-Sent Events. GraphQL Yoga uses Server-Sent Events for the subscription protocol.

The real-time communication of subscriptions however was found not to function well once the package is deployed to Vercel, which is a serverless platform. We will not deploy this package to Vercel, however, a dockerized package of this app is prepared.

Docker: docker run -p 3000:3000 jglchen/hackernews-nextjs-graphql-sse

Screenshot of the Website App