Building Rails app with Wistia and Heroku for Newbies
4.2 (70 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.
7,143 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Building Rails app with Wistia and Heroku for Newbies to your Wishlist.

Add to Wishlist

Building Rails app with Wistia and Heroku for Newbies

In this project, I will walk you through steps of how to create a simple online education web application.
4.2 (70 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.
7,143 students enrolled
Created by Leo Trieu
Last updated 7/2017
English
English [Auto-generated]
Price: Free
Includes:
  • 1.5 hours on-demand video
  • 5 Articles
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Ruby on Rails with practical code & design
  • Understand how MVC Model works in Rails.
  • Work with Wistia Video APIs.
  • Design your web app with Material Design.
  • How to embed Twitter Widget into your website to get more social engagements
  • Get Google Map API into your website
  • Go Live with Heroku to share your work with this world
View Curriculum
Requirements
  • All you need is just a little bit of HTML and programming knowledge but if you don't, that is not a problem
Description

This comprehensive, step-by-step course will teach you basic steps of how to build a Rails app with understanding of MVC model and host it on Heroku. After completing the course, you will be able to create a basic Rails app even you're newbies.

Within just 1.5 hour of videos, "Building Rails app with Wistia and Heroku for Newbies" will give you the skills set you need to start off your Rail world quickly without much knowledge required.

With easy to follow, step-by-step videos, this course will give you an easy and quick way to start your learning curve with Ruby on Rails and build something real, this including;

  • Learn how to quickly build a web application without much knowledge required
  • The structure is very easy to follow and you create from empty folder
  • Learn Ruby on Rails with practical code & design
  • Learn how MVC model work in Rails
  • Learn how work with Wistia Video APIs
  • Learn how to design your web app with Material Design
  • Learn how to embed Twitter Widget and Google Map API into your website
  • Go Live with Heroku to share your work with this world
Who is the target audience?
  • This course would be ideal for who front-end designers, founders or even newbies who want to learn Ruby on Rails as a first stage to start creating a platform for their startup
Students Who Viewed This Course Also Viewed
Curriculum For This Course
21 Lectures
01:44:46
+
*** Free GIFT for who joined this course ***
1 Lecture 00:43
You really should NOT miss this...
00:43
+
Task 1 - Starter
2 Lectures 04:46
About Me
01:32

Welcome to my HERO course, version for newbies and beginners. In this course, you will be learning how to build a simple version of Code4Startup with Ruby on Rails and Wistia APIs.

What is Ruby on Rails?
Ruby on Rails is a web development framework written in the Ruby programming language and it is one of the most powerful and popular tools for building dynamic web applications.
Rails is used by big companies like AirBnb, GitHub, Kickstarter and Twitter.

Why do so many startups use RoR?
First, Rails is 100% open source so anyone can use it at no cost at all.

Second, Rails has a huge community with hundreds of open-source contributors and a large number of gems ( gems are sort of plugins that add great benefits to the application. For example, if your application needs an authentication system to manage users, then you don't have to create that from scratch. Instead, you're going to use a gem called Devise and integrate it into your application easily and quickly)

Third, you can build up your application rapidly with Rails and therefore the time to market would be cut down significantly. This is especially effective for startups in early stage when they want to validate their ideas as soon as possible with an MVP or prototype before investing heavily on that product.

Meet your new friend, Ruby on Rails
03:14
+
Task 2 - Installation and Setting up
4 Lectures 07:15

Please follow the instruction to install Ruby, Rails to start off. If you're already done, feel free to skip this step

Install Ruby, Rails for MAC OS X 10.9 or higher
00:43

Please follow the instruction to install Ruby, Rails to start off. If you're already done, feel free to skip this step

Install Ruby, Rails for MAC OS X 10.6, 10.7 or 10.8
00:34

Please follow the instruction to install Ruby, Rails to start off. If you're already done, feel free to skip this step

Install Ruby, Rails for Windows
00:30

In this part, we're going to create a Wistia account. Now, I have a deal with Wistia in which they provide a special offer only for Code4Startup's students.

You can find the link here: http://wistia.com/trials/new/Code4Startup

Setting up Wistia for video hosting
05:27
+
Task 3 - Creating Code4Newbies project
3 Lectures 16:29

In this part, I'll show you how easy to create static pages for a Web application with Rails. Let's see what we're going to build in this task.

We're going to build 2 static pages: About & Contact. In the About page, we have Twitter timeline and normal text. And in the Contact page, we're going to implement the Google Map like this, so no big deal.

Initialising project folder
04:22

It's time to create our 2 static pages.

Creating 2 static pages: About & Contact
04:12

In this video, we're going to add stylesheets to our pages to make them looks elegant. But some of you might ask straightaway: “How can I design those page without much knowledge of HTML or CSS or even Javascript?” Well, the good news is you don't have to be such a person. You don't have to spend days or even weeks just to learn HTML, CSS or Javascript to make this happen. You just need to know what you want and look for the solution for that issue only.

Adding Material Design into our application
07:55
+
Task 4 - Relaxing and having fun
2 Lectures 12:02
Adding Twitter Timeline into About page
06:46

Yes, you get it right. Just relax and have fun in this task.

Let's start with the About page first.

In this page, we're going to create a panel with shadow. Inside the panel, we create two columns and they 50-50. One is for Twitter Timeline and the other is for avatar and text. Like I said early, you can go to Material Design and play around with their components, css like color, gird, shadow. Nowadays, things like Bootstrap, Material Design have changed the game. You don't have to be a rock star designer or HTML, CSS expert to get things done.

Adding Google Map into Contact page
05:16
+
Task 5 - Creating MVC model for videos
2 Lectures 17:23

In this task, we're going to create back-end and front-end for our project. Back-end allows you to process database and then display it in front-end.

Rails structure is all about MVC model. MVC stands for Model – View - Controller. Briefly, model is the database object. View refers front-end user interface and Controller is where you apply your business rule.

In our case:

  • Model is Videos object having properties like WistiaID, Description.
  • Controller is where we implement functions like: add, edit and delete videos
  • View refers the HTML pages to display data that controller send to.
Introduce MVC model
01:40

In this video, we're going to create a functionality that allows us to add new, edit or delete a video.

How to use scaffold generator to create MVC model
15:43
+
Task 6 - Refactoring out application
5 Lectures 38:17

The very first thing to do is refactor the style sheet to make our website looks elegant, rather than just simple text boxes or boring buttons.

Refactoring video form
08:35

Now is time to make some changes for our index page.

Refactoring video index page
03:11

Next, we're going to modify the show page. The current one is quite simple and we don't use that. Instead, we're going to create 2 columns, one for a list of videos and the other for a video player.

Refactoring video show page
09:54

In this sub-task, we're going to embed our videos hosted on Wistia into our website. Also, it's good idea to have buttons for different speed rates for your users. And we can do all of this easily with Wistia APIs.

Working with Wistia Video APIs
09:22

Hey, we almost finish our application, just one last challenge. In this video, we're going to create functionality for Next and Previous links so when users click on Next, it's going to the next video on the list. Similarly, when users click on Previous, it's going to the previous video on the list.

Working with the Next & Previous buttons
07:15
+
Task 7 - Go Live with Heroku
2 Lectures 08:11

We're in the very last step to make our application REAL. It would be great if you can share your work to the world so everyone can enjoy your videos online. To make this happen, I'm going to show you the very easy way with simple steps that anyone can do and it's FREE.

Deploying our app on Heroku
07:35

Want to build apps like AirBnb, Tinder, TaskRabbit, Product Hunt?
00:36
About the Instructor
Leo Trieu
4.2 Average rating
1,678 Reviews
31,260 Students
4 Courses
Founder at Code4Startup

Leo Trieu is full-time developer working in a Tech company and founder of Code4Startup in Melbourne, Australia. In addition to starting online businesses and teaching courses on Udemy, he has personally founded the online teaching website called Code4Startup where you can learn Ruby on Rails, AngularJS, HTML, CSS and much more by building Real-life Startup Project.

Leo loves sharing his experience in web development, project management, online marketing and video creation and spends his time working on online courses and developing web applications.