Tạo ứng dụng Rails đầu tiên


Ở bài trước chúng ta đã settup môi trường để làm việc rồi,hôm nay mình sẽ hướng dẫn các bạn cách tạo một website sử dụng rails nhé.

1.Tạo và chạy website đơn giản
Để tạo website sử dụng rails các bạn mở teminal lên và chạy lệnh theo cấu trúc
rails new <tên app>
ví dụ:

  rails new thanos


Cùng xem xét ứng dụng của chúng ta có gì nhé

Hình trên là cấu trúc thư mục app của chúng ta.Mình giải thích một chút về các thư mục trong app nhé
+,Git
Thư mục git là để quản lý source của mình,các bạn có thể tìm hiểu về github và xem nó sử dụng để làm gì?nói nôm na thằng git nó giúp mình quản lý đống code của mình,mỗi ngày code xong chúng ta vứt lên nhờ anh git giữ hộ,khi mà muốn dùng hoặc chia sẻ với người khác chỉ cần vứt link địa chỉ của a git cho thằng đó là đc.Nói chung mình sẽ viết một bài riêng về git các bạn có thể tham khảo tại đây.

+,app
Đây là thư mục gốc của ứng dụng và phần lớn code của các bạn sẽ được lưu vào thư mục này.Rails là một MVC Framework,nghĩa là ứng dụng được chia thành các thành phần theo mục đích của nó,Model,View,Controller.3 thành phần này đều nằm trong thư mục app của chúng ta.

+,app/assets
Thư mục này chứa các file tĩnh cần thiết cho phía frontend như file js,css.Chúng được nhóm vào các thư mục con chứa trong thư mục này.Theo mình biết thì thư mục này chỉ nên chứa các file js,css của các bạn tự viết,còn các thư viện của bên thứ 3 nên lưu vào thư mục vendor phía dưới.Mình thì không có thói quen lưu thư viện bên thứ 3 vào vendor nên mình cứ ném hết mấy cái thư viện như jquery... vào thư mục app/assets,các bạn đừng cười nhé. ^_^

+,app/assets/images
Tất cả ảnh cần thiết của ứng dụng chúng ta nên được ném vào thư mục này.Khi ném ảnh vào thư mục này thì ảnh của các các bạn luôn sẵn sàng ở "View" nếu các bạn muốn sử dụng chỉ cần gọi thẻ giống như thế này image_tag("name_image.png").Chúng ta không cần sử dụng đường dẫn tương đối hoặc tuyệt đối cho ảnh,nếu các bạn muốn sử dụng đường dẫn tương đối hay tuyệt đối thì vẫn dùng như bình thường nhé.Rails chỉ thêm một phương pháp để truy suất ảnh dễ dàng hơn thôi.

 +,app/assets/javascripts
Thư mục này dùng để chứa các file javascript.Có một quy tắc để đặt tên file js cho mỗi controller.ví dụ:có một controller tên là book_controller.rb,thì tên của file js của view sử controller book sẽ là book.js

 +,app/assets/javascripts/application.js
File được tạo khi tạo project rails.Nó là nơi khai báo các file javascript cần thiết của project,có nghĩa là bất kỳ file js nào muốn được sử dụng trong  project cũng cần được khai báo ở file này.Rails sử dụng asset_pipelin để biên dịch cũng như phân phối tài nguyên.Không nên tạo các function js trong file này,tốt nhất file này chỉ dùng để khai báo các file js khác

+,app/assets/stylesheets
Nơi chứa các file css tương tự như thư mục javascripts,quy tắc đặt tên file cũng tương tự phần javascripts phía trên nhé.

+,app/assets/stylesheets/application.css
Tương tự như file application.js phía trên nhé

 +,app/controllers
Đây là nơi chứa các file controller.Controllers có chức năng điều phối hoạt động của view và model.Quy tắc đặt tên controller đó là tên số nhiều của model + "_controller.rb".Ví dụ controller của model Book sẽ là books_controller.rb đây được gọi quy tắc đặt tên snake_case.Cũng như thế,controller class sẽ có quy tắc đặt tên theo CamelCase kiểu như thế này BooksController
Các bạn có thể tạo controller bằng tay hoặc sinh tự động bằng lệnh
rails generate controller controller_name action1 action
Mình thì thích tạo bằng tay hơn vì sẽ hiểu được code của mình hơn :D

+,app/controllers/application_controller.rb
Đây là controller chính và tất cả các controller khác đếu kế thừa.Các method trong ApplicationController luôn sẵn sàng trong các controller khác(vì được kế thừa mà).Controller này lại được kế thừa từ ActionController::Base.

