Together we will build "Sick Fits", a full stack online clothing store complete with real credit checkout. Users can search, sell, add to cart and checkout their favourite items.

The application has six main models — Users, Items, Orders, CartItems, OrderItems, and Roles — all of which are relational and showcase the power of relational GraphQL Queries.

The app also includes many server side bits including authentication, permissions, sending email, uploading images, and charging credit cards.

In addition to building both the frontend and backend of the application, we also spend the last section of the course Testing the React application.

For a full list of topics covered, see below.

React.js

For Building The Interface along with:

• Next.js for server side rendering, routing and tooling
• Styled Components for styling
• Context for Managing Local State
• Apollo's React Hooks for interfacing with Apollo Client
• Jest & React Testing Library for Testing

Apollo Client

For Data Management

• Performing GraphQL Mutations(create, update, delete)
• Fetching data via GraphQL Queries
• Caching GraphQL Data
• Error and Loading UI States
• Apollo Client replaces the need for redux + data fetching/caching libraries

Keystone.js

A Node.js based GraphQL Server + Headless CMS For:

• Admin Interface to manage data
• Provides a set of GraphQL CRUD APIs for a MongoDB or Prisma Database
• Schema Definition
• Data Relationships
• Open Source + Self-hosted
• Built with Node.js, React + Next.js
• Implementing Query and Mutation Resolvers
• Custom Server Side Logic
• Charging Credit Cards with Stripe
• Sending Email
• Performing Authentication
• Managing + Checking Roles + Permissions

GraphQL is a type-safe query language for APIs and a runtime for fulfilling those queries with your existing data.

What?! It's a replacement for (or addition to) your REST API and Ajax Calls.

GraphQL requires buy-in from both your client and your server — it then puts the power of requesting only what you want into the client and the business logic of finding and filtering that data into backend resolvers.

Specifically in this course it enables libraries that make caching, loading, error handling and pagination a breeze

Complex Relational Data queries and server-side mutations like signing up or checking-out are a snap with GraphQL.

GraphQL is just a standard and can be implemented in any language or framework.

11+Modules

70+Videos

13Hours Building App

5Hours Testing

Team License Packages

With a team license you can buy a number of spots to allocate to employees. The spots do not expire and you can fill the spots via the dashboard whenever you like.

Perfect for on-boarding new hires, interns and contractors to your tech stack.

The team license includes everything in the Master Package above. Spots cannot be re-assigned once used.

For larger groups or for on-site training contact me for more info!

I don't like your cool font

Do these videos expire? Is this a monthly cost?

Nope and nope. Pay once, have them forever.

Cool, but I would have usedwithand thenandwith a hint ofITS THE BEST!!!

I've spent many months evaluating many different setups, boilerplates, packages and approaches to building a full stack application. Why no doubt there are many fantastic options, I found this set of technologies to be the best fit - they are all extremely well supported, actively developed and most importantly are the tech that I'd reach for when building a new application.

It's important to note here that this course isn't just teaching you how to hook together a few packages - you are learning to think in and build full stack React and GraphQL applications. The ideas behind this course transcend all packages!

Do you provide a certificate of completion?

Sure do! In your course dashboard you can download an official certificate of completion that can be used to be reimbursed by your employer or land that dream job you are applying for.

Can I put the code on GitHub? Can I put this app in my portfolio?

Absolutely - I just ask that you don't create your own course teaching with this app. Otherwise, go nuts! You can credit my course if you like, but it's not required as you might be using this app to get a job :)

What other courses do you have?

I've got a bunch of free and premium web development courses — check out the whole listing over at wesbos.com/courses.

I lost, deleted or never got my welcome email! What do I do?

Log into your account, or create an account with the same email you used to buy the series.

What format are the videos? How do I watch them?

Once you buy a package, you will be mailed access to your account dashboard where you can stream all the videos. Buyers of the Master Package will also be able to download them for off-line viewing. All the videos were professionally recorded in 4k with top quality audio — no pops, echoes, chair squeaks, breathing or gross mouth sounds here!

What if I'm not thrilled?

I want to make sure you get real value out of this so I only want your money if you are happy with the product! If you aren't satisfied, please send an email to hey@wesbos.com with a copy of your welcome email and I will refund you.

Do you offer a student discount?

Absolutely! Fill out this form with some proof that you are a student and I'll send you a discount code. This applies to anyone in any type of schooling, including evening classes and coding bootcamps!

If you have received a student discount for a previous product, it's the same code 😉.

What theme do you use? What is that font? What terminal do you use? What kind of bread do you buy?

I've detailed my entire setup over here, feel free to tweet me with any more questions you have about setting things up.