GraphQL: Zero to Awesome

GraphQL helps you build rich APIs quickly. Build and deploy a GraphQL backend in Elixir and JavaScript, and write clients for it in Vue, React Native, Elm, and Flutter. Learn tooling that will help you do it faster.

Subscribe for access

What will you get?

GraphQL is changing the way we work by allowing us to build rich APIs quickly that are easy to extend. If you haven't checked it out, what are you waiting for? We've produced a series of videos and open source repositories to help get you up to speed quickly.

With a focus on modern technology and real world application, this course is a complete start-to-finish guide to building a real-time GraphQL forum using Node.js or Elixir, then implementing a client for it using Vue, Flutter, React Native, and Elm.

Subscribe for access

What will you build?

Together we will build a complete full stack online forum in either Elixir or TypeScript, with multiple web and mobile clients. Users can create categories, threads and post with markdown support. The GraphQL backend also supports subscriptions, so we can see updates to a thread in real-time.

We will build the business logic layer backed by a database, design a GraphQL server on top of it, and consume the API from various client applications.

This course is designed to showcase GraphQL's versatility and to dramatically improve your coding skills while introducing you to new technologies. You not only will learn GraphQL but also Elixir, Node.js / TypeScript, Flutter, React Native, Elm, React and Vue.

Go from Zero to Awesome in a host of technologies!

The course is designed to developers from mid-junior to senior. We take special care in explaining and describing in detail the core concepts of each tool and every important term used. This course covers a breadth of technologies - feel free to mix and match what you need, or use it as an excuse to learn something new!

Here's the complete summary of technologies covered in this course:

  • Node.js

    Node.js is a JavaScript runtime built on Chrome's V8 JavaScript engine.

  • Elixir

    Elixir is a dynamic, functional language designed for building scalable and maintainable applications.

  • Elm

    Elm is a pure-functional language with managed side effects that compiles to JavaScript. It has a very strong emphasis on simplicity, ease-of-use, and quality tooling.

  • Flutter

    Flutter allows you to build beautiful native apps on iOS and Android from a single codebase. It's built atop the Dart language.

  • React Native

    React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI using declarative components.

  • React

    React is a JavaScript library for building user interfaces.

  • Vue.js

    Vue is a progressive framework for building user interfaces.

  • Apollo

    The Apollo GraphQL platform is an implementation of GraphQL that helps you manage data from the cloud to your UI.

  • TypeScript

    TypeScript is a typed superset of Javascript that compiles to plain Javascript.

11 lessons and 4.8 hours of content!

Subscribe for access

What is GraphQL?

GraphQL is a query language for strongly typed APIs. It is a declarative language used to fetch data with queries, make changes to it with mutations, and learn about data that’s changing in real-time with subscriptions.

That’s a boring description though. A more succinct and exciting way to say the same thing is: with GraphQL, you just describe the data you want, and you get it.

What does it mean for an API to be strongly typed? It means that a given field returns an explicitly-specified type of data, and a GraphQL server is incapable of returning data that doesn’t match the specification. Any attempt to do so results in an error.

With GraphQL, when you’re building a client, you can be guaranteed either to receive an error, or to receive data that matches the specification. This helps you write clients with confidence.

Lessons

Each lesson focuses on a single aspect of building the project, like modeling the data, building a GraphQL server in Elixir, or building a mobile client for it in Flutter.

free

Introduction to GraphQL

What’s this GraphQL thing and where does it fit in?

free

Implementation overview and tooling

A brief look at libraries and tools to help you build GraphQL applications

free

Introduction to the forum Data Model

An overview of the data model we’ll be using, and an exploration of it via GraphQL Playground

Implement a forum data model in JavaScript

Building a JavaScript data model for a forum using TypeScript and TypeORM

Implement a forum data model in Elixir

Building an Elixir data layer for our Forum with Ecto

Building a Forum Elixir GraphQL Backend with Absinthe

Setting up a Phoenix app with Absinthe to serve our data layer over GraphQL

Building a GraphQL API for a Forum with TypeScript

Using TypeScript and ApolloServer to build a GraphQL API

Implement a Vue Client for a GraphQL Forum

Using Vue with TypeScript, Stylus, Pug, and Vuex to build a client for a graphql-powered forum

Implement a React Native Client for a GraphQL Forum

Creating a cross-platform graphql-powered forum app with React Native

Implement an Elm client for a GraphQL Forum

Using elm-graphql and elm-ui to rapidly build a webapp for our GraphQL Forum.

Implement a Flutter Client for a GraphQL Forum

Using graphql-flutter to rapidly build a real-time forum client

Authors

The code in the applications was produced by:

./josh adams

Josh Adams

I've been building web-based software for businesses for over 18 years. In the last four years I realized that functional programming was in fact amazing, and have been pretty eager since then to help people build software better.

./adam dill

Adam Dill

Adam has over 19 years of software development experience, and has spent a good part of that educating new developers. He was previously CTO at inside.com and Development Director at Maxmedia . When Adam isn't coding, he is off hiking in Colorado mountains, or practicing some pretty fly martial arts. He thinks swords are cool.

./franzé jr

Franzé Jr

Software Engineer with experience working in multi-cultural teams, Franze wants to help people when he can, and he is passionate about programming and Computer Science. Founder of RemoteMeetup.com where he can meet people all over the World. When Franze is not coding, he is studying something about programming.

./alexander pulido

Alexander Pulido

System Engineer with 5 years of experience in software development, Alex is passionate about programming and Computer Science and thinks that the proccess where the code transform into a great app is something fascinating. When Alex is not coding, he's practicing mma, playing drums or cooking.

Featured Lessons

Our content library is pretty great, here are a few lessons we think you might like.

What our Superusers are Saying!

Some other people were willing to publicly state that they like us!

Taylor Dolezal

Software Architect

Smooth Terminal has easily been one of the most helpful resources on my journey to better understand Elixir and the Phoenix web framework.

James Edward II

Developer

With any language there are so many details to learn. What functions are built-in? How should I structure my code? What tools are available for improving my workflow? It’s rare to find one source that can answer so many of these questions, but Smooth Terminal does this and more.

Rex Van Der Spuy

Game developer

Smooth Terminal is by far the best resource for learning Elm anywhere, and among the very best online learning platforms, period.