+,app/controllers/concerns
Đây là một thư mục chứa các module bao gồm các method được sử dụng cho nhiều class hay module include chúng.Nói đơn giản nếu chúng ta viết controller mà có quả nhiều function trùng nhau,có thể tách chúng ra một module riêng,sau đó controller nào cần sử dụng các hàm đó thì chỉ cần include module đấy vào để sử dụng các hàm đó.

+,app/helpers
Đây là nơi chứa tất cả các helper function dành cho view.Helper được tạo ra để tối ưu code,ví dụ như bạn có thao tác định dạng kiểu thời gian theo ý mình và muốn áp dụng nó cho toàn project thì chỉ cần viết một helper và include nó vào controller chứa view.Việc còn lại là sử dụng hàm đó ở phần view,ví dụ minh họa nhé

module FormattedTimeHelper
  def format_time(time, format=:long, blank_message="&nbsp;")
    time.blank? ? blank_message : time.to_s(format)
  end
end
ở controller chỉ cần chỉ định helper mình cần

class EventsController < ActionController::Base
  helper FormattedTimeHelper
  def index
    @events = Event.all
  end
end
ở view có thể thoải mái sử dụng hàm format_time ^_^

<% @events.each do |event| -%>
  <p>
    <%= format_time(event.time, :short, "N/A") %> | <%= event.name %>
  </p>
<% end -%>
ví dụ minh họa mình tham khảo ở đây

+,app/helpers/application_helper.rb
Đây là một helper được viết sẵn các bạn có thể viết các function vào đây hoặc viết riêng một helper của các bạn nếu muốn.Vì khi sử dụng các bạn sẽ phải khai báo helper bằng cách include helper_name.

+app/mailers.
Bao gồm các template mẫu dùng cho việc gửi email

+,app/models.
Đây là nơi chứa của các model.Mặc định sẽ được kế thừa từ lớp ApplicationRecord < ActiveRecord::Base trong rails lớp ActiveRecord đóng vai trò trung gian để kết nối ứng dụng Rails với Database do đó các tập tin model còn đóng vai trò kết nối với Database để lưu trữ và truy vấn dữ liệu.
Các file model bản chất là các file ruby nên có phần mở rộng .rb

+,Views.
views: chứa các tập tin views được sử dụng bởi controller để hiển thị nội dung web cho người dùng.
Các tập tin views khi được sinh ra mặc định sẽ có phần mở rộng là .html.erb

+,Thư mục bin.
Thư mục này bao gồm các đoạn mã script dùng để khởi động ứng dụng rails hoặc dùng để thiết lập deloy ứng dụng

+,Thư mục config.
Thư mục này chứa các tập tin liên quan đến việc cấu hình của ứng dụng Rails.
Tập tin database.yml là tập tin dùng để cấu hình kết nối tới database của ứng dụng rails. Ở đây sẽ khai báo hệ quản trị csdl nào sẽ được sẽ dụng (SQL Server, My SQL, SQLite, Oracle,...)và các thông số cần thiết để truy cập (username, password, database name).

Tập tin routes.rb đây là tập tin mà chúng ta cần lưu ý nhất trong thư mục này vì sau này các bạn sẽ làm việc với nó khá nhiều. Tập tin này là nơi để khai báo các đường dẫn đến các file controller/action khi bạn gọi request ở phía client.

Ngoài ra thư mục này còn chứa các thư mục con khác :

environments là nơi chứa các tập tin cấu hình cho từng môi trường phát triển developement, production hay test,...

initializers là nơi chứa các tập tin cho việc khởi tạo ban đầu của ứng dụng hay của các gem,...

locales là nơi chứa các tập tin phục vụ cho việc hiển thị đa ngôn ngữ của ứng dụng (I18n)

+,Thư mục db

Thư mục này chứa các tập tin migrations dùng để tạo cấu trúc schema cho database.

Tập tin seeds là nơi để nhà phát triển viết các đoạn mã script để cập nhật dữ liệu cho database.

Để gọi thực thi file này ta thực hiện lệnh
 rake db:seed

+,Thư mục lib
Bao gồm các thư viện được dùng trong ứng dụng. Thông thường các thư viện này được viết bởi chính những lập trình viên tham gia vào viết ứng dụng. Các thư viện của bên thứ 3 thường không được đặt ở trong thư mục này mà được đặt ở thư mục Vendor

Thư mục này còn chức thư mục con là tasks đây là thư mục dùng để chứa các rake task trong ứng dụng rails

+,Thư mục log
Chứa các bản ghi log các thông tin trong quá trình cài đặt, khởi động, chạy hay ngừng ứng dụng.

