Skip to content
Gatsby powered static personal blog
TypeScript CSS JavaScript Shell
Branch: master
Clone or download
Latest commit b314878 Nov 4, 2019
Type Name Latest commit message Commit time
Failed to load latest commit information.

GitHub Actions Uptime Robot ratio (7 days) Codacy grade style: styled-components (previously VicBlog) is the personal website of ddadaal.

Currently it is built with Gatsby.

Check it out now!


  • Static website with modern web technologies
  • Auto-generated RSS Feed at /rss.xml
  • Synchronous & Native Search
    • Native support for searching articles without any third-party services
  • Progressive Web Application
  • Support multiple languages (Chinese & English)
  • Articles written on markdown; Source code and contents separated
    • Supports inline react components
  • Auto generated slide directory using GitHub API v3 on every build
  • Analytics via CNZZ

Tools and Frameworks Used

  • Gatsby: the blazing-fast and flexible static site generator with a big community for React
  • TypeScript: the new go-to for any JavaScript projects
  • simstate: a self-made simple but enough strongly-typed hooks-based state management
  • styled-components: component-ize your styles as well
  • SCSS: bootstrap used SCSS so...trying to get rid of it in the future
  • gitalk: a comment system that works out of box
  • react-icons: extremely abundant but easy-to-use icon library for React
  • ESLint: tslint is being deprecated! This project is a pioneer in fully leveraging ESLint in a React+TypeScript project!
  • editorconfig: unify code editor preferences
  • CNZZ: simple and free website analysis for mainland China
  • GitHub Pages: free and popular static website host
  • GitHub Actions: CI/CD built directly into the repo!


Yarn is required.

Notice: If an environment variable is named ACTION_TOKEN, it will be used to authenticate GitHub requests to fetch slides (to get higher rate limit for CI). If it does not exist, an anonymous request is used, which is adequate for local development.

# install dependencies

# Install dependencies From TaoBao
yarn iftb

# serve with hot reload at localhost:8000
yarn dev

# run production build
yarn build

# **After build**, serve the production build locally
yarn serve

# Update dependencies with npm-check-updates and update the package.json
yarn upddep

Firewall Notice

A dependency sharp needs to pull prebuilt binaries from GitHub releases during installation. GitHub hosts release files on AWS, which is sometimes blocked in China. Failure to download these files will cause failure in installation and following steps.

Thankfully, according to the official docs, we can change the base url for this file. With the help of python 3's http.server module, we can start a local http server and serve the file from local.

If you encountered download error mentioned above, follow the following steps to complete installation:

  1. Download the file yourself and place the file into a directory
  2. Run python -m http.server {port} --bind {url} and keep it running until the installation completes.
  3. Set the environment variable SHARP_DIST_BASE_URL to http://{url}:{port}
  4. npm install and you are ready to go!



You can’t perform that action at this time.