Danh sách các awesome list hữu ích cho lập trình viên

Awesome list là tập hợp các danh sách chuyên về 1 ngôn ngữ lập trình hay 1 framework, CMS nào đó giúp cho developer có thể tham khảo các user guide, tutorial, resources … 1 cách dễ dàng mà không cần phải tìm kiếm ở nhiều nguồn khác nhau

Dưới đây là danh sách các awesome list mà tôi đã chọn lọc và thấy hay (ưu tiên cho mảng web và ngôn ngữ PHP 😀 ). Danh sách này sẽ được thường xuyên cập nhật

*** (Updated) Đây là awesome list “ông nội” của các list bên dưới, không chỉ về lĩnh vực lập trình mà còn bao gồm cả về IT và computer nói chung => https://github.com/sindresorhus/awesome

1/ PHP (https://github.com/ziadoz/awesome-php)

– Framework

Laravel: https://github.com/chiraggude/awesome-laravel
Phalcon: https://github.com/sergeyklay/awesome-phalcon
CakePHP: https://github.com/FriendsOfCake/awesome-cakephp
Symfony: https://github.com/sitepoint/awesome-symfony
Yii: https://github.com/awesome-yii/list
Zend Framework:
Slim: https://github.com/xssc/awesome-slim
Lumen: https://github.com/unicodeveloper/awesome-lumen

– CMS

Magento: https://github.com/DavidLambauer/awesome-magento2
Wordpress: https://github.com/miziomon/awesome-wordpress
Drupal: https://github.com/mrsinguyen/awesome-drupal

2/ Javascript (https://github.com/sorrycc/awesome-javascript)

– Frontend (web)

Jquery: https://github.com/petk/awesome-jquery
ReactJS: https://github.com/enaqx/awesome-react
VueJS: https://github.com/vuejs/awesome-vue
AngularJS: https://github.com/AngularClass/awesome-angular

– Backend (web)

NodeJS: https://github.com/sindresorhus/awesome-nodejs
Meteor: https://github.com/Urigo/awesome-meteor

– Mobile

React Native: https://github.com/jondot/awesome-react-native
Ionic: https://github.com/candelibas/awesome-ionic2

3/ Python (https://github.com/vinta/awesome-python)

Django: https://github.com/rosarior/awesome-django
Flask: https://github.com/humiaozuzu/awesome-flask

4/ Ruby (https://github.com/markets/awesome-ruby)

Ruby On Rails: https://github.com/hothero/awesome-rails-gem

5/ Golang (https://github.com/avelino/awesome-go)

6/ API (https://github.com/abhishekbanthia/Public-APIs)

Firebase: https://github.com/afonsopacifer/awesome-firebase

Cài đặt Pestle – công cụ hỗ trợ phát triển module cho Magento 2

Pestle là 1 ứng dụng dòng lệnh (command line) của tác giả Alan Storm giúp các lập trình viên có thể generate code (tự động sinh ra các đoạn code) cho Magento 2.

Cài đặt Pestle

Trang Github của Pestle bạn có thể tham khảo tại link https://github.com/astorm/pestle, đầu tiên bạn cần clone Pestle về

Sau khi đã pull source code của Pestle về bạn di chuyển vào thư mục của Pestle và tiến hành cập nhật composer

Tiếp theo bạn tải file pestle.phar bằng lệnh sau

Để hiển thị danh sách các lệnh command line của Pestle bạn sử dụng

Để hiểu rõ chi tiết hơn về 1 lệnh nào đó, ví dụ generate_module, bạn có thể dùng lệnh sau

Sử dụng Pestle trong dự án Magento 2

Bạn có thể thêm đoạn sau vào file composer.json của thư mục chứa Magento 2 sau đó tiến hành update lại composer

 

Tạo controller trong Magento 2

Controller là 1 thành phần quan trọng khi phát triển module trên Magento 2, hoặc trên 1 PHP MVC Framework. Nó là nơi nhận các requests, xử lý và hiển thị kết quả lên website.

Trong Magento 2, 1 module có thể có nhiều controller trong thư mục Controller, các controller chứa các action trong class và method execute(). Magento 2 có 2 loại controller, đó là frontend controller (xử lý bên ngoài frontend) và backend controller (xử lý bên trong backend). Về cách thức hoạt động thì 2 controller này hoàn toàn giống nhau, chỉ khác nhau 1 chút đó là backend controller có kiểm tra phân quyền khi xử lý request.

Controller trong Magento 2 hoạt động ra sao?

Nhiệm vụ của controller là nhận request từ end-user (người dùng web hoặc từ command line của Magento). Dưới đây là đường dẫn URL thường thấy của 1 Magento 2 controller

Trong đó:

route_name là tên của route (và tên này là duy nhất không trùng lặp) được đặt trong routes.xml
controller là tên thư mục con nằm trong thư mục Controller
action là tên class với method execute để xử lý request.

Tạo controller trong Magento 2 như thế nào?

Để tạo controller, chúng ta cần tạo thư mục con trong thư mục Controller của module, sau đó tạo thêm 1 file action class trong thư mục con đó. Trong bài viết này, chúng ta sẽ tạo controller Test với action class là Hello cho module Laptrinhinfo_HelloWorld.

Bước 1: Tạo routes.xml

etc/frontend/routes.xml

Bước 2: Tạo file controller

Controller/Index/Index.php

Như bạn đã thấy, các file controller đều kế thừa class \Magento\Framework\App\Action\Action và sẽ gọi phương thức execute. Và chúng ta sẽ viết logic code trong đó trước khi trả lại kết quả.

Bước 3: Tạo file layout

view/frontend/layout/helloworld_index_index.xml

Bước 4: Tạo file template

view/frontend/templates/index/index.phtml

Bước 5: Flush cache 

Bước 6: Test lại

Bạn có thể kiểm tra xem controller đã hoạt động đúng chưa bằng cách truy cập vào

hoặc

Các phương thức (method) khác trên Magento 2 controller

Ngoài execute, class \Magento\Framework\App\Action\Action còn cung cấp cho chúng ta 2 phương thức khác cũng quan trọng không kém đó là _forward_redirect

Phương thức _forward

Phương thức sẽ chuyển phần xử lý cho 1 action class khác mà không làm thay đổi đường dẫn request URL. Ví dụ chúng ta có 2 action class là Forward và Hello với nội dung class Forward là

Khi chúng ta truy cập vào http://example.com/route_name/test/forward thì kết quả xử lý từ class Hello sẽ hiển thị trên trình duyệt. Ngoài tên action class, bạn có thể chỉ định tên controller, tên module, và tham số truyền thêm vào trong phương thức _forward. Dưới đây là source code của phương thức _forward trong Magento 2

Phương thức _redirect

Phương thức này sẽ chuyển hướng đường dẫn URL sang 1 action class khác, và đương nhiên kết quả trả về sẽ là của action class được điều hướng đến. Chúng ta có thể kiểm tra bằng cách thay phương thức _forward bằng _redirect

Kết quả là khi bạn truy cập vào http://example.com/route_name/test/forward , trình duyệt sẽ chuyển hướng bạn đến http://example.com/route_name/test/hello và hiển thị kết quả của action class Hello.

Thay đổi giá sản phẩm bằng plugin trong Magento 2

Thêm file di.xml

File di.xml có nội dung như sau

Thay đổi giá sản phẩm

Ta sẽ tạo file app/code/Laptrinhinfo/HelloWorld/Plugin/Product.php, trong class Product, phương thức afterGetPrice sẽ giúp bạn thay đổi giá của sản phẩm. Ở đây tôi sẽ cho phép mỗi sản phẩm có giá ban đầu + 100

Flush cache và test lại

Bước cuối cùng là bạn flush cache của Magento 2 và ra ngoài frontend xem giá sản phẩm đã thay đổi chưa nhé.

Tạo module hello world trong Magento 2

Hello World là 1 trong những đoạn code basic nhất mà bất kỳ ngôn ngữ nào mới học bạn đều gặp phải khi bắt đầu. Với bài viết này cũng không ngoại lệ, chúng ta sẽ tìm hiểu cách tạo 1 module cho Magento 2 với kết quả xuất ra trên browser là “Hello World”.

Module trong Magento là 1 folder chứa các thành phần như blocks, controllers, models, helper, etc …. Trong Magento 2, các module được đặt ở thư mục app/code, và cấu trúc mỗi module sẽ theo format sau app/code/<Vendor>/<ModuleName> (với <Vendor> là tên của công ty hay tổ chức, <ModuleName> là tên của module)

Tạo đường dẫn cho module mới

Trong bài viết này tôi sử dụng Laptrinhinfo là tên vendor và HelloWorld là tên của module. Do đó chúng ta sẽ tạo cấu trúc folder là app/code/Laptrinhinfo/HelloWorld.

Mô tả module bằng cách sử dụng file cấu hình module.xml

Tạo thư mục etc trong thư mục chứa module ở bước 1, thêm vào đó file module.xml (đường dẫn sẽ là app/code/Laptrinhinfo/HelloWorld/etc/module.xml) với nội dung bên dưới

Chúng ta đăng ký tên của module là Laptrinhinfo_HelloWorld và version của module là 1.0.0

Đăng ký module bởi file registration.php

Tất cả module của Magento 2 phải được đăng ký thông qua class ComponentRegistrar, dó đó chúng ta tiến hành tạo file app/code/Laptrinhinfo/HelloWorld/registration.php với nội dung sau

Bật/cho phép module hoạt động

Để xem toàn bộ danh sách module đang hoạt động cũng như đang bị tắt (vô hiệu), bạn có thể gõ lệnh sau tại đường dẫn cài dặt Magento 2

Do module HelloWorld mới khởi tạo và chưa được bật lên do đó sẽ xuất hiện dòng sau

Chúng ta sẽ bật/cho phép module này hoạt động bằng lệnh

Kết quả sau khi enable

Sau cùng bạn cần upgrade lại Magento 2

Bạn có thể kiểm tra xem module đã xuất hiện chưa trong admin tại Stores > Configuration > Advanced > Advanced

Tạo đường dẫn router cho module

Trong Magento 2, đường dẫn URL sẽ dựa theo format sau

Chúng ta sẽ tạo file router app/code/Laptrinhinfo/HelloWorld/etc/frontend/routes.xml để khi truy cập vào /helloworld/* ngoài frontend, module này sẽ được gọi ra

Đường dẫn tương ứng ngoài frontend sẽ là

Tạo controller và acion

Chúng ta sẽ tạo file app/code/Laptrinhinfo/HelloWorld/Controller/Index/Display.php với nội dung như sau

Sau khi bạn truy cập vào http://example.com/helloworld/index/display trên trình duyệt, kết quả hiện ra trên màn hình sẽ là ‘Hello World’

Cài đặt chứng chỉ SSL Let’s Encrypt cho Nginx trên Ubuntu 16.04

Let’s Encrypt là 1 chứng chỉ SSL miễn phí được tài trợ bởi rất nhiều tên tuổi lớn của làng công nghê trên thế giới như Mozzila, Cisco, OVH, Chrome, Facebook … Trong những năm gần đây, việc Chrome của Google ngày càng gia tăng thị phần web browser trên thế giới cũng như Google đã xem SSL là 1 trong những tiêu chí đánh giá website đã làm cho SSL trở thành 1 trong những yếu tố quan trọng mà các webmaster muốn áp dụng nó cho website của mình.

Trong bài viết này mình sẽ hướng dẫn cách cài đặt Let’s Encrypt SSL cho Nginx trên server chạy Ubuntu 16.04

Cài đặt Let’s Encrypt

Đầu tiên bạn cần update lại Ubuntu và cài đặt Let’s Encrypt rất dễ dàng với dòng lệnh sau

Tạo chứng chỉ Let’s Encrypt SSL

Tiến hành chỉnh sửa file cấu hình mặc định của Nginx bằng cách

Trong block “server” thêm vào block “location” với nội dung như sau

Nếu bạn muốn biết thư mục gốc (document root) của Nginx ở đâu thì có thể tham khảo giá trị root ngay trong file cấu hình. Nếu bạn chưa chỉnh sửa cấu hình ban đầu của Nginx, thì mặc định document root là /var/www/html

Lưu lại thay đổi trên file cấu hình của Nginx rồi kiểm tra xem file đó có bị lỗi cú pháp hay không bằng cách

Nếu không có lỗi gì, thì hãy khởi động lại Nginx

Chạy lệnh sau để tiến hành khởi tạo chứng chỉ SSL cho domain của bạn

*** /var/www/html là thư mục mà bạn muốn trỏ domain tới, và example.com là domain của bạn (bạn có thể tùy chỉnh những giá trị này cho phù hợp với thực tế)

Một màn hình hiện ra yêu cầu bạn nhập email của bạn

Tiếp đến bạn hãy đồng ý với điều khoản của Let’s Encrypt bằng cách chọn Agree

Nếu mọi thứ ok không có gì trục trặc thì sẽ trả về kết quả như sau

(còn tiếp … :D)

Tạo hệ thống đăng nhập cho user với Facebook và Laravel Socialite

Bạn sẽ học được gì qua bài viết này?

Trong bài này bạn sẽ biết được cách tạo hệ thống đăng nhập để xác thực user bằng cách sử dụng 1 mạng xã hội (như Facebook, Twitter, Gmail …) với Socialite – 1 package của Laravel.

Cài đặt Socialite

Với các PHP Framework khác thì việc xây dựng hệ thống đăng nhập thông qua bên thứ 3 khá phức tạp và có ít tài liệu hướng dẫn, tuy nhiên đối với Laravel thì lại vô cùng dễ dàng. Hiện tại, Socialite hỗ trợ đăng nhập qua các mạng xã hội Facebook, Github, Google, Twitter và Bitbucket. Nếu bạn muốn sử dụng Socialite với các mạng xã hội khác (như Youtube, WordPress …) thì bạn có thể tham khảo Socialite Providers

Tuy đã được giới thiệu trong documentation của Laravel phiên bản 5.4 tuy nhiên Socialite mặc định vẫn chưa phải là core của Laravel. Do đó bạn cài đặt Socialite bằng composer

Hoặc bạn có thể thêm dòng bên dưới vào phần require của file composer.json rồi chạy lệnh composer update

Sau khi đã cài đặt Socialite bạn cấu hình lại file config/app.php => thêm dòng sau vào mảng providers

Tiếp tục bạn thêm 1 facade với tên Socialite vào mảng aliases

Ok, đến đây thì bạn đã có thể sẵn sàng sử dụng Socialite trong project Laravel của bạn rồi đấy!

Tạo Facebook app

Để có thể sử dụng Facebook như một hệ thống đăng nhập cho user thì bạn cần phải tạo 1 Facebook app. Đừng lo lắng, điều này cũng vô cùng dễ dàng! Đầu tiên bạn hãy đăng nhập vào account Facebook của bạn và truy cập vào https://developers.facebook.com

Phần Account Menu ở góc phải trên cùng bạn click vào Add a New App và chọn Website để tạo Facebook app

Điều vào tên app của bạn và bấm Create New Facebook App ID. Màn hình sẽ xuất hiện như bên dưới

Chọn category cho Facebook app của bạn rồi bấm Create App ID, sau đó bấm vào Skip Quick Start để vào phần Dashboard của app

Để có thể lấy được App Secret, bạn bấm vào nút Show rồi điền mật khẩu tài khoản Facebook của bạn.

Tạo Facebook test app

Nếu bạn đang muốn test chức năng Facebook login trên localhost, hãy bấm vào menu Test App tại phần Dashboard, điền vào đầy đủ thông tin rồi bấm Create Test App (như hình bên dưới)

Sau đó bạn vào Settings > Add Platforms > Website, điền vào domain website của bạn trên localhost vào 2 phần App DomainsSite URL, ví dụ cookbook.app (về việc set domain ảo trên localhost cho Apache bạn có thể tham khảo trên Internet)

Sau cùng hãy bấm vào Save Changes để lưu lại toàn bộ thay đổi. Và nhớ đừng quên 2 thông tin quan trọng nhất để bạn có thể sử dụng ở bước tiếp theo là App IDApp Secret

Cấu hình Facebook app trong Laravel project

Sau khi đã tạo xong 1 Facebook app, bạn có thể liên kết nó với Laravel bằng cách sửa file config/services.php

Hoặc bạn có thể sử dụng biến từ file .env

Lúc đó bạn có thể chỉnh lại file config/services.php như sau

Trong đó yourFacebookAppIDApp IDyourFacebookAppSecretApp Secrethttp://yourLaravelAppURL/login/facebook/callback là link trên website của bạn mà user sau khi đăng nhập Facebook app thành công sẽ được redirect tới.

Đến đây thì quá trình cài đặt và cấu hình Socialite cho Laravel đã hoàn tất! Bạn có thể tham khảo kỹ hơn documentation của Socialite trên Github tại đây https://github.com/laravel/socialite để hoàn tất hệ thống đăng nhập user của bạn.

Happy coding! 😀

Lập trình web bằng Ruby với Hanami framework

Nhắc đến ngôn ngữ Ruby, nhiều người sẽ nghĩ ngay đến Ruby On Rails – web framework nổi tiếng trên thế giới đang được các Ruby developers sử dụng hàng ngày. Trong khi đối với PHP, có quá nhiều sự lựa chọn framework để làm nên 1 website như Laravel, Phalcon, Zend Framework, CakePHP, Yii, Symfony … thì đối với Ruby có lẽ người ta chỉ biết đến Ruby On Rails 😀 Hôm nay để đổi gió tôi sẽ giới thiệu cho các bạn 1 Ruby web framework cũng khá tốt đó là Hanami 😀

Các bạn có thể tham khảo và đọc document của Hanami tại đây http://hanamirb.org/guides/

Để cài đặt Hanami thì vô cùng đơn giản, bạn chỉ cần gõ lệnh (À mà quên trước khi cài đặt Hanami bạn cần cài đặt Ruby nhé =)) , tôi sẽ không hướng dẫn chi tiết về vấn đề này)

Sau đó để tạo 1 web project với Hanami tôi dùng

với “bookshelf” là tên project của bạn, bạn có thể thay đổi tùy thích. Sau khi đã tạo xong project, bạn có thể thử tham quan cấu trúc của 1 project Hanami xem nó như thế nào

Trong đó tôi giải thích sơ về ý nghĩa 1 số file và folder trong này

Gemfile sẽ định nghĩa những Rubygems dependencies (sử dụng Bundler) => cái này đối với các ROR dev thì quá quen rồi nhỉ? 😀
Rakefile sẽ mô tả những Rake tasks
apps sẽ chứa 1 hay nhiều web applications, khi mới khởi tạo thì chỉ có 1 web app đó là web trong thư mục apps, bên trong mỗi web app như web sẽ chứa các thành phần như controllers, views, routes và templates.
config sẽ chứa những file cấu hình của project
config.ru là cấu hình dành cho Rack server
db sẽ chứa các giản đồ cho database (schema) và các migrations (những thay đổi về cấu trúc của database)
lib sẽ chứa các business logic code và các models, bao gồm entities và repositories
public sẽ chứa những file tĩnh cho web project như các file css, js, images …
spec để chứa những file tests

Vậy là xong phần giới thiệu về cấu trúc của Hanami, bây giờ chúng ta thử chạy nó xem mặt mũi nó ra sao nhé! 😀

Đối với các bạn đang xài Windows thì có thể sẽ bắt gặp lỗi sau khi chạy Hanami server “ERROR NotImplementedError: fork() function is unimplemented on this machine”. Các bạn có thể khắc phục bằng cách chạy lệnh

*** Tham khảo issue này của Hanami trên Github: https://github.com/hanami/hanami/issues/278

Ok, sau này đã chạy ngon ơ chúng ta sẽ kiểm tra bằng trình duyệt (web browser) xem như thế nào nhé. Bạn chỉ cần truy cập đến địa chỉ http://localhost:2300, nếu bạn thấy kết quả như hình bên dưới

thì xin chúc mừng bạn đã cài đặt Hanami thành công! 😀 Để tiếp tục với Hanami, bạn có thể đọc tiếp document của nó trên trang chủ, hy vọng Hanami là 1 sự lựa chọn không tồi để các Ruby developers sử dụng nó cho web project của mình