+,Thư mục public
Nội dung của các tập tin đặt trong thư mục này sẽ có thể được tải trực tiếp về trình duyệt. Như các file hình ảnh, âm thanh,...

+,Thư mục test
Thư mục này chức các tập tin và thư mục con phục vụ cho việc test ứng dụng : testcase, unit test, intergration test,...

+,Tập tin Gemfile và Gemfile.lock
Gemfile là một trong những tập tin quan trọng nhất trong Rails mà chúng ta làm việc thường xuyên nhất.

Rails là một framework được xây dựng với mục đích hỗ trợ nhà phát triển xây dựng ứng dụng web nhanh nhất do đó việc tích hợp các thư viện hỗ trợ là một trong những chức năng đặc trưng của Rails.

Các thư viện hỗ trợ được tích hợp vào ứng dụng Rails thông qua các gem, các bạn có thể tìm hiểu thêm về Ruby gem ở đây https://rubygems.org/

Chỉ cần khai báo tên gem vào trong tập tin Gemfile như bên dưới và chạy lệnh


 

 bundle install

Là gem đó đã được tích hợp vào ứng dụng Rails.

+,Tập tin Rakefile
Tập tin Rakefile được Rails sử dụng để tìm kiếm các tác vụ mà chúng có thể được thực thi trên cửa sổ dòng lệnh thông qua rake. Bạn không nên định nghĩa trực tiếp các tác vụ này trong Rakefile mà việc định nghĩa các tác vụ này được thực hiện thông qua các tập tin trong thư mục lib/tasks.

Oke vậy là mình vừa trình bày tổng quan về app rails.Ở các bài sau mình sẽ đi vào chi tiết xây dựng các chức năng.Mời các bạn đón đọc.:D

Nhận xét

Đăng nhận xét

Bài đăng phổ biến từ blog này

Cài đặt SSL cho website sử dụng certbot

Hình ảnh
1. SSL là gì. Trước khi nói về ssl chúng ta nhắc lại về HTTP là gì đã nhé.HTTP là giao thức dùng để truyền nhận dữ liệu.Nhược điểm của http là dữ liệu được truyền dưới dạng plain text, không hề được mã hóa hay bảo mật nên nếu gói tin chúng ta gửi bằng http bị tin tặc bắt được thì mọi thông tin sẽ bị lộ. SSL viết tắt của cụm từ Secure Sockets Layer là tiêu chuẩn về an ninh công nghệ trên toàn cầu, nói dễ hiểu thì ssl thực hiện mã hóa thông tin truyền nhận, các dữ liệu được gửi qua phương thức này sẽ được mã hóa, website của bạn nếu sử dụng ssl thì sẽ có https trên url.Nhìn chung phương thức https có độ bảo mật cao hơn nhiều so với http, mặc dù không phải tuyệt đối. 2.Cài đặt SSL. A.Trước tiên chúng ta cần cài đặt nginx để làm web server Đối với ubuntu thì các bạn chạy các lệnh sau: $ sudo apt update $ sudo apt install nginx $ sudo ufw allow 'Nginx HTTP' Đối với Centos thì các bạn chạy lệnh : $ sudo yum install epel-release $ sudo yum install nginx $ sudo systemctl start nginx N
Read more »

Xây dựng một hệ thống comment real-time hoặc chat đơn giản sử dụng Pusher

Hình ảnh
Hế lô các bạn, các bạn khỏe không?Sau một thời gian nghỉ ngơi vì dịch nên mình đã quên hết code rồi :)).Sợ code không nổi nữa nên nay lên mò mò làm một app chat đơn giản cho đỡ lụt nghề.Lên mạng đọc tới đọc lui thấy khó thực sự =)).Bất ngờ đọc được một vài bài giới thiệu pusher nên mình cũng lọ mọ thử viết một cái ai ngờ nó chạy được nên tranh thủ viết lại cho cho các bạn cùng xem cho vui. 1.Pusher là gì? Pusher là một dịch vụ cloud, tạo ra một server trung gian giúp chúng ta có thể xử lý các tác vụ thời gian thực. Dữ liệu được gửi tới pusher, và pusher lại gửi nó đi tới các client đã subscribe (đăng ký) và các channel. Trong đó Pusher Channel cung cấp giao tiếp thời gian thực giữa các máy chủ, ứng dụng và thiết bị. Các kênh được sử dụng cho các biểu đồ thời gian thực, danh sách người dùng thời gian thực, bản đồ thời gian thực, chơi trò chơi nhiều người chơi và nhiều loại cập nhật giao diện người dùng khác. Nó có một thư viện hỗ trợ mọi thứ như trình duyệt web, ứng dụng iOS và Andr
Read more »

