Installation And Uses Of Active Admin In Rails Application

 

Active Admin is a Ruby on Rails plugin used to create a easy and simple dashboard and administration style UI view and comes with lot of options like – Filtering, CRUD operation on table, Rails integration and so on. Also it abstracts common business application patterns so it can be easy for developers to implement nice interfaces with less effort. This is also known as “The administration framework for Ruby on Rails applications“.

 

Benefits Of Active Admin:

1. CRUD operation with any data with ease
2. Search and filtering
3. Export data to CSV/JSON/XML
4. Authentication (via Devise or other)
5. Easy to management for all data
6. Data access, persistency and consistency

 

Installation

 

Add active admin gem in your Gemfile,

 

gem 'activeadmin'

 

After adding gem just run bundle to get new gem installed.

 

bundle

 

After installing the gem, you need to run the generator. Here is the different options to run:

 

If you don’t want to use Devise, run it with –skip-users:

 

rails g active_admin:install --skip-users

 

The generator adds these core files, among others:

 

  • app/admin/dashboard.rb
  • app/assets/javascripts/active_admin.js
  • app/assets/stylesheets/active_admin.scss
  • config/initializers/active_admin.rb

 

Now, migrate and seed your database before starting the server:

 

rake db:migrate
rake db:seed
rails server

 

Now visit to http://localhost:3000/admin and log in as the default user:

  • User: admin@example.com
  • Password: password

 

Woohoo…!!! You are in brand new active admin dashboard.

 

To register an existing model with Active Admin:

 

rails generate active_admin:resource MyModel

 

This creates a file at app/admin/my_model.rb to set up the UI; refresh your browser to see it.

 

READ NOW >>  15 Must Have Tools for Web Developers

All above steps are enough to get basic idea of active admin implementation for your rails application.

That’s all for basic configuration of Active admin in Rails application….!!!

 

Customizing Active Admin In Rails :

 

What extra you can do with active admin, Now we are going to see few important customization that we regularly use.

 

 

So let’s get started,

 

Configuration related customization for – /config/initializers/active_admin.rb

 

  • You can set your own title that will be displayed top of the page as title of the website:

config.site_title = "Active Admin Title"

  • Set the link url for the title so that it will redirect to that page on clicking title link:

config.site_title_link = "URL_TO_REDIRECT_USER_TO_MAIN_WEBSITE"

 

  • We can also configure the base url for active admin just by updating below line:

config.default_namespace = :base_url(default - ‘/admin’)

 

  • We can also add the authorization point and authenticate the user by below simple line of code:

config.authentication_method = :auth_member!

  • You can add custom link in the header like logout or any custom URL:

 

  config.namespace :active_admin do |admin|

 admin.build_menu :utility_navigation do |menu|

   menu.add label: "logout", url: '/logout’, html_options: { }

  admin.add_logout_button_to_menu menu

end

     end

 

Filters In Active Admin:

 

By default all the index page includes a filter for each attributes of model.

To disable filter you just need to include below line in your code:

 

ActiveAdmin.register Post do
      filter :false
end

 

Active admin supports few more filter types,

 

  • :string – A drop down for selecting “Contains”, “Equals”, “Starts with”, “Ends with” and an input for a value.
  • :date_range – A start and end date field with calendar inputs
  • :numeric – A drop down for selecting “Equal To”, “Greater Than” or “Less Than” and an input for a value.
  • :select – A drop down which filters based on a selected item in a collection or all.
  • :check_boxes – A list of check boxes users can turn on and off to filter

 

READ NOW >>  Setup Node.js, Nginx And MongoDB On Ubuntu 16.04

By default it will take most relevant filter based on the attribute type, but we can force to change the type by passing :as option.

Eg – filter :author, as: :check_boxes

 

Even we can pass own collections of data from db for filtering, see the below example:

 

filter :author, as: :check_boxes, collection: proc { Author.all }

 

Or we can also manually pass the set of data to filter:

 

filter :author, as: :select, collection: ['New, 'Active, 'Test,'Admin']

 

CRUD Operation Using Active admin:

This is also a interesting feature of active admin, we can allow admin to edit, create, destroy the records from active admin dashboard just by adding few lines of code, see the example below.

 

ActiveAdmin.register Post do

 actions :index, :show, :new, :edit, :update, :create, :destroy

end

 

Few more things we can do in this like we can define our own controller for each action(create, edit, update, destroy) and can do other processing of data as per requirement.

 

See the sample code:

 

controller do

   def create

#logic will go here

   end

end

 

Creating Submenu In Active Admin Dashboard:

If we need to group few link of models as sub menu then active admin got you simple steps,

 

Eg – suppose you have two model called – modelA and modelB.

Now we need both link should be grouped into a single menu.

 

ActiveAdmin.register modelA do

 menu parent: 'modelA', priority: 1

end

ActiveAdmin.register modelB do

 menu parent: 'modelA', priority: 1

end

 

On the above code, you can note the slight change which can help you to make submenu easily.

 

READ NOW >>  The 9 Most In-Demand Development Languages of 2017

That’s it for Active Admin…. Use it smartly to make your Dashboard in very less efforts.

 

Just like any other administration panel, Active Admin provides an easy way for application developer to build new dashboard from starting from db to views and mostly Rails developers can completely leverage this on their application. Also allows to access and handle data without any difficulty. So give it a try and let us know your opinions in comments.