DEV Community

Brittany
Brittany

Posted on

Day 78 : #100DaysofCode - Projects

Today, I worked on my second rails project application that I wanted to build. I was able to iterate over the unsplash gem and display the photos on the index page. YAY! Now to get everything else going!

Here is the link to my github repo:

README

rails db:drop rails db:create rails db:migrate rails db:migrate:status

Google:rails console not working https://stackoverflow.com/questions/24276033/rails-console-doesnt-start spring stop rails console

I want to create a simple rails app that will allow users to:

  1. Search for images to add to their page - sers can have a profile picture (active storage)
  2. Follow eachother
  3. Add pictures from other pages to their own.

First create users and Devise gem Cancancan Users can follow eachother Users can add photos to their page Users can search for photos Users can sign in using google, twitter, or github https://source.unsplash.com/1600x900/?nature,water Inspirational quote with photo?

#rails g resource User name:string #rails g resource Follow follower_id:integer followee_id:integer

photo-app

Steps taken to build:

  1. rails new photo_app --database=postgresql
  2. cd photo_app
  3. rails g resource User name:string
  4. rails g resource Follow follower_id:integer followee_id:integer
  5. rake db:drop db:create db:migrate

rails d resource User name:string rails d resource Follow

  1. gem 'devise'
  2. rails generate devise:install
  3. rails generate devise User

I was able to get the photos by iterating over the object provided by the unsplash gem by doing the following:

   photos = Unsplash::Photo.search("cats")
        @photos = []
        photos.each do |a|
            description = a["alt_description"]
            portfolio = a["portfolio_url"]
            photo = a["urls"].full
            @photos << photo
        end 
Enter fullscreen mode Exit fullscreen mode

Then I was able to display the photos by adding this code to my views:

<div class="cards">
<% @photos.each do |photo| %>
    <div class="card">
        <img src="<%= photo %>" alt="random" >
        <br/>
        <div><p> <%= @quote %> </p></div>
    </div>
<% end%>
</div>
Enter fullscreen mode Exit fullscreen mode

The next step is to add a checkbox to my views that will send the information to the photos controller and save it to the database.

I am aiming to have this application running by the end of the week so that I can focus on the next section for my bootcamp, Javascript.

Thanks for reading!

Sincerely,
Brittany

Song of the day:

Top comments (0)