CÁC BÀI TẬP SQL CƠ BẢN - PART 1

Hình ảnh
  Thời gian gần đây mình có được nhờ giải mấy bài SQL cho các em, lâu không làm lại, thấy khá thú vị nên hôm nay lên mạng tìm mấy bài làm cho zui.Mình viết lại đây coi như note lại để lưu lại,các bạn cùng làm với mình nhé Đề 1: Giải thích qua về đề bài. Query 2 thành phố có tên ngắn nhất và dài nhất  cùng với số ký tự trong tên của 2 thành phố ấy trong bảng STATION. Đáp án : SELECT CITY, LENGTH (CITY) FROM STATION ORDER BY LENGTH (CITY) ASC , CITY LIMIT 1; SELECT CITY, LENGTH (CITY) FROM STATION ORDER BY LENGTH (CITY) DESC , CITY LIMIT 1; Đề 2: Giải thích qua về đề bài : Query danh sách tên thành phố bắt đầu bằng các nguyên âm (a, e, i, o, u) Đáp án : SELECT DISTINCT CITY FROM STATION WHERE CITY LIKE "A%" OR CITY LIKE "E%" OR CITY LIKE "I%" OR CITY LIKE "O%" OR CITY LIKE "U%" ; Đề 3:  Giải thích đề bài : Query danh sách tên thành phố kết thúc bằng các nguyên âm (a, e , i, o,u), tương tự bài trên chỉ cần đổi logi
Read more »

Xây dựng một hệ thống tracking hành vi người dùng (phần 1)

Hình ảnh
 Hiện nay trên các trang thương mại điện tử việc tracking hành vi người dùng rất là phổ biến vậy nên hôm nay mình sẽ viết một bài viết về hệ thống tracking đơn giản đã từng được sử dụng trên một website thương mại điện tử nhé.Ngôn ngữ mình sử dụng trong bài viết này là ruby(ruby on rails) 1.Sơ đồ tổng quan hệ thống  Ứng với sơ đồ tổng quan sẽ có 2 data set tương ứng như sau và 2.Triển khai project Mô tả sơ qua về cách xây dựng hệ thống(bỏ qua các giai đoạn xây dựng xác thực tài khoản và phân quyền,vì chỉ là thành phần phụ trợ). Tạo tag -> lưu tag vào database -> render thành file js với đầu vào là các tag được tạo từ  trước 2.1.Các model tương ứng Tag model class Tag include Mongoid::Document include Mongoid::Timestamps belongs_to :user field :name, type: String, default: "" field :selector, type: Hash, default: {} field :trigger, type: Hash, default: {} field :handle, type: Hash, default: {} field :author, typ
Read more »

Xây dựng một hệ thống tracking hành vi người dùng (phần 2)

Hình ảnh
Các bạn có thể xem lại phần 1 tại đây. Sau khi đã có được các tag tiến hành xây dựng các Helper để hỗ trợ việc render ra file tracking.js Helper này có nhiệm vụ xử lý các logic của file tracking.js nhưng nếu xử lý trực tiếp trên file js thì nó quá dài dòng và dễ bị lộ logic của file. JS helper module JsHelper def renderBindClicks(tags) click_tags = tags.inject([]) do |click_tags, tag| if tag&.trigger[:value] == 'click' event_type = tag&.selector[:dom] selector = if event_type == "classes element" ".#{tag&.selector[:value]}" elsif event_type == "id element" "\##{tag&.selector[:value]}" end if selector.present? click_tags << "'#{selector}'" end end click_tags end if click_tags.present? return "[#{click_tags.uniq.join(', ')}].forEach(bindClick);".html_safe end
Read more »

Enterprise architecture trên 1 tờ A4

Hình ảnh
Enterprise architecture là một chủ đề rộng và có rất nhiều quan điểm chi phối và thực thi. Trên thực tế có rất nhiều quan điểm về vấn đề này, mình xin giới thiệu qua một quan điểm khá hay ho trong hình dưới đây. Nếu khó nhìn các bạn có thể tải về máy và phóng to lên nhé !
Read more »

Web caching (P2)

