Node with React: Build & Deploy a Fullstack Web Application

Build a fullstack API with Node.js and TypeScript, using MongoDB as database and Redis for in-memory caching and queues, deployed on AWS with Terraform and CircleCI, staging, development, and production.

Develop a fullstack app with authentication (signup, sign-in, sign-out, password reset via cookies and tokens) plus chat, posts, comments, reactions, images, and notifications, plus user profiles and follow features.

Set up projects and server, use TypeScript for input paths, configure prettier, install modules, add build scripts, and implement security, standard, and routes middleware with a global arrow handler.

Create and configure a backend project with Node.js, using npm init to generate package.json, switch main to app.js, install TypeScript, and generate tsconfig.json for a TypeScript backend.

Copy and paste a ready tsconfig.json, then adjust compiler options such as target, module, and rootDir. Set the root to source, define outDir, and enable node module resolution.

Discover a practical folder structure for a Node with React fullstack app, including features, shared, services (MongoDB, Redis, email, queues), sockets, workers, and setup scripts for server and database.

Set up an Express server by creating a chatty server class with a constructor and middleware, including security and standard routes, to start the HTTP server and sockets.

Install and configure security and standard middleware for Express app using helmet, cookie-session, compression, express-async-errors; set up cookies, origin handling, credentials, and error handling to enable fullstack web app deployment.

Set up a node http server for the fullstack app, configure ports, and integrate the express app. Add try/catch and console log, then create a dev script for automatic reload.

Install a dev dependency to run the http server locally, start the server on port 3000, and adjust TypeScript imports to absolute paths for reliable builds.

Install mongoose, set up a default database connection with Mongoose.connect to a local MongoDB instance, export the connection as a default function, and log the server running on port 5000.

Set up a config class with dot emv for environment variables, validate them at startup, and export a reusable config instance for a Node with React app.

Centralize environment variables with a config module, import it in the server setup, and define secret keys, node environment, and database URL; test behavior when EMV values are missing.

Set up socket.io with redis adapter to enable cross-process communication, configure redis hosts, create pub/sub clients, and wire the adapter into the server for scalable real-time messaging.

Define a default anonymous routes function by importing application from express, then assign it as a routes method. Wire the routes into the setup server using app.use for API routes.

Build a global error handler in an Express app by creating a custom arrow class, TypeScript interfaces, and serialized http status error responses for client messages.

Install the npm logging library and create a named logger with a chosen level. Replace console logs with log.info, log.debug, and log.error, and configure optional streams or file outputs.

Learn to set up eslint alongside editorconfig and prettier for a consistent coding style, including configuring VS Code extensions, dot editor config, and npm lint scripts.

Learn to create and push a GitHub repository, configure .gitignore, rename master to main, and set up develop, staging, and main branches for a fullstack workflow.

Install TypeScript and the transform paths plugin, configure compiler options and paths for shared and feature folders to enable absolute imports and build-time path transformation.

Add a build script to the package.json and show building from TypeScript to JavaScript with CSC and then tsc after installing TypeScript libraries.

Update dependencies in the chatty backend by upgrading libraries and replacing billboard UI with billboard express, installing bull MQ, updating base queue imports, and running npm install.

Update dependencies in package.json, replacing the bull board adapter with bull board express. Switch from typescript alias paths to tsc alias and adjust the build script to output relative paths.

Build authentication with sign up, sign in, sign out, and get current user controllers; integrate Redis cache and MongoDB, set up Redis client and a message queue, tested in Xcode.

Learn how a fullstack app routes data from a React frontend through a Node backend using Redis as cache and MongoDB as storage, with a Redis-based queue and socket.io updates.

Explore Redis data types including strings, lists, sets, hashes, and sorted sets, and learn core commands like lpush, lrange, lindex, zadd, hset, and hincrby.

Set up Cloudinary in a Node.js app to upload images, configure cloud name, api key, and secret, and implement uploads with the v2 uploader and optional public id handling.

Install joi, create the auth feature folders, define sign up, sign in, and password schemes with joi validation, and implement a typescript decorator to enforce validations on the request body.

Create a TypeScript decorator to validate request bodies with a Joi schema, wiring it into controllers and handling joy request validation errors.

Create type-safe auth interface and MongoDB user model, extending Express requests with current user (uid, email, username, avatar color), and implement password hashing and a transform to delete the password.

