Xây dựng website thương mại điện tử với Spree E-Commerce (Phần 1)

Website thương mại điện tử một khái niệm không quá xa lạ với cộng đồng lập trình viên nói chung. Cùng với sự gia tăng về nhu cầu mua sắm việc sở hữu một website bán hàng với style của riêng mình là khẩn thiết với mỗi nhà kinh doanh. Vậy, làm thế nào để tạo một website thương mại nhanh nhất? đầy đủ chức năng nhất? chỉnh sửa dễ ràng nhất? ...v.v là những câu hỏi mà lập trình viên luôn luôn hướng tới. Nhìn nhận trước vấn đề này, mỗi một ngôn ngữ hay framework đều trang bị cho mình những công cụ tốt nhất giúp lập trình viên giảm tối đa thời gian cũng như công sức để xây dựng lên sản phẩm. Spree Ecommerce là một hệ thống thương mại điện tử mã nguồn mở được xây dựng bằng framework Ruby on Rails. Với giao diện người dùng gọn nhẹ, dễ sử dụng, phần quản lý admin trực quan thao tác đơn giản. Tài liệu và hướng dẫn sử dụng chi tiết, giúp hạn chế tối đa những lỗi gặp phải trong quá trình cài đặt và sử dụng.

Điểm mạnh của Spree E-Commerce

  • Cài đặt dễ ràng, sử dụng đơn giản cho cả lập trình viên lẫn người sử dụng.
  • Đầy đủ mọi chức năng của một website thương mại điện tử.
  • Khả năng tùy chỉnh cho lập trình viên cao.
  • Do là hệ thống mã nguồn mở nên vấn đề bản quyền không phải là nỗi lo.
  • Tài liệu và hướng dẫn khá chi tiết.
  • Giao diện cơ bản khá đại trà phù hợp với nhiều người dùng.

Cài đặt và sử dụng

Cài đặt Spree khá đơn giản tương tự như những gem khác của Rails. **Cài đặt imagemagick **

Spree sẽ làm việc với ảnh khá nhiều nên cài đặt imagemagick trước là cần thiêt.

brew install imagemagick

Tạo mới một dự án Rails 4.2.6

rails _4.2.6_ new Spree_Project

Thêm vào Gemfile

gem 'spree', '~> 3.1.0.rc1'
gem 'spree_auth_devise', '~> 3.1.0.rc1'
gem 'spree_gateway', '~> 3.1.0.rc1'

Chạy lệnh sau để cài đặt Spree vào dự án

bundle install

Chú ý: Có thể bạn đang dùng Rails 5.0 nên có thể khi bundle install sẽ gây ra lỗi việc bạn cần làm là chạy lệnh sau bundle update

Setting cơ bản cho Spree

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

Nếu thành công bạn sẽ được như sau:

Devise.secret_key = "a6f8cc232fe9219e5d1bdfaaa7cd03934c6e412f608ba380f881cb75477b1568e232e4d0d308d10a6c4f237f00c4c4c5e871"
Running via Spring preloader in process 10313
      create  config/initializers/spree.rb
      append  public/robots.txt
      create  vendor/assets/javascripts/spree/frontend
      create  vendor/assets/javascripts/spree/backend
      create  vendor/assets/stylesheets/spree/frontend
      create  vendor/assets/stylesheets/spree/backend
      create  vendor/assets/images/spree/frontend
      create  vendor/assets/images/spree/backend
      create  vendor/assets/javascripts/spree/frontend/all.js
      create  vendor/assets/stylesheets/spree/frontend/all.css
      create  vendor/assets/javascripts/spree/backend/all.js
      create  vendor/assets/stylesheets/spree/backend/all.css
      create  app/overrides
      append  db/seeds.rb
     copying  migrations
    creating  database
     running  migrations
	     loading  seed data
        rake  db:seed 

Kết quả trên cho thấy sức mạnh và sự tiện dụng của Spree tất cả chỉ trong một lệnh.

  • Tạo config cho Spree config/initializers/spree.rb
Spree.config do |config|
  # Example:
  # Uncomment to stop tracking inventory levels in the application
  # config.track_inventory_levels = false
end

Spree.user_class = "Spree::User"

  • Tạo giao diện cho spree với đầy đủ javascript, css . . .
  • Tạo migrations
  • Tạo databases
  • Tạo sample data cho dự án
  • Tạo tài khoản admin cho dự án sử dụng gem device
Email [spree@example.com]: giang.phan1106@gmail.com
Password [spree123]:

Setting cơ bản cho device

rails g spree:auth:install

#Cho kết quả
Running via Spring preloader in process 10443
      append  vendor/assets/javascripts/spree/frontend/all.js
      create  config/initializers/devise.rb
         run  bundle exec rake railties:install:migrations FROM=spree_auth_devise from "."
         run  bundle exec rake db:migrate from "."

Cài đặt gateway cho Spree

rails g spree_gateway:install

Tạo mới một tài khoản admin với lệnh

rake spree_auth:admin:create

Mọi việc đã xong, bây giờ cùng chạy ứng dụng và cùng xem kết quả nhé. Giao diện trang chủ Các bạn có thể thấy những chức năng cơ bản như search, show products, đăng ký, đăng nhập đều được cài đặt và sử dụng mượt mà.

Giao diện trang quản lý admin

Phần quản lý admin có thể nói là hoản hảo với đầy đủ chức năng thêm, sửa, xóa, filter, tìm kiếm, phần trang . . . quá đủ cho một website bán hàng.

Qua ví dụ đơn giản trên chắc hẳn các bạn đã hiểu phần nào về Spree E-Commerce trong những phần sau chúng ta cùng tìm hiểu sâu hơn về Spree E-Commerce từ databases đến các cách custom chức năng. Thanks for reading !!!