Fullstack Typescript with TailwindCSS and tRPC Using Modern Features of PostgreSQL

Create a robust and scalable application architecture, from the backend data layer to the frontend UI. This comprehensive full-stack development course covers monorepos, TypeScript, Tailwind CSS, tRPC, and PostgreSQL, empowering you to build modern, scalable applications. Learn how to build a SaaS with type safety end-to-end, from the database through the backend and to the UI, with TypeScript, PostgreSQL, NodeJS and React. Using advanced features of PostgreSQL, you'll also learn how to achieve a high level of data integrity and performance, and how to manage database migrations using raw SQL for maximum control.

  • 4.3 / 5 (5 ratings)
  • Published
  • Updated
On demand video

4 hrs 54 mins

Video Lessons

30 Videos

Course Instructor
Avatar Image

Kristian Dupont

I write code, I help teams write code and I help companies create teams that write code. I am a fullstack developer at Invert and am the author of Fullstack Typescript with TailwindCSS and tRPC Using Modern Features of PostgreSQL.

How The Course Works

01Remote

You can take the course from anywhere in the world, as long as you have a computer and an internet connection.

02Self-Paced

Learn at your own pace, whenever it's convenient for you. With no rigid schedule to worry about, you can take the course on your own terms.

03Community

Join a vibrant community of other students who are also learning with Fullstack Typescript with TailwindCSS and tRPC Using Modern Features of PostgreSQL. Ask questions, get feedback and collaborate with others to take your skills to the next level.

04Structured

Learn in a cohesive fashion that's easy to follow. With a clear progression from basic principles to advanced techniques, you'll grow stronger and more skilled with each module.

Course Overview

Build type-safe full-stack applications with database-centric strategies

What You Will Learn
  • Master monorepos for streamlined development workflows and enhanced collaboration

  • Implementing type safety across your entire stack, starting from the database schema

  • Utilize Tailwind CSS to create consistent and beautiful user interfaces

  • Employ tRPC for seamless data exchange between frontend and backend

  • Managing database migrations using raw SQL for maximum control

  • Integrating modern back-end and front-end technologies

  • Harness advanced PostgreSQL features for optimized data storage, retrieval, and manipulation

  • Setting up automated testing that utilizes type safety and a real database

  • Build modern, scalable full-stack applications using a unified approach

In this comprehensive course you will gain the skills and knowledge to build modern full-stack applications using TypeScript, TailwindCSS, tRPC, and PostgreSQL.

You will learn how to create a robust and scalable full-stack application architecture using PostgreSQL, NodeJS, Koa, Knex, React, TypeScript, tRPC, and Tailwind CSS, that is enforced with type safety, from the backend and data layer to the frontend UI.

How The Course Works

  • Online: The "Real-Time Collaborative Apps with Next.js and Supabase" course is a comprehensive online program spanning six modules.
  • Remote Access: Take advantage of the course from any location, allowing you the flexibility to engage with the materials at your convenience.
  • Self-Paced Learning: Tailor your learning experience to your schedule, enabling you to progress through the course content at your own pace.

Community Engagement: Collaborate and learn alongside a diverse community of fellow students, fostering an environment of shared knowledge and support.

Structured Learning: Experience a well-organized curriculum designed to provide a cohesive and comprehensive understanding of Angular Signals in a logical progression.

Embrace the Full TypeScript Stack for Next-Level Web Development

"Move fast and break nothing" is the slogan on the tRPC landing page. Having type safety across your entire stack, from the database schema to the frontend UI, is a game changer. The course focuses on creating a type-safe application with the database as the source of truth.

The components used in this course are all mature and well-supported. The components are all open-ended, meaning these components aren't something that gets you going quickly but then becomes a burden when you need to do something they don't support. The architecture you will learn will be able to scale, not only in terms of complexity and performance requirements, but also in terms of the number of developers working on it.

Through hands-on examples and real-world scenarios, you'll learn how to integrate a suite of technologies to create a seamless development experience.

By the end of this course, you will end up with a solid structure and understanding of how to solve the various challenges that come with building a full-stack application.

Understanding the Challenges