Build a signup workflow with a sign up controller, validate input, create a user in MongoDB, and generate a json web token stored in a cookie session.

Validate signup by checking username or email uniqueness, generate object IDs, uppercase username first letter and lowercase email, map signup data, and upload avatar with a stable public ID.

Define authentication routes with an express router, exposing signup and signin endpoints under api/v1 and validate inputs, then test using a rest client and http endpoint files.

Define user interfaces and a MongoDB schema, and outline Redis-backed authentication data, preparing for the sign-up create method to save user documents in MongoDB and auth data in Redis.

Set up a Redis base class in the shared services, create a Redis client with config-driven host, and auto-connect on startup to power cache subclasses like the user cache.

Cache user data in Redis by building a user cache class and implementing save user to cache with Redis sets and sorted sets, prioritizing posts and profile data over notifications.

Save user to Redis cache – part 2 shows creating or reusing a Redis connection, converting properties to strings, and saving user data with Redis sets.

Learn to save and retrieve user data in Redis using sorted sets, sets, and hashes, set up with Redis Commander for development, including cloud name and image upload URL handling.

Set up a base queue with a job manager to send data to MongoDB via workers, using a cache for initial saves, and monitor with a dashboard UI.

Build a base queue using bull adapters with express, add jobs with retry and a 5-second backoff, and process them with configurable concurrency, while viewing queues on a dashboard.

Build a bull-based worker to process add-to-db jobs from the auth queue, extract data, save to the database, and report 100% progress with error handling.

Add a JSON web token to the session using the cookie session module, signing user id, email, username, and avatar to create a sign up token for authenticated requests.

Validate user data, check for existing users, create user with IDs, upload avatar, cache the user, store in MongoDB, generate a session token, and test endpoints with Compass.

Implement the sign in feature with a sign in controller that validates username and password, fetches the user by username, and returns a jwt token on success.

Fix login bug by updating the sign in flow to use the actual user data for the jwt, and add a helper to fetch user by the ods id.

Update login and signup to return user document to the client, using the spread operator to combine user fields with underscore id, username, email, password, avatar, uid, and created at.

Implement a dedicated sign-out controller using a cookie session to clear the user and token, and return a 'log out successful' message. Require authentication for sign-out via a dedicated route.

Implement a controller that fetches user data from the Redis cache using hgetall and converts stringified fields back to their original types with a json parse helper.

Implement a get user by id method using MongoDB aggregate, casting the id to a MongoDB ObjectId, and lookup to the odds collection to return user data.

Learn to fetch a user by id from MongoDB using aggregate. Convert the string to an object id, apply lookup and unwind, and project fields to include or exclude properties.

Create a current user controller that fetches the user from cache or MongoDB, validates keys, and returns a token-backed user object for authenticated requests.

Develop two authentication middleware methods that verify the JWT token and check a current user on protected routes to enforce login and secure the application.

Merge the feature branch into develop by pushing code and creating a pull request. Review authentication flows and note that password reset will be implemented in the next section.

Implement a password reset flow with email links and confirmation email, set up mail transports, email queues, and unit tests for controllers like sign up, sign out, and current user.

Set up a mail transport class using nodemailer for local development and sendgrid for production, with environment variables and a unified send email method for password reset workflows.

Test the development email sender with a mail transports class, using ethereal smtp credentials, and verify the signing API sends a test email while handling invalid login errors.

Implement an email queue and worker in a Node with React fullstack app, building a typed email queue and worker, templates for forgot/reset password, and a password reset controller.

Create forgot password and reset password templates in a templates directory. Render them with Edge, read files with fs, and inject username, reset link, and image URL.

Test and validate forgot password and reset password templates by sending reset links with tokens, passing template params, and queuing email jobs, then preview password reset confirmation emails.

Build a forgot password flow by adding a password controller, generating a crypto reset token, updating expiry, and sending a forgot password email via a route and template.

Implement a token-based reset password flow by validating the reset token, updating the user's password, clearing token fields, and sending a confirmation email via a reset password template.

Set up Jest unit tests for a Node.js app, focusing on controller methods in a TypeScript configuration; install Jest as a dev dependency and enable 100% coverage.

Configure a unit test script for a Node with React project, specifying coverage, worker limits, force exits, detect open handles, and watch options via npm run tests.

