DEV Community

loading...
Cover image for Hello Corejam, Hello World

Hello Corejam, Hello World

mattvb91 profile image Matthias von Bargen Originally published at Medium Updated on ・2 min read

Corejam is a scaffolding for building progressive GraphQL powered jamstack applications.

Corejam is under heavy development and THERE IS NO STABLE RELEASE. We currently do not offer an upgrade path and there will be breaking changes until we hit 1.0.0. This should only be used as a preview.

Alt Text

What is Corejam?

In its most basic form Corejam is a structure for building Serverless GraphQL jamstack applications. Ontop of that you can pull in other Corejam applications into your project package.json and we merge the schemas and resolvers for you automatically. This allows for incredibly quick workflows.

In this quick overview we will bootstrap a new Corejam application and create a static build that can be deployed. (Coming in the next article)
To get started we need to install the Corejam binary and create a new project:

npx:
$ npx corejam createApp testApp

Yarn:
$ yarn global add @corejam/cli
$ corejam createApp testApp

npm:
$ npm i -g @corejam/cli
$ corejam createApp testApp
Enter fullscreen mode Exit fullscreen mode

The Corejam binary will now create a new project with the appropriate structures in place:

⠋ Creating new Corejam application: testApp: <cwd>/testApp
✔ Templates finished
✔ Copy finished
✔ Renaming finished
✔ Dependencies installed
✔ Everything is ready to go
Enter fullscreen mode Exit fullscreen mode

Alt Text

A quick overview of the structure that was created:

app/
 - components
 - routes
 - store
server/
 - graphql
 - resolvers
 - schema
 - types
Enter fullscreen mode Exit fullscreen mode

The app/ directory consists of Stencil.js components. We use the app/routes/ directory when creating a static build for your various pages. Your routes should consist of finished "pages" that are built using individual components.

The server/ directory consists of our graphQL resolvers. When the server is booted through the @corejam/base package we collect all the relevant data such as your schema/testApp.graphql schema and the associated resolvers.

Ok lets run it!

You can launch the Corejam Dev Playground by running:

yarn
$ yarn dev

npm:
$ npm dev
Enter fullscreen mode Exit fullscreen mode

We have collected all your currently active routes and components to be available on http://localhost:3001

The graphQL playground is available on http://localhost:3000

Alt Text

You are now set up to start querying against your GraphQL endpoint from your components.

Generating a static build

To generate a static build & serve it run the following:

npm:
$ npm run static
$ npm run static:serve

yarn:
$ yarn static
$ yarn static:serve
Enter fullscreen mode Exit fullscreen mode

For more examples of how an application can be structured check out our active development on our Open source Serverless Webshop we are building as a Corejam application.

Discussion

pic
Editor guide