Build React Apps With GraphQL, MongoDB, and TypeScript

Introduction to the TinyHouse Masterclass.

Project Source Code

Get the project source code below, and follow along with the lesson material.

Download Project Source Code

To set up the project on your local machine, please follow the directions provided in the README.md file. If you run into any issues with running the project source code, then feel free to reach out to the author in the course's Discord channel.

Table of Contents

Lesson Transcript

  • [00:00 - 00:13] Welcome to Tinyhouse, New Line's first MasterClass. In this MasterClass, we'll build a production-ready application using React, GraphQL, TypeScript, Mongo, and Note.

  • [00:14 - 00:22] This MasterClass is a project-based, hands-on experience, and we're incredibly excited to have you with us. We're your instructors.

  • [00:23 - 00:40] I'm Hassan, a front-end engineer based in Toronto, and I've helped author Full Stack View and a series of other publications under the FullStack in New Line umbrella. I've also been working with React, GraphQL, and TypeScript for a number of years now to build large-scale production applications.

  • [00:41 - 00:52] Hi, I'm Jing, also a developer based in Toronto. I've been working with React, Note, and MongoDB for the past few years on building apps ranging from hobbies to startups.

  • [00:53 - 01:02] We've broken the course down to two parts. In part one, we'll be introducing all the core technologies you'll need to develop a FullStack Web App.

  • [01:03 - 01:20] We'll learn about Note, TypeScript, GraphQL and Apollo, MongoDB, and React. We'll use these technologies to build a Web App that presents listing data, which is kept in a Mongo database, and it's accessed through a GraphQL API.

  • [01:21 - 01:33] We will also introduce a UI framework to make our app more presentable. In part two, we'll be taking everything we've learned from part one to now focus on building an actual production-ready app.

  • [01:34 - 01:50] We'll maintain and use all the things we've learned in part one, but now focus on building the tiny house application. We'll discuss the relationships and flow within our app, as well as handle topics like Google OAuth for signing.

  • [01:51 - 02:19] Use Google's GeoCode API to resolve location-based searches, stripe for handling payments, image storage with Cloudinary, deployment, and a lot more. We are excited to launch our course on the new live platform.

  • [02:20 - 02:34] You'll have access to all source code, screencast videos, and menu script. In order to reinforce learning material, the course also contains quizzes, project challenges, lecture slides, and a lot more.

  • [02:35 - 02:39] We're incredibly excited to have you, and we'll see you in the course.

  • [00:00 - 00:13] Welcome to Tinyhouse, New Line's first MasterClass. In this MasterClass, we'll build a production-ready application using React, GraphQL, TypeScript, Mongo, and Note.

    [00:14 - 00:22] This MasterClass is a project-based, hands-on experience, and we're incredibly excited to have you with us. We're your instructors.

    [00:23 - 00:40] I'm Hassan, a front-end engineer based in Toronto, and I've helped author Full Stack View and a series of other publications under the FullStack in New Line umbrella. I've also been working with React, GraphQL, and TypeScript for a number of years now to build large-scale production applications.

    [00:41 - 00:52] Hi, I'm Jing, also a developer based in Toronto. I've been working with React, Note, and MongoDB for the past few years on building apps ranging from hobbies to startups.

    [00:53 - 01:02] We've broken the course down to two parts. In part one, we'll be introducing all the core technologies you'll need to develop a FullStack Web App.

    [01:03 - 01:20] We'll learn about Note, TypeScript, GraphQL and Apollo, MongoDB, and React. We'll use these technologies to build a Web App that presents listing data, which is kept in a Mongo database, and it's accessed through a GraphQL API.

    [01:21 - 01:33] We will also introduce a UI framework to make our app more presentable. In part two, we'll be taking everything we've learned from part one to now focus on building an actual production-ready app.

    [01:34 - 01:50] We'll maintain and use all the things we've learned in part one, but now focus on building the tiny house application. We'll discuss the relationships and flow within our app, as well as handle topics like Google OAuth for signing.

    [01:51 - 02:19] Use Google's GeoCode API to resolve location-based searches, stripe for handling payments, image storage with Cloudinary, deployment, and a lot more. We are excited to launch our course on the new live platform.

    [02:20 - 02:34] You'll have access to all source code, screencast videos, and menu script. In order to reinforce learning material, the course also contains quizzes, project challenges, lecture slides, and a lot more.

    [02:35 - 02:39] We're incredibly excited to have you, and we'll see you in the course.