Mock the signup controller unit tests by creating request and response mocks and canned data. Avoid database calls and focus on testing controller logic and error handling.

Develop the signup unit test by mocking the queue and cache and avoiding redis calls, validating that the signup controller throws a custom error when the username is missing.

Explore signup unit tests—part 2—including username length validation, email format checks, and password rules, plus handling existing users with unauthorized responses and mock spying techniques.

Clear mocks and reset test state using before each hook and after each hook, including fake timers, to ensure reliable sign-up tests in a fullstack Node with React app.

Add and run sign-in unit tests for the login flow, validating username and password constraints, mocking database calls, and confirming proper errors or a jwt on success.

Demonstrates password reset and logout unit tests for a node with react app, covering valid/invalid credentials, email queue, json responses, 200 status, password update, token expiry, and sign-out behavior.

Develop unit tests for the current user in a Node with React fullstack app, covering no user (no token) and existing user (JWT token and user data) with mocks.

Build and deploy a fullstack web app by implementing password reset with mail transports, email queue, and worker, plus controller methods and unit tests, then push and merge code.

Explore building and deploying a fullstack post feature by creating, deleting, updating, and retrieving posts from Redis and MongoDB, with pagination, services, workers, and unit tests.

Create a post feature with a structured folder setup, and implement a post interface and schema using Mongoose, including reactions, user details, image attachments, created at and privacy fields.

Define post validation schemes with Joi to support posts with and without images, using optional fields and defaults, and validate a base64 image while handling empty strings gracefully.

Create a socket io based post handler by setting up the server connection, building a posts sockets class, and emitting or listening to real-time post events from the controller.

Create a post controller method to handle posts with or without images, validate input via a post schema, build a post object, and prepare saving to database and Redis.

Create a post cache class to save posts in Redis as a hash, stringify reactions, and update the user's post count using multi to execute commands.

Learn to save posts to a Redis cache with a multi method, implement authenticated post routes, and examine Redis sorted sets and hashes used for posts.

employ socket io to emit add post events, export the emitter, and decide whether to emit before or after saving posts to the Redis cache.

Learn to implement a post queue and worker that saves posts to the database, updates the Redis cache, and increments user post counts via a post service and controller.

Create a post with image by duplicating the creator function and adding a 64 encoded image property. Save uploads to the image collection and the image queue.

add unit tests for posts by creating mocks, wiring the post server, and validating create post responses and image upload error paths with 201 status.

Create a get posts from cache controller that uses Redis Z range on sorted sets, multi and hash get all to fetch post hashes, enabling pagination.

Learn to fetch all posts and per-user posts from Redis cache, count total posts using zcard and zcounts, and filter by image properties, before transitioning to MongoDB retrieval.

Add MongoDB post queries to the post service by implementing an aggregate method with skip, limit, and sort. Implement a post count method to return total documents.

Build a get posts controller that fetches posts from Redis cache or MongoDB using skip and limit with a page size of ten, sorting by created date descending.

Add two new routes for posts: get all posts and get images, with a page parameter, test the endpoints, and compare cache versus mongoDB results for the stream view.

Add unit tests for the guest posts, validating cache retrieval and database fallback, mocking empty results for cache misses, covering posts with and without images, and running the tests.

Learn to delete a post from the Redis cache by removing it from the post set and hash, updating post counts, and coordinating these actions with a multi.exec workflow.

Add a delete posts unit test to the controller tests, using mocks for image and cache. Verify the delete event uses the post id and returns status 200 with json.

Learn to update a post in Redis cache using a post id key, modify fields like background color, image, text, feelings, and privacy, and return the updated post to clients.

Update the post cache by converting data to an object and looping with object.entries to update each field with its value using redis hset (key, field, value) node-redis API.

Learn to implement an update post workflow in MongoDB: update by id with $set, refresh the cache, queue a worker, and return the updated post to the client.

Create and test an update post with image controller that updates posts with existing or replaced images, and adds images to posts, syncing image data to cache and the database.

Develop and validate the update post controller by writing unit tests that mock dependencies, verify post update and image handling, and ensure correct responses and cache updates.

Push code for the post feature of a Node with React fullstack app, including create, read, update, delete, image upload, gif URL, and pagination, via a pull request to develop.

