PROFESSIONAL10 Weeks

PROFESSIONAL

TypeScript, Secure Login, Databases and Testing

What you can do at the end

You can build a multi-user app with TypeScript, secure login, a well-designed database and automated tests, the way professional teams do.

How this course ends

A review session with a mentor. You explain how login and security work in your app, how the data is organised, and how the code is structured.

Overview

Professional teaches you to build software the way professional teams do. You build multi-user apps with user accounts, secure login and roles, a database designed to grow, and automated tests. You write TypeScript on both the frontend and the backend, and you go deeper with PostgreSQL using an ORM, migrations and indexes. You also learn to structure your code so that a team can work in it and reuse it.

Modules and topics covered

1Weeks 1–2: TypeScript and Reusable Logic

Professional teams use types to catch mistakes early. Reusable logic keeps your code clean as it grows.

Types, Interfaces & Unions
Typing React Props & State
Generics & Utility Types
Custom Hooks

2Weeks 3–4: Component Architecture and Server State

Good structure is the difference between code that works and code a team can work in. Good state management keeps your app fast.

Feature-Based Structure
Compound Components
State Colocation vs Lifting
useMemo & useCallback
Zustand & TanStack Query
Optimistic Updates

3Week 5: Styling, Motion and Accessibility

Users judge an app by how it looks and feels before they ever see your code.

Tailwind CSS
Framer Motion
Modals & Focus Trapping
Error Boundaries & Suspense
React Hook Form

4Weeks 6–8: A Layered Backend, SQL and Auth

A clean backend structure makes your app easy to grow. Secure login protects your users and their data.

Controller-Service-Repository Split
Async Error Handling & Zod
Prisma Migrations
The N+1 Query Problem
Composite Keys & Constraints
bcrypt & JWT Rotation
Role-Based Access Control

5Weeks 9–10: Testing and Your Final Project

Tests tell you that your code, and the code AI wrote for you, really works. Your final project brings everything together.

Unit & Integration Testing
Testing AI-Generated Code
Optimistic vs Pessimistic Locking
Final Project, Deployed

Technologies covered

TypeScriptReactZustandTanStack QueryTailwind CSSFramer MotionReact Hook FormPrismaPostgreSQLZodJWTbcryptVitestReact Testing LibraryPlaywrightDockerClaude CodeCursor Rules