RSS
 

Ruby on Rails Photo Gallery & Shopping Cart with RESTful Authentication

31 May

Tonight I launched another web application for Michael Youngblood Photography which allows him to build online photo galleries that his customers can privately view and order online with qty, size and framing options. The customer must use paypal to complete the transaction (because I’m still a rails n00b, guys. no serious SSL stuff for me yet).

So I grabbed the RESTful Authentication Tutorial as my base framework for the application, so I automatically had user accounts, roles, logging in and session stores to work with right off the bat.

I’m very proud of this application from a knowledge/skill expanding aspect, a UI aspect, project complexity, and the fact that I was careful to write this in “The Rails Way” as strictly as possible. Remember guys I’m still a n00b but I’m coming along. Enjoy!

Demonstration of the User Interface process and application

What I had to add on to it was the ability for Michael to create galleries which belong to the user accounts he creates in the process.

So he begins by creating a customer:

Michael begins by creating his customer

Michael begins by creating his customer

Then he names the gallery:

Michael names the gallery

Michael names the gallery

Then he populates the gallery with photos:

Michael uploads photos to the gallery

Michael uploads photos to the gallery

This is what the customer sees when they log in (minus the edit gallery link, only admins see that)

The customer interacts with their gallery

The customer interacts with their gallery

*note, the “Add to Cart” gray bar is triggered by mouse hover.

They can add to cart:

The customer adds an item to their cart

The customer adds an item to their cart

After completing the checkout process in paypal, the user can see their order list, and Michael can access their order list directly off their private user page.

To see the full demonstration, check out my Jing! Screencast here:

View the 5 minute Screencast Demonstration

*note -> the photo uploads actually work much better and without wonkiness on the production server!

If you’d like to get your hands on the source, or would like to work with me, please contact me.

 
7 Comments

Posted in Design

 

Leave a Reply

 
 
  1. Scott Lenney

    August 29, 2009 at 10:30 am

    I like the demonstration and would like to see how you did the photo albums and the paypal integration. I want to convert my site over to Ruby and add these features.

    Thanks,
    Scott

     
  2. Scott Lenney

    August 29, 2009 at 10:33 am

    The contact you section of your site isn’t working. I tried to send the request for the source using both firefox and ie.

     
  3. Joe Sak

    August 29, 2009 at 12:22 pm

    Scott- I’ll make a demo video with source and code snippets soon

     
  4. David Kleman

    August 30, 2009 at 2:22 am

    Sweet! Looking forward to the source, especially the ajax uploads

     
  5. Greg

    August 31, 2009 at 7:23 pm

    Great application! Been looking for something simple yet perfectly functional like this. Keep us posted… Looking forward to see the source. Cheers.

     
  6. Joe

    September 11, 2009 at 3:41 pm

    Guys.

    I’m writing the tutorial on my company blog at http://www.simplifyadvance.com. It’s coming soon, I promise. Thanks for waiting.

    -JMS

     
  7. Online Photo Gallery, Payment & Order Fulfillment: Ruby on Rails Tutorial | Joe Sak

    September 18, 2009 at 10:51 am

    [...] post is a follow-up to the post on my personal blog, titled “Ruby on Rails Photo Gallery & Shopping Cart with RESTful Authentication” In that article, I merely showed off what I’d done with Ruby on Rails, but I [...]