React JS + Angular + Rails 5 Bootcamp

React JS + Angular + Rails 5 Bootcamp, available at $84.99, has an average rating of 3.9, with 80 lectures, based on 830 reviews, and has 5027 subscribers.

You will learn about Build Angular and React applications from scratch Integrate Angular and React applications with multiple Ruby on Rails APIs Implement features such as: routing, data binding, data updates without a page refresh, and more! Build React JS applications Integrate authentication between a Ruby on Rails API and JavaScript framework front end This course is ideal for individuals who are This course is for developers who want to learn how to build real world front end applications with frameworks such as Angular and React JS that run on Ruby on Rails backend APIs It is particularly useful for This course is for developers who want to learn how to build real world front end applications with frameworks such as Angular and React JS that run on Ruby on Rails backend APIs.

Enroll now: React JS + Angular + Rails 5 Bootcamp

Summary

Title: React JS + Angular + Rails 5 Bootcamp

Price: $84.99

Average Rating: 3.9

Number of Lectures: 80

Number of Published Lectures: 80

Number of Curriculum Items: 80

Number of Published Curriculum Objects: 80

Original Price: $129.99

Quality Status: approved

Status: Live

What You Will Learn

Build Angular and React applications from scratch

Integrate Angular and React applications with multiple Ruby on Rails APIs

Implement features such as: routing, data binding, data updates without a page refresh, and more!

Build React JS applications

Integrate authentication between a Ruby on Rails API and JavaScript framework front end

Who Should Attend

This course is for developers who want to learn how to build real world front end applications with frameworks such as Angular and React JS that run on Ruby on Rails backend APIs

Target Audiences

This course is for developers who want to learn how to build real world front end applications with frameworks such as Angular and React JS that run on Ruby on Rails backend APIs

May 2021 Course Update! Added a new section of live coding workshops, including a deep dive on how to work with React hooks

Are you ready to build professional applications that combine the front end frameworks, such as React JS and Angular with Ruby on Rails as a backend? Then this is the course for you. My name is Jordan Hudgens, and I’ll be your instructor for the course. In addition to being the lead instructor for devCamp I’ve also been building web applications for over a decade for organizations such as Eventbrite and Quip.

After you have completed this course you will be able to build modern React JS, Angular, and Ruby on Rails 5 applications. In fact, in this course we’re going to develop several applications that highlight the powerful and dynamic features offered by front end frameworks such as React JS and Angular working as the user interfaces, and Ruby on Rails API apps functioning as the backend. This is a powerful combination since you will learn how to create incredibly fast, dynamic React JS and Angular applications that embrace features such as real time updates, along with the power and flexibility provided by the Ruby on Rails framework.

Throughout the course material you will learn concepts such as:

How to configure your system to run Angular and React JS Applications

How to generate an Angular applications

How to generate React JS applications

What it takes to build React and Angular components

How to work with Angular Observables to automatically update page elements without even needing to refresh the page.

Along with how to communicate with APIs and parse the data they return.

How to integrate authentication from scratch with session based auth

And everything else you’ll need in order to build real world React JS and Angular applications, with a Ruby on Rails API!

This is not an entry level course. You will need at least a basic understanding of Rails in order to go through this material. Additionally, I also recommend that you are familiar with the TypeScript and JavaScript programming languages, however if you haven’t worked with TypeScript or JavaScript before, you can still work through the course.

Each lesson of the course is paired with the source code that I used in the guide so you can check your work. And since the application we’re building is a real world app I’ll constantly be adding to the course material with new features, as I do with my other courses.

Please feel free to review the course curriculum and I look forward to going through the material with you on your development journey!

Course Curriculum

Chapter 1: Project Introduction

Lecture 1: The Angular + Rails Application Were Going to Build

Lecture 2: Application Architecture for an Angular + Rails Application

Lecture 3: Monolith vs Microservice Architecture Deep Dive

Lecture 4: The Role of Services in Microservice Architecture

Lecture 5: The Role of Components in Microservices

Chapter 2: System configuration for Angular 2 Application

Lecture 1: Configuring a System to Run Angular 2 Applications

Lecture 2: Generating an Angular 2 Application from Scratch

Chapter 3: Angular 2 Development

Lecture 1: Hello Angular 2

Lecture 2: Working with Browser Sync

Lecture 3: Creating the App Component

Lecture 4: Introduction to Angular 2 Routing

Lecture 5: How to Create View Files in Angular 2

Chapter 4: Building the Document Management Component

Lecture 1: Create a Document Management Component

Lecture 2: Creating Links Between Pages in Angular

Lecture 3: Creating an Angular Interface to Model Data

Lecture 4: Creating Mock Data in an Angular 2 Application

Lecture 5: How to Access Component Data from an Angular View Template

Chapter 5: Building the Proposal Component

Lecture 1: Creating the Initial Proposal Component

Lecture 2: Creating an Angular 2 Data Model for Proposals

Lecture 3: Populating an Angular List View with Data

