Xin chào tất cả các bạn, mình là Quân, hôm nay mình sẽ hướng dẫn các bạn cài đặt một số công cụ tiện ích khi làm việc trên hệ điều hành MacOS (bao gồm các dòng chip M1) nhé. Như tiêu đề, đó là 4 thứ: iTerm2, Oh My Zsh, Zsh Autosuggestions và Zsh-syntax-highlighting nhé.
“Bài này nằm trong loạt bài “Tổng hợp kiến thức hữu ích cho lập trình viên” (đang cập nhật) trên trang blog chính thức trungquandev.com“
Lưu ý: Trước khi làm theo hướng dẫn trong bài này, các bạn nên tham khảo trước bài viết: Cài đặt NVM, NodeJS và GIT trên MacOS M1 Silicon nếu máy của các bạn chưa có sẵn NVM, NodeJS cũng như GIT nha.
Những nội dung có trong bài:
- Cài đặt iTerm2 có thể dùng thay cho Terminal mặc định của MacOS
- Cài đặt Oh My Zsh
- Cài đặt Zsh Autosuggestion (thằng này rất tiện, có thể suggest các lệnh trong khi chúng ta làm việc với Terminal)
- Cài đặt Zsh-syntax-highlighting (thằng này sẽ highlight terminal của các bạn, từ directory cho tới git branch, cực kỳ tiện và dễ nhìn luôn nha)
- Vấn đề bị lỗi font của mấy cái icon Git branch trong Terminal
1. Cài đặt iTerm2 có thể dùng thay cho Terminal mặc định của MacOS
Các bạn cứ hiểu đơn giản iTerm2 nó là một bản thay thế cho Terminal mặc định của MacOS, nó hoạt động tốt từ phiên bản macOS 10.14 trở lên, và nó cung cấp nhiều tính năng hơn so với bản mặc định.
Cài iTerm2 thì cực dễ rồi, các bạn vào trang chủ của nó tải về rồi mở lên kéo vào Applications là xong thôi nha, link tới trang downloads của iTerm2 đây:
https://iterm2.com/downloads.html
Về tính năng của nó thì các bạn có thể tham khảo nhanh ở đây nha:
https://iterm2.com/features.html
Kết quả đây, ở trên là Terminal default của Mac, còn ở dưới là iTerm2 mình vừa cài, dĩ nhiên các bạn chưa thấy gì khác biệt ngoài màu sắc rồi nha, còn sự khác biệt thì nó nằm ở phần tính năng mà mình đã để link ngay phía trên nha:
(Ngoài lề quen thuộc: Cảnh báo này dành cho bất kể trang nào khác mà có ý định copy bài không phải của các bạn thì hãy tôn trọng người viết bài chân chính, tuyệt đối không được xào nấu, chỉnh sửa linh tinh bài viết của mình cụ thể là không được xóa những liên kết (link) cũng như tự ý xóa các câu thoại của mình trong toàn bộ bài viết rồi post lại lên trang của các bạn như kiểu đây là bài của các bạn vậy, nếu tham khảo thì hãy để lại liên kết nguồn rõ ràng từ trang trungquandev, mình sẽ thường xuyên dùng tool để check, và nếu phát hiện ra thì cứ đơn giản là chắc chắn sẽ ăn report DMCA nhé.)
2. Cài đặt Oh My Zsh
Thằng Oh My Zsh này nó là một Open Source, chúng ta sẽ dùng nó để quản lý các cấu hình của Zsh
Mình sẽ install nó qua curl, các bạn cũng có thể tìm thấy phần cài đặt nó ở repo chính thức trên GitHub chính thức này nha: https://github.com/ohmyzsh/ohmyzsh#basic-installation
sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
Đây là hình ảnh sau khi cài xong:
Có một lưu ý quan trọng đoạn này nhé:
– Như ảnh trên của mình các bạn sẽ thấy một dùng chữ màu xanh lá cây như sau:
“Found ~/.zshrc. Backing up to /Users/trungquandev/zshrc.pre-oh-my-zsh Using the Oh My Zsh template file and adding it to ~/.shrc.”
– Nguyên nhân là bởi vì trước đó mình đã có sẵn file .zshrc với một số cấu hình cho thằng NVM và ẩn cái Computer Name trong terminal. (Các bạn có thể tham khảo thêm ở bài viết này của mình: Cài đặt NVM, NodeJS và GIT trên MacOS M1 Silicon)
– Nên khi cài xong Oh My Zsh, nó sẽ tự backup và đổi tên file .zshrc hiện tại của mình thành file .zshrc.pre-oh-my-zsh và nó sẽ tạo ra một file .zshrc mới với những nội dung liên quan bên trong, việc bây giờ của mình là sẽ copy những cái cấu hình từ file backup hiện tại của mình sang file .zshrc mới mà thằng Oh My Zsh nó tạo nha, vì nếu không làm vậy thì khi chạy lệnh nvm các bạn sẽ bị một cái là command not found: nvm nha (đơn giản là đang thiếu cấu hình thôi.)
3. Cài đặt Zsh Autosuggestion
Thằng này có 2 cách cài nha, cách đầu tiên là cài vào trong Custom Plugins của Oh My Zsh, còn cách thứ hai là Manual Clone vào một thư mục riêng của các bạn rồi thêm cấu hình vào file .zshrc, các bạn có thể tham khảo ở link bên dưới:
https://github.com/zsh-users/zsh-autosuggestions/blob/master/INSTALL.md#oh-my-zsh
Mình sẽ chọn cách đầu tiên là clone + install vào trong plugins của Oh My Zsh
git clone https://github.com/zsh-users/zsh-autosuggestions ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-autosuggestions
Tiếp theo là mở file .zshrc lên rồi thêm zsh-autosuggestions vào trong phần config plugins rồi lưu file lại, như hình bên dưới mình dùng 2 plugins là git và zsh-autosuggestions
– Cuối cùng các bạn tắt hẳn Terminal đi rồi mở lại và thử vài lệnh cơ bản như git status…vv là sẽ thấy nó có suggest rồi nhé.
4. Cài đặt Zsh-syntax-highlighting
Thằng này nó cũng có rất nhiều cách để cài, tuy nhiên mình vẫn khuyến khích các bạn cài nó vào custom plugins của thằng Oh My Zsh cho đồng bộ và gọn gàng nha: (có thể tham khảo thêm ở link bên dưới)
https://github.com/zsh-users/zsh-syntax-highlighting/blob/master/INSTALL.md#oh-my-zsh
Các bạn chạy cho mình lệnh clone này về custom plugins của Oh My Zsh, nói chung là làm tương tự cái zsh-autosuggestions trên nha
git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-syntax-highlighting
Tiếp theo cũng mở file .zshrc lên rồi thêm zsh-syntax-highlighting vào trong phần config plugins rồi lưu file lại, lúc này mình sẽ có 3 plugins là git, zsh-autosuggestions và zsh-syntax-highlighting
– Và cuối cùng vẫn là tắt hẳn Terminal đi rồi mở lại là sẽ thấy khác biệt nha, đặc biệt các bạn có thể thử mở một repo có git, lúc này các bạn sẽ thấy đc cả branch hiện tại mà các bạn đang đứng (ví dụ như hình ảnh bên dưới), khá là tiện phải không?
LƯU Ý: Đối với những bạn nào đã ẩn cái Computer Name trong Terminal giống như cách mà mình đã hướng dẫn ở phần 1 trong bài viết này: Cài đặt NVM, NodeJS và GIT trên MacOS M1 Silicon thì các bạn chỉ cần mở lại file .zshrc và xóa cái dòng PS1=”%n$ “ đi thì mọi thứ sẽ hoạt động chuẩn và đẹp nha.
- Để test thì mình thử mở cái thư mục .oh-my-zsh, vì trong thằng này đã có sẵn Git nên các bạn có thể thấy ngay cũng như branch hiện tại của nó là master nha.
5. Vấn đề bị lỗi font của mấy cái icon Git branch trong Terminal
Xong hết 4 bước trên thì mình gặp một cái lỗi font nho nhỏ trong Terminal như hình bên dưới này
Để fix thì cần fix hai lần ở iterm 2 và trong ZSH của VSCode mà mình sử dụng:
Đối với iterm 2: Các bạn mở Preferences > Profiles > Text và tích chọn Use Built-in Powerline glyphs
Đối với VSCode thì cần cài đặt một cái font có hỗ trợ icon vào máy trước, ví dụ mình chọn cái font có tên là Menlo for Powerline, đầu tiên là clone nó về một thư mục nào đó tùy các bạn (vì xong là mình cũng xóa repo đó đi)
git clone https://github.com/abertsch/Menlo-for-Powerline.git
Vào trong thư mục vừa clone về click đúp vào file Menlo for Powerline.ttf rồi Install
Tiếp theo mở VSCode lên vào phần Preferences > Settings (Phím tắt là Command + dấu phẩy) rồi tìm kiếm theo từ khóa Terminal FontFamily và nhập tên font Menlo for Powerline vào như hình dưới là xong nhé:
OK xong rồi, vậy là mình đã hướng dẫn xong cách cài 4 công cụ tiện lợi đó là: iTerm2, Oh My Zsh, Zsh Autosuggestions và Zsh-syntax-highlighting cũng như fix luôn cái lỗi font icon trong terminal rồi nha.
Cảm ơn các bạn đã dành thời gian đọc bài viết.
Xin chào và hẹn gặp lại các bạn ở những bài viết tiếp theo.
Best Regards – ? Trungquandev Official ❤
Tham khảo kiến thức:
https://iterm2.com/
https://github.com/ohmyzsh/ohmyzsh
https://github.com/zsh-users/zsh-autosuggestions
https://github.com/zsh-users/zsh-syntax-highlighting
“Thanks for awesome knowledges.”
“ From author: trungquandev ”
Khóa học lập trình làm việc thực tế:
KHOÁ HỌC LẬP TRÌNH MERN STACK 100% DỰ ÁN THỰC TẾ và CHẤT LƯỢNG
