Build site like Code4Startup with Ruby on Rails - version PRO

Leotrieu

Leo Trieu

Logo

Full Source Code

Discussion Support

About

In this project, I will walk you through steps to develop Code4Startup with full functionalities from scratch based on my own experience. You don't need to learn everything about HTML, CSS, Javascript or Ruby on Rails to just create an web app. In my methodology which I called POA (Product-Oriented-Approach), you just need to learn what you need. Doing this way, it won't make you a super star developer but will get you something REAL quickly and efficiently, especially for Entrepreneurs & Founders.

Who It's For

  • Beginners

  • Promotion seekers

  • Entrepreneurs & Founders

  • Designers

  • Front-end Developers

What skills will we learn during this project?

  • How to quickly create a web app with Ruby on Rails.

  • Working with popular 3rd party gems.

  • Working with MVC model.

  • Understanding the workflow between components.

  • Understanding database structure and how to handle database changes.

  • Working with HTML, CSS in the front-end side of a Rails app.

  • How to use Material Design styles in a Rails app.

  • Working with Environment variables.

  • Creating object models for a Rails app.

  • Authenticate user with different social accounts.

  • How to easily create a Admin Dashboard for a web app.

What features will we build in this project?

  • Code Collaboration

  • Payment System with Stripe

  • Social Login with Facebook, Github, Google+

  • Transactional Emails

  • Admin Dashboard

  • Course creating/editing function

  • Material Design UI

  • Images Upload

  • Drag & Drop AJAX

  • Notifications

  • SEO & Open Graph

  • Comment system

  • Real-time Chat


Sample Videos

Video # 1
 
Video # 2
 
Video # 3
 