Fix a tsconfig issue by changing the root from source to dots to include dot config and dot css in the build, then run npm run build.

Build a reactions feature by creating controllers, interfaces, models, roots, and schemes, and implement a Redis cache backed list with lpush, lrange, and llen alongside a dedicated reaction service.

Implement a single reaction per user on posts by checking existing reactions, replacing them when needed, and updating the frontend to show the chosen reaction (like, love, angry, sad, happy).

Implement the post reactions feature by creating a feature branch and a reactions directory with interfaces, models, routes, and schemes for MongoDB via mongoose.

Create a reactions cache and save post reactions in Redis cache by checking connection, using lpush to store stringified reactions, removing prior reactions, and updating the post's reactions field.

Learn to remove a user's previous post reaction from a Redis cache by retrieving reactions with lrange, finding the target, removing it with lrem, and updating the post reactions.

Add a post reaction controller with input validation, creating a reaction object from user id, post id, and previous reactions, then save to the reaction cache.

Fix the add reaction issue by correcting the pass JSON usage on the client, ensuring previous and new reactions return properly and update based on client-sent data.

Learn how to add reaction data to MongoDB by replacing or creating reaction documents with replaceOne, update post reaction counts, fetch user data from cache, and plan notifications later.

Implement a reaction system by adding remove-reaction logic, building a reaction queue and worker, and updating posts and cache counts as reactions are added or removed.

Fix add reaction to MongoDB issue by removing the client-supplied id with lodash omit, allowing MongoDB to generate the id, and replacing reactions to reflect updated state.

Develop and deploy a remove reaction controller that deletes a user's reaction from cache and database via a delete route, updating post reactions and request handling.

Write unit tests for add and remove reactions using mocks for request, response, and reaction cache, verifying correct status and expected messages.

Get post reactions from Redis cache by implementing methods to fetch all reactions for a post and a single reaction by username, with optional pagination and MongoDB fallback.

Update the redis hset method in the reactions cache by using key, field, and value, aligning with the latest node-red library version.

Implement three MongoDB database service methods to fetch post reactions: all reactions for a post, a single post reaction by username, and all reactions by username.

Create a get reactions controller to fetch all reactions for a post, using Redis cache first, then the database; include single reaction by username and reactions by username.

Develop and test get reactions routes in a Node with React fullstack app, implementing routes for all reactions by post and single or username-based reactions, using database and cache data.

Develop a get reactions controller unit test that validates cache-first and database fallback logic, mocking cache and database calls to ensure correct json responses, counts, and empty results.

Push your feature branch to GitHub, create a pull request to merge reactions into develop, and prepare to implement the comments feature.

Build a comments feature by creating controllers, models, routes, and schemes with Redis cache and MongoDB storage, including a comments queue and worker, and unit tests for retrieval.

Implement a comments feature by creating interfaces, models, schemas, and routes, then progressively add Redis cache methods, services, and finally controllers.

Cache post comments in Redis using a list under a post-id key, update the post's comment count in the hash, and retrieve comments with lrange and JSON stringify and parse.

Implement redis cache methods to fetch the names and count of users who commented on a post, and to retrieve a single comment from cache.

Update the Redis hset method to pass a field and value for the comment cache, replacing list-based updates and enabling a loop for multiple values.

Listen for client 'reaction' and 'comment' events using socket.io, emit updates to all connected clients for reactions and comments, and integrate a posts socket handler with the server setup.

Create a comments service with methods to add comments to the db. Update post comment counts, fetch post comments with Mongo aggregates, and use user cache data for notifications.

Implement a MongoDB aggregation to fetch post comment names and total count. Leverage match, group, addToSet, sum, and project to return a names list and an accounts count.

Set up a comments queue and worker to handle add comments, saving data via the comment service to the database, and create a comment controller to save and retrieve comments.

Implement an add comment controller by building and validating a comment schema, constructing comment data with post ID and user details, caching, and enqueueing a database job for persistence.

Develop a get comments controller to fetch all comments, comment names, and a single comment by post ID, using a cache-first approach and routes for testing.

Test and demonstrate a post comments feature with a comment controller and get comments controller, using the post/comments endpoint to add comments, increment counts, and retrieve single or multiple comments.

Write unit tests for the comments controller, covering add and get comments with cache and database checks. Use spies and fake timers; run npm run tests to verify.