Hình ảnh
Sau khi đọc Web caching (P1), chúng ta đã hiểu đường tác dụng, cơ chế của việc caching và đi chi tiết về Browser caching và CDN caching. Ở phần 2 chúng ta sẽ tìm hiểu về server caching và cách vận dụng linh hoạt caching để giải quyết các bài toàn performance. Mục lục Reverse proxy caching. Application caching. Áp dụng bài toán thực tế. Lời kết 1.Reverse proxy caching Reverse Proxy là gì? - Là một loại proxy server trung gian giữa một server và các clients gửi request. - Nó kiểm soát yêu cầu của các clients, nếu hợp lệ, sẽ luân chuyển đến các servers thích ứng. - Ưu điểm lớn nhất của việc sử dụng Reverse proxy là khả năng quản lý tập trung. Nó giúp kiểm soát mọi requests do clients gửi lên servers. Cơ chế: - Tương tự như Browser caching và CDN caching. Reverse proxy cache lại tất cả các request resources(image, css, js, ...) và trả lại client ở tầng Proxy. Ưu điểm: - Giảm lượng request lên server. - Có thể quản lý được cache. Nhược điểm:
Read more »

Bàn về async/await trong vòng lặp javascript

Hình ảnh
  Lâu nay mình đang phải làm một dự án sdk javascript nên khá đau đầu với cái bất đồng bộ trong vòng lặp của  javascript.Để tránh quên nên mình viết lên đây cho đỡ quên.Bài viết này mình chỉ viết về một số ví dụ sử dụng async/await cho dễ hiểu nhé. 1. Chuẩn bị cho ví dụ sắp tới Giả sử chúng ta có một giỏ trái cây và số lượng của từng trái cây trong giỏ const fruitBasket = { apple: 27, grape: 0, pear: 14 } Bây giờ mình muốn lấy số lượng hoa quả trong giỏ mình sẽ viết một hàm như sau  const getNumFruit = fruit => { return fruitBasket[fruit] } const numApples = getNumFruit('apple') console.log(numApples) Giờ giả sử fruitBasket được lấy từ server chứ không phải mình khai báo biến như trên nữa việc lấy dữ liệu sẽ mất một vài giây, mình sẽ giả lập công việc lấy dữ liệu từ server như sau const sleep = ms => { return new Promise(resolve => setTimeout(resolve, ms)) } const getNumFruit = (s, fruit) => { return sleep(s).then(v =&
Read more »

Web caching (P1)

Hình ảnh
Câu chuyện hư cấu 1: A: *** hiểu sao code tao chỉnh sửa rồi mà deploy lên *** thấy thay đổi gì? B: Mày đã xóa cache chưa vậy? A: Làm sao để biết có cache hay không. Mà cache làm *** gì để suốt ngày phải xóa. Mất công, mất việc. One few moments later ... A: Xóa hết cache trình duyệt rồi, sao vẫn ko thay đổi code đã chỉnh sửa mày ơi. B: Ờ, cũng *** biết, đọc bài ở dưới xem sao :)) Câu chuyện hư cấu 2: C: Sao dạo này con web của tao nó chạy chậm thế nhờ? Có cách nào ko mày? D: Thế mày đã caching cho nó chưa? C: Tao đang nói web chạy chậm mà, có khi do code lởm mà, cache ciếc gì ở đây. Mà cache là cái gì vậy? D: Thôi đọc bài ở dưới đi rồi nói chuyện tiếp :)) Ok, qua 2 câu chuyện hư cấu trên, chắc các bạn cũng mường tượng được ưu, nhược điểm của Caching rồi đúng không? Vậy trong bài viết này, mình sẽ trình bày về Caching để các bạn hiểu vì sao nó lại quyền năng mà cũng lại rắc rối như thế.Hôm nay chúng ta cùng tìm hiểu về vấn đề này nhé. Mục lục Đường đi của 1 reques
Read more »

Cài đặt môi trường để code website Rails

Hình ảnh
Để xây dựng một website bẳng rails đầu tiên chúng ta cần phải xây dựng môi trường đúng chứ.Bài này mình sẽ hướng dẫn các bạn cài đặt môi trường để làm việc nhé. 1.Hệ điều hành Để làm việc được đơn giản mình gợi ý là dùng ubuntu,nếu bạn nào dùng mac thì quá tuyệt rồi.Mình không có tiền mua mac để code nên mình cài ubuntu để làm việc nhé,bạn nào có sử dụng window mà không muốn đổi hệ điều hành thì mình gợi ý nên sử dụng wubi để cài song song ubuntu nghịch cho biết, đây là bài hướng dẫn cài wubi nhé các bạn . 2.Cài đặt ruby Rails là một framework xây dựng website của ngôn ngữ ruby nên chắc chắn chúng ta phải cài ruby để làm việc rồi.Để cài đặt ruby chúng ta làm như sau: +,Bước đầu cần cài node và các công cụ phụ trợ của node curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash - curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add - echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list s
Read more »