Meteor and React for Realtime Apps

Master the fundamentals of Meteor and React with this tutorial as you develop secure, dynamic apps
4.7 (812 ratings) Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
3,768 students enrolled
$19
$140
86% off
Take This Course
  • Lectures 110
  • Length 9 hours
  • Skill Level All Levels
  • Languages English, captions
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 5/2016 English Closed captions available

Course Description

This is the tutorial you've been looking for to master building dynamic web apps with Meteor JS, with all the most important topics covered in great depth!

Authentication?  Covered.  Routing?  Of course!  Security? We got it.

Meteor JS can get you a position in web development or help you build that personal project you've been dreaming of.  Meteor is the ultimate framework for developer productivity; it is bar-none the fastest technology you can use to make fast and interactive web apps in just a few hours.

This course will get you up and running quickly, and teach you the core knowledge you need to deeply understand and build interesting apps with Meteor and React.

We'll start by mastering the fundamentals of React, including JSX, “props", “state", and eventing. Source code is provided for each lecture, so you will always stay up-to-date with the course pacing. After an introduction to React, we'll dive right in to Meteor, covering topics like Collections, Meteor Methods, Subscriptions, and Publications.

If you are new to Meteor or React, or if you've been working to learn it but sometimes feel like you still don't quite 'get it', this is the course for you! To learn Meteor you have to understand it.

  • Learn how to secure Meteor applications with enterprise-grade security.  Don't let your data leak!
  • Set up user authentication and permissions using Meteor's built-in auth system.
  • Use React to render your Meteor data; master the process of breaking down a complex component into many smaller, interchangeable components
  • Grasp the difference between "props" and "state" and when to use each
  • Develop complex applications that scale in complexity by mastering Meteor

I've built the course that I would have wanted to take when I was learning Meteor. A course that explains the concepts and how they're implemented in the best order for you to learn and deeply understand them.

What are the requirements?

  • You'll need a Mac or PC

What am I going to get from this course?

  • Create interactive web apps amazingly fast
  • Build amazing single page applications with Meteor and React JS
  • Master fundamental concepts behind structuring Meteor applications
  • Learn the true purpose of Meteor in a modern application
  • Be the engineer who explains how Meteor works to everyone else, because you know the fundamentals so well
  • Build and prototype interesting personal projects in a weekend

What is the target audience?

  • Programmers looking to learn Meteor
  • Engineers who have researched Meteor but have had trouble mastering some concepts
  • Web developers who are looking to build a full-stack web application
  • Entrepreneurs who want to make their own apps without relying on others

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

Section 1: The Basics of Any Meteor App
One Quick Item...
Preview
01:06
Link to All Code For This Course
Article
Installing Meteor
Preview
01:35
Purpose of Meteor Projects
Preview
05:28
Project Dependencies
Preview
07:06
React vs Meteor
Preview
04:41
3 questions

Let's get on the same page.

Section 2: A React Primer
Getting Something on the Screen
04:29
Importing React
04:23
Building a React Component
02:44
Meteor Startup
09:53
Project Overview and Challenges
06:15
Export Statements
06:12
Nesting Component
07:24
Working with Dummy Data
07:16
Building a List of Images
06:07
Communication with Props
06:55
Adding CSS in Components
08:33
Key Props
03:44
Image API Endpoint
04:15
AJAX with Axios
05:05
Class Based Components
05:33
Loading Data with Lifecycle Methods
03:47
State in Components
03:37
Implementing State
07:29
Recap on State
03:05
Passing Images as Props
03:26
Filtering Out Albums
04:13
Image Description
02:33
Upvotes and Downvotes
06:17
Implementing Image Score
02:23
Wrapup
02:30
Section 3: On to Meteor!
Directory Introduction
02:17
Challenges in this App
03:56
App Boilerplate
06:17
MongoDB Collections
03:00
Creating MongoDB Collections
04:25
Generating Data with Faker
05:53
Get Data with Collection Queries
04:18
Inserting Records into Collections
06:18
Reading Server Console Logs
01:13
Boilerplate for Employee List
03:29
Publications and Subscriptions
04:08
Publications with Cursors
05:09
Creating a Container
07:02
Publication and Subscription Review
05:09
Employee Detail Scaffolding
05:18
Styling Employee Details
04:54
More Styling and Bug Fixes
03:06
Flexbox Styling
06:08
Click Handlers
02:28
Updating Subscriptions
03:15
Refactoring from Functions to Classes
05:56
Fetching More Users
05:56
Section 4: Getting More Complex - Meteor Methods
Project Overview
03:56
Problems to Solve
04:55
Redirecting Short Links
03:39
Boilerplate Setup
04:35
Header Component Warmup
04:01
Links Collection
02:14
Link Create Component
05:43
Form Submit and Refs
05:16
The Insecure Package
08:05
Handling Data Securely
08:28
Safely Changing Data with Meteor Methods
06:34
Validating URLs
06:41
Graceful Error Handling
06:34
Generating Unique Tokens for URLs
03:57
A Publication for Links
06:33
Link List Table
08:02
Intercepting Requests with Meteor Middleware
02:43
Finding Tokens in URLs
09:01
Redirecting Users to Long Links
05:23
Redirecting Users to Long Links Continued
04:06
Updating Mongo Records
06:25
Wrapup
02:52
Section 5: Full Stack Development - Workspaces
Workspace Collaborator Overview
05:02
Project Challenges
03:27
Outlining Component Definitions
04:35
Bootstrapping an App
03:38
Scaffolding a Header
05:29
Authentication UI
06:51
Authenication UI Continued
07:25
Bins Collection
05:49
Insert Bins Method
07:41
Create Bin Button
05:37
Accessing Bins with Publications
03:49
Claiming Bins with Subscriptions
07:19
Rendering a List of Bins
02:45
Removing a Bin
05:54
Routing with React Router
05:29
More on React Router
05:34
Default Components with IndexRoutes
05:30
Accessing the URL with Route Params
02:44
Navigation with Link Tags
06:02

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Stephen Grider, Engineering Architect

Stephen Grider has been building complex Javascript front ends for top corporations in the San Francisco Bay Area. With an innate ability to simplify complex topics, Stephen has been mentoring engineers beginning their careers in software development for years, and has now expanded that experience onto Udemy, authoring the highest rated React course. He teaches on Udemy to share the knowledge he has gained with other software engineers. Invest in yourself by learning from Stephen's published courses.

Ready to start learning?
Take This Course