1. Môi trường phát triển

1.1. Server website

Website cá nhân của mình là: https://truongnh1992.github.io hoạt động với tên miền github.io - tên miền mặc định của Github Pages. Mình nghĩ rằng nếu bạn học ngành IT thì chắc hẳn sẽ quen với việc sử dụng git để quản lý các phiên bản mã nguồn (source codes) của các project và https://github.com là một trang rất nổi tiếng để lưu trữ và quản lý source codes đó.

Toàn bộ mã nguồn của website này đều được công bố tại đây. Website được tạo trên nền tảng Jekyll hỗ trợ web tĩnh, markdown và có khả năng tích hợp HTML, CSS.

1.2. Hệ điều hành

Hệ điều hành mình sử dụng là GNU/Linux (Debian, Fedora, Ubuntu) và MacOS.

1.3. Chương trình soạn thảo

Editor được khuyên dùng Sublime Text và vim.

2. Các tính năng bổ sung của website

2.1. Một số cú pháp markdown cơ bản

Dưới đây là một số cú pháp thường dùng, các bạn có thể xem thêm các cú pháp nâng cao tại đây.

  • In nghiêng 
    *Nguyễn Hải Trường*

    Nguyễn Hải Trường

  • In đậm 
    **Đại học Bách Khoa Hà Nội**

    Đại học Bách Khoa Hà Nội

  • Chèn link 
    [My Tech Blog](https://truongnh1992.github.io)

    My Tech Blog

  • Chèn hình ảnh vào bài viết 
    ![My workingspace](../img/workingspace.jpg)

    My workingspace

  • Nhúng code vào bài viết
    Để hiển thị được source codes với syntax highlighting của mỗi ngôn ngữ lập trình, ta chèn đoạn code trong cặp dấu: 
    ```programming language
Enter your source codes here
```

    Ví dụ:

    ```java
public class HelloWorld {

  public static void main(String[] args) {
      System.out.println("Hello, World");
  }
}
```

    Ta được:

    public class HelloWorld {

  public static void main(String[] args) {
      System.out.println("Hello, World");
  }
}

2.2. Mục lục với markdown TOC

Trong bài viết này, để đánh mục lục, mình cài gói Markdown TOC cho Sublime Text hoặc có thể viết với cú pháp sau:

<!-- MarkdownTOC -->
- [1. Môi trường phát triển](#1-moi-truong-phat-trien) 
	- [1.1. Server website](#server-website)  
	- [1.2. Hệ điều hành](#he-dieu-hanh)  
	- [1.3. Trình soạn thảo](#trinh-soan-thao)  
- [2. Các tính năng bổ sung của website](#2-cac-tinh-nang-bo-sung-cua-website)  
	- [2.1. Một số cú pháp markdown cơ bản](#mot-so-cu-phap-markdown-co-ban)  
	- [2.2. Mục lục với markdown TOC](#muc-luc-voi-markdown-toc)  
	- [2.3. Comments dưới mỗi bài viết](#comments-duoi-moi-bai-viet)  
	- [2.4. Phân tích dữ liệu trang web](#phan-tich-du-lieu-trang-web)  
- [3. Tạo một bài viết mới](#3-tao-mot-bai-viet-moi)  
<!-- /MarkdownTOC -->

<a name="1-moi-truong-phat-trien"><a/>
## 1. Môi trường phát triển

<a name="server-website"><a/>
### 1.1. Server website
...

2.3. Comments dưới mỗi bài viết

Nền tảng Jekyll hỗ trợ comments dùng công cụ Disqus và Facebook comments. Đăng kí tài khoản Disqus và thêm Disqus shortname của bạn vào tham số disqus trong file _config.yml. Và giờ đây, website của bạn đã hỗ trợ tính năng comments dưới mỗi bài viết rồi.

2.4. Phân tích dữ liệu trang web

Để thống kê tổng số lượt truy cập, số lượt truy cập theo vùng địa lý, theo độ tuổi,… giá trị trang web… các bạn có thể dùng công cụ Google Analytics. Tích hợp tính năng này vào website bằng cách thêm Google Tracking ID của bạn vào google_analytics trong file _config.yml.

3. Tạo một bài viết mới

Mã nguồn của bài viết này nằm trong thư mục _posts.

Tương tự, để tạo mới một bài viết bất kì, các bạn tạo một file có tên theo cú pháp yyyy-mm-dd-ten-bai-viet.md trong thư mục _posts, và phần khai báo như sau:

---
layout: post
title: Cách tạo một website cá nhân với Github Pages
date: 2018-09-30
tags: blog github website github-page
---

Kết

Trên đây mình đã tóm lược các bước để xây dựng website cá nhân với Github Pages, website dạng này rất thích hợp để viết Tech Blog. Hi vọng bài viết sẽ giúp ích được mọi người :)

Tags: tutorials