Build Full-Stack E-Commerce App: SwiftUI, Node.js & Postgres

Explain why Node.js and Express are favored for back-end development, based on personal experience and familiarity, and show that mastering one framework eases learning others, including Vapor.

Install and set up the essential tools for full‑stack development: Xcode, Node.js, Postgres app, and Beekeeper Studio. Learn to run Postgres locally and visualize data with Beekeeper Studio.

Initialize the Postgres app, create and connect to Smart Shop DB, then use Beekeeper Studio to visualize the database and prepare for Sequelize migrations in Express.

Structure your full-stack project by separating client and server into distinct folders under one root, preventing deployment issues. Initialize the server with npm and prepare the SwiftUI client.

Explore a quick Express.js tour to set up a basic Node server, create a root route that returns Hello world, and manage dependencies with package.json and nodemon for auto restart.

Learn the basics of routes in express by creating root routes with app.get, sending responses, and exploring how dynamic routes manage multiple genres.

Explore dynamic routes in Express.js by using colon syntax to define dynamic parameters like genre and year, access them via request.params, and demonstrate string interpolation.

Learn to return json from express routes instead of plain strings by using response.json with objects and arrays. Build movie endpoints, filter by genre case-insensitively, and prepare for database integration.

Learn how to implement post requests in Express.js, handle JSON bodies with express.json middleware, and differentiate post from get routes using HTTP verbs with Thunder Client and Postman.

Create a user table with Sequelize ORM by generating a user model and migration, setting username and password fields, and applying migrations to a Postgres database.

Implement a server registration route in app.js using express.json to read a json body and create a user via the user model with username and password, with mvc coming next.

Undo a migration with Sequelize CLI, recreate the users table with a unique username constraint and not null values, then validate duplicates fail at the database level.

Validate user input with express-validator to ensure username and password are provided, collect and format errors for the client, and implement middleware that runs before the request reaches the route.

Prevent duplicate usernames by using models.user.findOne with a case-insensitive op iLike search, returning 'username taken' if found, and create the user otherwise; wrap in try-catch for 500 errors.

Learn to hash passwords with bcrypt js before saving to the database. Generate a salt with ten rounds, hash the password, and store the hash, using async/await for server endpoints.

Implement a stateless authentication controller in SwiftUI, wired to a simple HTTP client and a custom environment key for seamless login and register actions.

Build a generic http client that uses a resource, url, method, headers, and a model type to perform and decode requests for login, registration, and product data.

Implement the authentication controller's register function by building a username/password body, JSON encoding it, posting to the register URL via the HTTP client, and handling a register response with success.

Builds a SwiftUI registration screen with a username and password form, validating whitespace and enabling the register button, then calls an authentication controller asynchronously.

Explore the model view controller pattern, its components: model, view, and controller, and how MVC enables modular, scalable, and maintainable APIs using JSON, Node.js, and a SwiftUI front end.

Learn to implement an authentication router using express router, route api/auth to controllers, add validation middleware, and organize code with routes and controllers in a model-view-controller pattern.

Implement the authentication controller in a Node.js app using bcrypt, Sequelize models, and validation results to handle registration, export the register function, and wire routes.

Master jwt flow for authenticating users with json web tokens, stored securely in the client keychain. Send bearer tokens in request headers and let servers validate access to protected resources.

Implement a login route in express.js within authentication controller, validate input, verify the user with bcrypt, and sign a json web token containing the user id and username with expiry.

Test the login route with Postman, sending a JSON payload to api/auth/login and receiving a token, user id, and username. Learn to store the token in the keychain.

Design a login screen that talks to the authentication controller's login route, maps a login response, stores the token in keychain, and navigates to the dashboard on success.

Learn to persist tokens securely using a keychain wrapper in a SwiftUI login flow, saving token and user id with app storage and navigating to a home screen after login.

Learn to validate JWT expiration on the client side by decoding the token from the keychain and routing authenticated users to the home screen.

Move to a tab bar interface and protect routes by requiring login to access my products, cart, and profile; sign in, view protected screens, then sign out to re-authenticate.

Set up a tabbed SwiftUI interface with a home container and tabs for home, my products, cart, and profile, and introduce destination views and authentication guards.

Learn to protect screens for unauthenticated users using a requires authentication view modifier in SwiftUI, validating JWT tokens on the client and server, with login flow and token storage.

Update the Smart Shop app to use a home screen with tab views, remove token validation and navigation-based redirects, and implement an authentication viewmodifier to protect screens.

Create a product table on the server using Sequelize CLI and migration, defining name, description, price, photo URL, and a user foreign key to support product uploads.

Define a product router and controller to handle api/products, implement get all products, wire the router to the product controller, and register the route in app.js for testing with Postman.

Implement the get all products endpoint by querying the product model with find all to return a JSON array, after seeding SQLite data and setting up static uploads for images.

Display a product list on the home screen using a product store that fetches products via HTTP and maps them to a product model, rendering images in a cell view.

Expose a create action in the product controller, validate the request with a product validator, extract name, description, price, photo url, and user id, then create and return the product.

Implement adding a new product on the SwiftUI client by posting to create product, encoding the product, handling the create product response, and updating the user's my products list.

Add and manage products in a SwiftUI app with a my product list screen and an add product screen. Save via a shared product store.

Update the SwiftUI client to Xcode 16 and Swift 6, fix concurrency and main actor isolation, target iOS 18, and address image picker crash issues for a full-stack app.

Fix photo picker issues in iOS 18 and Xcode 16 by using SwiftUI's task view modifier to load the selected photo item's transferable data asynchronously and update the UI.