Video # 4
 
  • B869c38b84caf82cba7eff54cccb1bf3

    Ryosuke Mizuta

    It was so fun to follow this instruction.

  • B15b490be84d02fc744fe64a49ba7743

    jeremie

    good courses, I haven't found projects like this anywhere else on the web

  • Picture

    Houmarou Kante

    the stripe payment section lacked explanation. but overall good course

  • 20ec1b50fc0ee75ed039900c7ae46bee

    Jacob Hedengren

    great course!

  • 7cd2f409e842eb3572bc8ca0f33b68f3

    bradley

    Like everyone else here, I cannot fault this course. Leo is always on hand to answer any questions and his techniques for adding the extra frills to your site are great. Very clear course for anyone wanting to get into Rail development. Thanks Leo.

  • Photo

    Abhijit Roy

    great course to start withh rails

  • 2f0f0147b4ed6cb2d3e5420e16875854

    Saravana kumar

    awesome course leo, thanks so much

  • 97204c56682b581596e3521e5715a1e6

    Edwin Boon

    Great job Leo. After this course I will start you're Air BnB clone. You really know how to teach code!

  • 1c9d25318abfcc59f121703b8b42fa25

    Gabin

    Good job

  • 7fc640514e5d533ad4c2ec4c06dc723d

    Munir

    A real n great course. Leo knows how to teach real code. A definitely 5 star.

  • A81ce041eb0dcf060ee86cf546bb388e

    LuciyR

    Thank you Leo for this great course.

  • Picture

    Phạm Tuấn Cường

    This course helped me a lot :)

  • Picture

    Sebastian Plasschaert

    I learned even more with this one! Along the curriculum I noticed that I was already creating my own MVP; pretty slick.

  • Picture

    Marcelo Picolo Khoury

    Thank you Leo for the step-by-step!

  • Photo

    Deepak Kevat

    Awesome content!

  • 4549212?v=3

    KABBAJ Elhassane

    awsome I really appreciate your effort, thanks Leo

  • Ed9e25e5bafe9c17b20e5daa48d32128

    Kosuke

    This is pretty awesome! I was able to learn real startup stuff. I'm looking forward to seeing next one! I really appreciate your effort, leo! :)

  • 5ffb19e9f0289907b7ea5f03e7486302

    Salman

    Awesome, it is perfect course for me, I've been through all the process and will definitely do again. I just appreciate our coach Leo has taken alot of his time to teach us real world projects, I am fortunate to find this place here. Hope you plan to add more courses near future, thank you Leo!

  • Photo

    Pavel Kuba

    Well done Leo, great course which is worth the price.

  • 8782239?v=3

    Carol Louie

    Great course that teaches the basics of ruby from start to finish!! Coding isn't easy but Leo makes it fun, interesting and simple to follow. Definitely a great course to take!!

  • 3b773200a0e85078ebead1494f6c5435

    Joe Minock

    As an early adopter, I need to give extra points to this project. Most "MVP's" (Minimum Viable Product) are poorly constructed and provide the minimum needed to get by. Not this course or platform. Leo has done a wonderful job of making sure the app is very usable and the lessons clear. Appropriately, this gets conveyed to the app that you will build. The instruction is clear and each lesson is easy to follow. When compared to other video based lessons, special attention was obviously paid to making sure that the view can read the code in each task... Nothing is worse than trying to learn something and not being able to clearly see or understand it ! I've been able to build a highly functional application, and thanks to the recursive nature of the tasks I was able to get used to Rails patterns and build on functionality of my own. If you're motivated to learn Rails, this is a great second project (Do Project Hero - Newbies first)

  • 4457883?v=3

    Caleb Sylvest

    This is a great course on building a functional app with Ruby on Rails. I can see how I can take the concepts I learned building this course to build other apps with similar behaviors.

  • De9afea44813ac4c0a4709b4d6567d74

    nolds

    Leo is the best!

  • 6998600a4dcac9aad67aba74d5349fa8

    Leo

    simply excellent ! been looking all over for a good hands-on approach to help me learn ruby on rails and apps just like this one ! Excited to go deeper still with your Super version!

  • Photo

    Amul Patel

    you rock man.. keep this up!!!

  • Picture

    Teofilo Carlos Massinga

    I liked

  • Task 1: Starter

    In this project, we’re going to clone Code4Startup together. So why is Code4Startup a good example for you to learn how to build an education platform? First, it’s because its structure is simple and easy to create. Second, it covers most of basic...

    • What are we going to build for the Code4Startup clone? 1:58  
    • Setting up & Installation 5:50  

  • Task 2: Creating a basic project

    In this task, we’re going to create our project with only one static page along with mockup Navbar and Footer in Material Design style. It can be responsive in the mobile mode. All right, be ready and let’s get start.

    • What are we going to build in this task? 0:49  
    • Creating a new project with MaterializedCss installed 8:26  
    • Creating layout in Material Design styles 15:08  

  • Task 3: Creating authentication system

    In this task, we’re going to create the authentication system so user can sign up, sign in and log out. We’re going refactor our notice and alert so it will looks nice. Once user has signed up successfully, our application will send a verification...

    • What are we going to build in this task? 1:32  
    • Creating basic authentication system 14:22  
    • Adding custom field to User object 16:00  
    • Working with Gravatar and Notification 16:09  
    • Transactional emails with Mandrill (OLD) 17:37  
    • Transactional Emails with Sendgrid (NEW)  

  • Task 4: Authenticate with Social network accounts

    In this task, we’re going to create the authentication system with Social network accounts so users can sign up or sign in quickly and easily with their prefer social account in no time. We’re going refactor our notice and alert so it will looks...

    • What are we going to build in this task? 0:43  
    • Authenticate with Google 24:46  
    • Authenticate with Facebook 12:00  
    • Authenticate with Github 9:34  

  • Task 5: Creating Administration (back-end) system

    In this task, we’re going to create the default Dashboard for administration. It allows you to login with your own credential. Once you logged in, you can add, edit or remove other admin accounts. And basically, you have any fundamental functions...

    • What are we going to build in this task? 0:32  
    • Creating our basic Dashboard 4:13  
    • New theme to our Dashboard 3:20  

  • Task 6: Working with Project & Task

    In this task, we’re going to create Project and Task model, controller and views for our application. From that you can display a list of project, if you click on project, it will get you to the project details where you can see list of tasks...

    • What are we going to build in this task? 0:57  
    • Associations between Project & Task 4:24  
    • Models for Project & Task 10:37  
    • Function to upload image 8:47  
    • Controllers, Views for Project & Task 14:12  

  • Task 7: Working with Markdown & SEO URL

    In this task, we’re going to create the markdown convert function for our Dashboard so you can write down the plain text in the Markdown syntax and our function will render that into the HTML for us. For example, we just created a note for task...

    • What are we going to build in this task? 0:54  
    • Creating Markdown function 7:18  
    • Creating friendly URLs 6:30  

  • Task 8: Refactoring Task page

    In this task, we’re going to add the Wistia player along with functioning buttons into our Task page. However, the outstanding feature here is in the Dashboard, we have the ability to drag and drop the task so it would much easier for you to...

    • What are we going to build in this task? 0:29  
    • Drag and Drop in Dashboard 15:40  
    • Wistia player and functioning buttons 16:36  

  • Task 9: Working with association between Projects and Users

    In this task, we're going to learn a bit theory about has_many:through association in Rails and then to create our data model to handle subscription. Also, we're going to refactor our current project controller and task controller with new logic...

    • What are we going to build in this task? 0:45  
    • Understanding has_many :through association 4:49  
    • Creating Subscription 7:56  
    • Updating Project Controller 12:59  
    • Updating Task Controller 7:40  
    • Creating My Projects page 13:03  

  • Task 10: Creating Review

    In this task, together we’re going to create a Review function for our application with star selection and relative time stamp. Cool, this function is very interesting and I will teach you how to create it easily and quickly. Let’s get start!

    • What are we going to build in this task? 1:03  
    • Creating Review 20:49  
    • Adding Stars selection 8:49  
    • Adding relative time stamp 6:51  

  • Task 11: Refactoring

    In this task, we’re going refactor our Project page so now we have 3 different tabs: About, Videos and Discussions. But for this task, we’re going to work on About and Videos tabs only. Apart from that, I’m going to show you how to deal with...

    • What are we going to build in this task? 0:36  
    • Adding Tabs 10:13  
    • Changing Datatype in Rails 7:24  

  • Task 12: Working with Stripe

    Welcome to Task number 12. In this task, we’re going to create chargeable project with Stripe and how to email receipt to customers once they’ve made a payment.

    • What are we going to build in this task? 0:47  
    • Creating chargeable courses with Stripe 18:31  
    • Emailing Receipt 11:51  

  • Task 13: Environment Variables

    Hey, we’re in task 13 and that means we almost complete our project. Just two more tasks to go. So in this task, we’re going to keep all of our sensitive information secure by using environment variables to store sensitive data.

    • Setting Environment Variables 3:29  
    • Private data with environment variables 9:21  

  • Task 14: Social Media

    This is the last task of this project. You will be learning a lot of rich features that you will need for a modern web application like: Open Graph for sharing, Social sharing bar, Discussion system, Google Analytics, Real-time chat system.

    • Adding dynamic Open Graph 8:12  
    • Adding Social sharing bar 4:42  
    • Adding Discussion component 6:01  
    • Adding Google Analytics 1:56  
    • Adding Real-time chat component 5:30