Setting Up a New Rails App

Postgres, Bootstrap, Spree, MDBootstrap, Devise, there's a lot to think about...

Tags: Ruby on Rails, Setup

Back to Blogs

Prerequisites:

gem install rails -v 5.2.2

gem install bundler

brew install imagemagick

And now the app:

rails _5.2.2_ new appName --database=postgresql

Now you cd into appName...

Github Repository Setup

git init
git add .
git commit -m "First Commit"
git remote add origin git@github.com:yourName/appName.git
git push -u origin master

Spree Setup

Add to gemfile:

gem 'spree', '~> 3.7.0'
gem 'spree_auth_devise', '~> 3.5'
gem 'spree_gateway', '~> 3.4'

And the terrifying bundle install.

And then the generators:

rails g spree:install --user_class=Spree::User
rails g spree:auth:install
rails g spree_gateway:install

And that works so far. Changed / to /store in my routes.rb so the store isn't the homepage.

Bootstrap

Trying this with a CDN due to a deep-seated distrust of the asset pipeline that should really be discussed with a therapist.

In the head:

    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- bootstrap -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

In the body, before the closing tag:

    <!-- bootstrap -->
      <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
      <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
    <!-- bootstrap -->

And let's rails g controller Home index so we have something to look at.

Oh yeah, and this in routes.rb:

   get 'home/index'
   root 'home#index'

Added some stuff in the index.html.erb goes some bootstrappy stuff to test, and it seems to be working so far!

Static Pages with High Voltage

And to get rid of the /pages/:

The usual

gem 'high_voltage', '~> 3.1'

and

bundle install

then

# config/initializers/high_voltage.rb
HighVoltage.configure do |config|
  config.route_drawer = HighVoltage::RouteDrawers::Root
end

Match Height JS

Just include this bad boy in the application.html.erb:

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.matchHeight/0.7.2/jquery.matchHeight-min.js"></script>

Setting Up Heroku Staging and Production Servers

Follow the Heroku Documentation


Back to Blogs