Wasp Tutorial Jam #1 -- Teach Others, Win Prizes 😎
Tags: tutorial, react, fullstack
Published: 2023-06-30 16:10:06

## Introduction

The Wasp Tutorial Jam is a contest where participants are required to create a tutorial about building a fullstack React/Node app with Wasp.

## Wait, What’s Wasp?

First of all, it’s sad that you’ve never heard of [Wasp](https://wasp-lang.dev).

![https://media0.giphy.com/media/kr5PszPQawIRq/giphy.gif?cid=7941fdc6gwgjf866b0akslgciedh53jf9narttadkglvvcp0&ep=v1_gifs_search&rid=giphy.gif&ct=g](https://media0.giphy.com/media/kr5PszPQawIRq/giphy.gif?cid=7941fdc6gwgjf866b0akslgciedh53jf9narttadkglvvcp0&ep=v1_gifs_search&rid=giphy.gif&ct=g)

Wasp is a unique fullstack framework for building React/NodeJS/Prisma/Tanstack Query apps.

Because it’s based on a compiler, you write a simple config file, and Wasp can take care of generating the skeleton of your app for you (and regenerating when the config file changes). You can read more about [Wasp here](https://wasp-lang.dev)

## Rules

The rules are simple. The tutorial must:

- Use Wasp.
- Be written in English.
- Be original content and not copied from any existing sources.
- Be a written tutorial posted to a social blogging platform like [dev.to](http://dev.to) or [hashnode.dev](http://hashnode.dev), or a YouTube video tutorial
- Contain the hashtag `#buildwithwasp`
- Submitted by pasting the link in the #tutorialjam channel on our [Discord Server](https://discord.gg/rzdnErX)
    
    AND
    
- The tutorial can focus on any topic and be any length (short or long) just as long as it uses Wasp’s fullstack capabilities.

![https://media1.giphy.com/media/iB4PoTVka0Xnul7UaC/giphy.gif?cid=7941fdc67jeepog7whrdmkbux0c6kxzb8eyhqwpjcd1tunvp&ep=v1_gifs_search&rid=giphy.gif&ct=g](https://media1.giphy.com/media/iB4PoTVka0Xnul7UaC/giphy.gif?cid=7941fdc67jeepog7whrdmkbux0c6kxzb8eyhqwpjcd1tunvp&ep=v1_gifs_search&rid=giphy.gif&ct=g)

## Judging Criteria

The judging criteria for the Tutorial Jam will be based on:

- Clarity and conciseness of the tutorial.
- Creativity and originality of the tutorial.
- Effectiveness of the tutorial in helping the reader understand and use Wasp to create a fullstack web app or demonstrate a web development topic.

## Templates & Tutorial Examples

We have a whole repo of starter templates that you can use with Wasp by [installing wasp](https://wasp-lang.dev/docs/quick-start) and running `wasp new` in the command line. The interactive prompt will ask you what template you’d like to start with:

```bash
[1] basic (default)
    Simple starter template with a single page.
[2] todo-ts
    Simple but well-rounded Wasp app implemented with Typescript & full-stack type safety.
[3] saas
    Everything a SaaS needs! Comes with Google auth, ChatGPT API, Tailwind, & Stripe payments.
[4] embeddings
    Comes with code for generating vector embeddings and performing vector similarity search.
[5] WaspAI
    An AI powered code scaffolder. Tell it what kind of app you want and get a scaffolded fullstack app
```

In addition, here are some ideas to help you get inspired. You could build a simple fullstack app with Wasp in order to explain some key concepts:

- **Wasp’s New AI-Generated App Feature:** build any fullstack app using Wasp’s new AI-generated App feature and explain the process.
    - *What worked? What didn’t? What are some prompt engineering tips? What did you have to do to get the app in a desired final state?*
- **Full-Stack Type Safety:** Using Wasp’s low-on-boilerplate fullstack typesaftey, you could dive deep into types on both frontend and backend.
    - *How does Wasp’s fullstack typesafety compare to tRPC and/or the T3 stack?*
- **Data Management:** With complete control and easy implementation of data models, you could explore the concepts of databases, data management and relational data in a simplified environment.
    - *What are some tips and tricks for working with Prisma and relational DBs?*
- **Understanding Fullstack Web Development:** Wasp being a fullstack tool truly shines a light on how front-end and back-end connect in web development. It’s a great tool for understanding how queries, actions, and other operations in back-end can be utilized in front-end components.
    - *How does the HTTP protocol work in detail?*

Or you could write a tutorial that explains how to build:

- **A vector-powered AI app:** Leverage Wasp’s truly fullstack, serverful architecture to build a personalised tool powered by embeddings and vector stores.
- **Realtime Chat or Polling App:** Any realtime app could take advantage of Wasp’s easy-to-use websockets features. The tutorial could explain handling real-time data, and other basic back-end concepts.
- **Online Shop:** An e-commerce platform model with features like user registration, product display, a shopping cart, and a check-out process, using Wasp’s easy to configure authorization, and database management.

## Prizes

The winners of the Wasp Tutorial Jam will receive the following prizes:

- First Place: [Wasp-colored mechanical keyboard](https://www.caseking.de/ducky-one-3-yellow-mini-gaming-tastatur-rgb-led-mx-red-us-gata-1745.html?sPartner=999&gclid=Cj0KCQjw1_SkBhDwARIsANbGpFtYpC2-jFuJ94A6VF6oDFLEZQUya3Ky7P9Ih-nU_Zb9NsDjNhmITbIaAtBMEALw_wcB), and your tutorial and info featured on all our blogs (Wasp official website, dev.to, and hashnode)
- Second Place: 3 months access to [PluralSight](https://www.pluralsight.com/) courses (tons of Software Development courses, tutorials and lessons!) or a $75 Amazon giftcard, and your tutorial featured on all our blogs
- Third Place: Wasp Swag and a feature of your tutorial and info on our social media channels.


![prize keyboard](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qgbjhvtkxyfbennhdok0.png)

## Submission Deadline

All submissions must be received by Sunday, July 16th 11:59 p.m. CET. 
Winners will be announced the following week.

## Questions?

Head on over to our [Discord Server](https://discord.gg/rzdnErX) and ask away :)

Good luck!