Implement the follow and block features in a fullstack app by building controllers, interfaces, models, and routes, testing them, and managing data in cache and database.

Explore building a followers feature in a Node with React fullstack app, including a follower interface and a MongoDB-based schema with follow, unfollow, block/unblock, and aggregate lookup usage.

Implement followers and following data structure in MongoDB and Redis cache using a Mongoose schema with id, followerId, followingId, created, and top-level user-id subkeys holding arrays of IDs.

Learn to store followers and following in a redis cache by creating save, update, and remove methods, using lpush, lrem, and hash increments to manage counts.

Implement the add follower controller, update follower and following counts in the cache, fetch cached user data, and prepare a socket io response to the client.

Create a follower socket handler to manage follow and unfollow events, update the Redis cache, and emit client events. Add a /user/follow/:follower_id put route to queue and persist data.

Add a follower service to create follower documents in the followers collection with ObjectId casting and update both users' follower and following counts using MongoDB bulk writes.

Build a remove follower from db function that deletes the follower document from the followers collection and decrements following and follower counts, using object ids and a queue-driven worker.

Develop an unfollow user controller that removes follows from cache, updates follower counts, and exposes routes for follow and unfollow actions via a queue-driven worker.

Learn to implement and unit test the follow and unfollow user controller in a Node with React fullstack app, using mocks, cache updates, and database verification.

Implement a get followers controller that retrieves follower and following IDs from redis cache with lrange, fetches user data from the cache, and returns a list of IFollowData.

Fixes an auth data retrieval bug by aligning cache keys and database IDs, switching to user IDs for cache, and ensuring proper return-value handling to reliably fetch followers and followings.

Build two MongoDB aggregate methods to fetch a user's followers and followings by matching follower and following IDs, enriching results with avatar, username, and post counts through lookups and addFields.

Create a get followers controller to fetch the current user's following data and a target user's followers using a cache-first approach with mongoose IDs and routes /user/following and /user/followers.

Implement a block and unblock feature by updating a redis hash with blocked and blocked by user IDs, surface in the app to block messages and posts.

Update the set method in the follower cache to accept three properties: key, field, and value, replacing the previous list-based approach to resolve errors.

Block user MongoDB method demonstrates implementing the block feature by updating the user document with blocked and blocked by fields, using update one, push, and pull operators with object IDs.

Implement block and unblock user controllers with add block user and block user jobs, update follower cache entries for blocked and blocked by, and expose put routes.

Add a socket.io user handler for the block feature by creating a user socket, listening for block events, and emitting block data back to the client.

Push code to GitHub by adding unit tests for follow and block features, describing and running tests for user following and blocking, committing changes, and merging into the develop branch.

Implement the notifications feature for email and in-app alerts, honoring user notification settings from the settings page; wire the comment and reaction services with templates and the email job.

Set up a MongoDB-based notification system (no Redis data) with controllers, interfaces, models, and routes. Implement in-app notifications via Socket.IO and email notifications using the existing email service and templates.

Define a notification insertion method on the Mongoose notification schema to save new notifications. Retrieve user notifications using the notification service with aggregates, lookups, and the project operator.

Implement a notification workflow by creating documents for comments, follows, and reactions, using the notification model and post IDs. Check user cache toggles and avoid self-notifications.

Set up a notification object, a socketIO handler, a notification template, and the insert notification job to emit userId-specific notifications to the client.

Implement notification templates with the Edge's template engine to send comment emails and socket notifications. Define username, header, and message, then test by posting comments.

Add followers notification mirrors the comments notification by wiring a follow event to the notification and email system, including creating a follows type, inserting notifications, and reusing email templates.

Add reactions notification to the reactions service by updating reaction handling, validating the sender, and constructing notification objects for post updates and email delivery.

Learn to add update and delete notification operations in the database using Mongoose, including setting the red flag to true when read, and wiring a queue-driven notification worker and controllers.

Implement update and delete notification controllers, add routes, and retrieve notifications using socket.io for a fullstack Node with React course.

Add a guest get notifications controller that uses the notification service to fetch the current user's notifications via a /notifications get route, returning user-specific results.

Demonstrates unit tests for the notification controller, mocking the notification service to verify get notifications, updates, and delete flows, along with notification marks, socket io spies, and client json responses.