This course aims to address several challenges in web app development, particularly as the codebase expands. Some of the challenges that this course focuses on include:

  • Minimizing errors: The course emphasizes type safety, which helps ensure that variables and expressions align with their designated types, reducing the likelihood of errors.
  • Setting up a deployable app: The course focuses on providing a foundation of infrastructure that is easy to build on, aiming to clear out most of the capital expenditures (CAPEX) involved in setting up an app for deployment.
  • Database as the source of truth: The course guides you in using the database as the foundational source of truth for your application, allowing for advanced features and retaining type safety.
  • Simplifying the development process: By using a monolithic architecture and avoiding unnecessary microservices, the course aims to simplify the development process and avoid premature complexity.
  • Providing a starting point for various SaaS applications: While the course focuses on building a booking system, the architectural concepts and foundations covered can be applied to various SaaS applications.

Why This Course?

  • Focus on Type Safety: Learn the importance of type safety in reducing errors and building reliable software.
  • Database as Source of Truth: Utilize advanced features of PostgreSQL to manage your application's data effectively.
  • Modern Technologies: Get up to speed with current best practices using technologies like React, tRPC, and Tailwind CSS.
  • Scalability and Maintenance: Prepare your applications for growth with scalable architecture and maintainable code.
  • Testing: You will see how to set up testing of all parts of the stack, using a real database and type safety to ensure your application works as expected.

Course Content Overview

Course Overview: Total Modules: 8 Total Lessons: 30 Total Video Runtime: 4 hours, 30 minutes

Summary

This comprehensive course will equip you with the skills and knowledge to build modern full-stack applications using TypeScript, TailwindCSS, tRPC, and PostgreSQL. You will learn how to create a robust and scalable application architecture, from the backend data layer to the frontend UI.

PostgreSQLNodeJSKoaKnexReactTypeScripttRPCTailwind CSS

Our students work at

  • salesforce-seeklogo.com.svgintuit-seeklogo.com.svgAdobe.svgDisney.svgheroku-seeklogo.com.svgAT_and_T.svgvmware-seeklogo.com.svgmicrosoft-seeklogo.com.svgamazon-seeklogo.com.svg
sample bg image url

Sample Course Lessons

Course Syllabus and Content

This comprehensive course will equip you with the skills and knowledge to build modern full-stack applications using TypeScript, TailwindCSS, tRPC, and PostgreSQL. You will learn how to create a robust and scalable application architecture, from the backend data layer to the frontend UI.

Module 1

Introduction and Getting Started

7 Lessons1 Hours 5 Minutes

This module provides a walkthough of the setting and configuration so we’re ready to start building. This includes linting, code formatting, testing, npm workspaces, and build scripts. You will learn how to set up a frontend project with React and TailwindCSS, and a backend project with Koa. Finally, you will also set up Schemalint and Kanel to generate types and tRPC to act as the communication layer between backend and frontend.

Module 2

Analysis and Design

3 Lessons 10 Minutes

In this module you will learn how to analyze a problem, design data model and UI for it and how to drive the architecture from the two. You will also learn about the considerations when deciding how to architect a solution, how to enable the optimal user journey, and potential future scenarios while creating a suited data model.

Module 3

Modelling with advanced Postgres features

3 Lessons 27 Minutes

In this module you will learn how to use the Postgres range type and enforce data consistency directly in the database.

Module 4

Frontend UI

5 Lessons 52 Minutes

In this module you will build the UI that the customer is going to use usin Tailwind CSS. The flow will go through the process of booking a session with error handling.

Module 5

Endpoints

5 Lessons 44 Minutes

In this module, you will about designing API’s with tRPC and how to implement them. With the data model and UI as drivers, you will also learn which endpoints are required and how to implement them in tRPC.

Module 6

Testing

3 Lessons 42 Minutes

In this module, you will create unit tests of the frontend by mocking the tRPC endpoints using Vitest.

Module 7

Connecting The Dots

3 Lessons 51 Minutes

In this modele, you add some final touches to your app in the form of completing the Select Date page, creating the infrastructure for ranges, and completing the booking process.

Module 8

Conclusion and extra resources

1 Lesson 1 Minutes

In this module, you will learn about some additional resources realted to auth and security, DevOps, complex methods, and client side routing.

Subscribe for a Free Lesson

By subscribing to the newline newsletter, you will also receive weekly, hands-on tutorials and updates on upcoming courses in your inbox.