Lecture 4: Building an Angular 2 Component that will Create New Proposals

Lecture 5: Introduction to Angular 2 Forms

Lecture 6: Completing the Angular Proposal Form

Lecture 7: How to Implement Dynamic Data Validations in Angular 2

Lecture 8: Creating Dynamic Routes in Angular 2 Based on an ID Lookup

Lecture 9: How to Trigger Active Classes in Angular 2 Views

Chapter 6: Integrating Bootstrap 4 in an Angular 2 Application

Lecture 1: Installing Bootstrap 4 into an Angular 2 Application with ng-bootstrap

Lecture 2: How to Set Universal Styles in an Angular 2 Application

Lecture 3: Creating a Bootstrap 4 Navigation Bar

Lecture 4: How to Dynamically Add CSS Classes in an Angular 2 View

Lecture 5: Using Bootstrap Cards in an Angular Application

Lecture 6: Creating Angular 2 Component Specific CSS Files

Lecture 7: Setting Additional Global Styles for All Application Components in Angular 2

Lecture 8: How to Override the Default Bootstrap 4 Navigation Styles

Lecture 9: Adding Styles to an Angular 2 Form

Lecture 10: How to Style Dynamic Validation Messages in Angular 2

Lecture 11: How to Style Form Inputs with Bootstrap 4 Styles

Lecture 12: How to Integrate the List Group Component Styles in Angular 2

Lecture 13: How to Work with Angular 2 Pipes to Format Currencies

Lecture 14: Final Style Changes to Angular Application

Lecture 15: How to Add a Custom Font to an Angular 2 Application

Chapter 7: Creating a Ruby on Rails Microservice to Manage Documents

Lecture 1: Generating a Rails 5 API Application from Scratch

Lecture 2: How to Generate Data in a Rails 5 Application

Lecture 3: How to Configure the Network Settings for a Rails API App

Chapter 8: Connecting the Angular Front End with the Rails Document API App

Lecture 1: Creating an Angular 2 Service for Managing API Data

Lecture 2: Introduction to Angular 2 Observables

Lecture 3: How to Render API Data in an Angular 2 Application

Lecture 4: Analyzing Real Time Data Updates with an Angular + Rails System

Lecture 5: Final Style Changes to Angular 2 Document Component

Chapter 9: Creating the Proposal Ruby on Rails Microservice API Application

Lecture 1: Building a Rails 5 API Microservice

Lecture 2: Using the Seeds File to Create Sample Data in a Rails 5 API App

Chapter 10: Connecting the Angular 2 App with the Rails Proposal Microservice

Lecture 1: Using an Angular 2 Observable to Stream Live Data for the Proposal List Componen

Lecture 2: How to Implement an Angular 2 Show Page Component with API Data

Lecture 3: How to Build a Custom Link Function in an Angular 2 Component

Lecture 4: Creating an Angular 2 Form Submit Button

Lecture 5: How to Create New Records in a Rails API from an Angular App

Chapter 11: Final Application Changes

Lecture 1: How to Add Dynamic Notifications in an Angular 2 Application

Lecture 2: Adding Final Style Changes to the Proposal Show Component

Lecture 3: How to Trigger Sending Emails from the Rails Microservice

Lecture 4: Angular 2 + Rails 5 Bootcamp Course Summary

Chapter 12: Creating the React JS Application

Lecture 1: How to Generate a React Application with TypeScript, Webpack, Babel and Scss

Lecture 2: Deep Dive: Routing in React

Lecture 3: How to Access the URL Params in React with the useParams Hook

Lecture 4: How to Iterate Over Arrays and Nested Arrays in React

Lecture 5: Build an Animated Sliding Pane Modal in React

Lecture 6: Combining the useEffect and useState React Hooks to Store and Manage Data

Lecture 7: Creating a Dedicated Sliding Pane Component in a Separate File

Lecture 8: How to Work with Forms in a React JS Application

Chapter 13: Live Deep Dive Coding Workshops

Lecture 1: Create a Custom React Hook to Add Responsive Features to an Application

Chapter 14: React + Rails Authentication

Lecture 1: Section Introduction

Lecture 2: Ruby on Rails App Creation and Initial Configuration

Lecture 3: Building the User Model and Session Controller for the Rails API Authentication

Lecture 4: Implementing the Registration Controller and Final Authentication Features

Lecture 5: Configuring the Rails API Session Store to Work in All Environments

Lecture 6: Generating and Configuring the React JS Authentication Application

Lecture 7: Building the React Registration Component

Lecture 8: React JS Render Props for Managing the Logged In State and Redirecting Users

Lecture 9: Building the Login Component in React JS

Lecture 10: How to Check if a User is Logged In with React

Lecture 11: Implementing the Logout Functionality in React

Instructors

Jordan Hudgens
CTO at Bottega Code School

Rating Distribution

1 stars: 8 votes

2 stars: 10 votes

3 stars: 54 votes

4 stars: 250 votes

5 stars: 508 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!