What Students are Saying

        Meet the Course Instructor

        Kristian Dupont

        Kristian Dupont

        Kristian Dupont is a full-stack developer at Invert. When Kristian is not writing code, he blogs on technology and produces music. With a career spanning over 25 years, Kristian has navigated the breadth of software development, from writing embedded C code for tiny processors to developing expansive SaaS products utilized globally. His journey through the ranks of professional development, team leadership, and CTO positions has equipped him with a deep understanding of the software industry's demands and nuances.

        Holding a degree in Computer Science and Neuropsychology from Copenhagen University, Kristian's academic background lays a solid foundation for his practical achievements. Notably, he is the creator of Kanel, an open-source tool designed to generate Typescript types from PostgreSQL schemas, which this course teaches you how to use.

        Kristian's approach to this course is informed by real-world challenges and solutions. His professional background ensures that students not only learn theoretical concepts but also gain insights into practical application, problem-solving, and industry best practices. This makes the course an invaluable opportunity for learners seeking to elevate their skills with guidance from a seasoned expert who has navigated the landscape of software development firsthand.

        Build robust and scalable full-stack applications with modern TypeScript, Tailwind CSS, and tRPC—enroll today!

        Master full-stack development with a single repository for everything!

        One-Time Purchase

        Fullstack Typescript with TailwindCSS and tRPC Using Modern Features of PostgreSQL

        $69$79$10.00 off
        Fullstack Typescript with TailwindCSS and tRPC Using Modern Features of PostgreSQL
        • Discord Community Access
        • Full Transcripts
        • Money Back Guarantee
        • Lifetime Access

        newline Pro Subscription

        $18/MO

        Get unlimited access to the course, plus 60+ newline books, guides and courses. Learn More

        Fullstack Typescript with TailwindCSS and tRPC Using Modern Features of PostgreSQL

        Billed annually or $40/mo billed monthly. Free to cancel anytime.

        • Discord Community Access
        • Full Transcripts
        • Money Back Guarantee
        • Lifetime Access

        Plus:

        • Unlimited access to 60+ newline Books, Guides and Courses
        • Interactive, Live Project Demos for Every newline Book, Guide and Course
        • Complete Project Source Code for Every newline Book, Guide and Course
        • Best Value 🏆

        Frequently Asked Questions

        What is Fullstack Typescript with TailwindCSS and tRPC Using Modern Features of PostgreSQL?

        Fullstack Typescript with TailwindCSS and tRPC Using Modern Features of PostgreSQL is a course that teaches how to set up a full-stack application using PostgreSQL, NodeJS, Koa, Knex, React, TypeScript, tRPC, and Tailwind CSS. The course focuses on creating a type-safe application with the database as the source of truth. The course consists of 8 modules, 30 lessons and 4,5 hours of video content.

        What are the prerequisites for this course?

        You should be familiar with TypeScript development, preferably both on the backend and the frontend, and basic knowledge of SQL. You will also need NodeJS installed, and either Postgres or Docker.

        Who is this course for?

        This course is for developers who want to learn how to build modern type-safe full-stack applications. The course is also beneficial for developers who want to learn how to use PostgreSQL as the database for their applications.

        What are the learning outcomes of this course?

        By the end of this course, you will be able to: Set up and configure a full-stack application, as well as design and implement a type-safe data model.

        What are the benefits of using this stack?

        It's mature and well-supported. The extra focus on type safety let's you iterate and change things with confidence. Furthermore, there is no framework that gets you going quickly but then becomes a burden when you need to do something it doesn't support. The architecture you will learn will be able to scale, both in terms of complexity and performance requirements, but also in terms of the number of developers working on it.

        What are the next steps after completing this course?

        After completing this course, you can start building your own full-stack applications using the skills you have learned.

        What if I don't like the course?

        We offer a 30-day money-back guarantee, so if you're not satisfied with the course, you can request a refund within 30 days of purchase by sending us a message.

        What is included in the course?

        This course includes 8 complete modules. It has 30 videos, totaling over 4hr and 30 mins runtime. You’ll have access to every lesson video, textual lesson content, downloadable project code files, interactive IDE, and AI Tutor.

        How long will it take to complete the course?

        The course offers flexibility, allowing you to learn at your own pace. Start, stop, re-watch anytime. It’s expected that you’d spend approximately 6-8 hours going through the entire course materials.

        Can I access the course on my mobile device?

        Yes, the course is fully responsive and can be accessed on your mobile device.

        Is there a certificate upon completion of the course?

        Yes, you can get a certificate by sending us a message.

        Can I download the course videos?

        No, the course videos cannot be downloaded, but they can be accessed online at any time.

        What is the price of the course?

        The course is currently priced at $69 USD. Alternatively, you can access the complete course as part of the "newline Pro subscription", which currently costs $18/month when billed annually.

        What if I need help?

        You can ask us questions anytime through the community Discord channel or by sending us a message.

        Newline Image

        Fullstack Typescript with TailwindCSS and tRPC Using Modern Features of PostgreSQL

        $69

        $79