iTranslated by AI

The content below is an AI-generated translation. This is an experimental feature, and may contain errors. View original article
🎆

Setting Up a Writing Environment for Zenn.dev on Debian GNU/Linux Sid

に公開
Subject Date
Date article written 2020-09-19
Date article modified 2024-10-23

The above was added by the author to help judge the freshness of this article. For a detailed change history, please refer to GitHub - yabuki/friendly-potato: zenn-contents.

I would appreciate it if you could submit a pull request for any typos in the article. Whether I accept it or not will be determined by the diff and the content of the pull request description.

I wanted to include a chronological concept in the slug, so I decided to fill it with the publication date. As a result, the hearts I received have disappeared. Please forgive me, as this was part of my initial trial and error.

Introduction

A new place for writing technical articles called Zenn.dev has been created.

I liked it because it integrates with GitHub, allowing me to keep my articles there, which makes it easy for the writer to control the content. Since it's also possible to publish on GitHub Pages, if a disagreement with Zenn's side occurs and the article is no longer published there, I can still keep it on my own GitHub Pages. In fact, since I control the articles myself, I can even move them elsewhere.

While lock-in oriented services are gaining popularity here and there, this service made me—someone who wants to control my own articles—think about giving it a try, so I'm writing this first article.

Installation Environment

Hardware

  • Thinkpad X200 C2D Memory 8G

OS

  • Debian GNU/Linux Sid

Other software being used

Web services mentioned here

  • Zenn
  • GitHub

Prerequisites

  1. Assumes you have a GitHub account and understand how to use it.
  2. You have created an account on Zenn.dev. As of 2020-09-19, it seems only Google Accounts could be created, which might be a blocking factor for various reasons, but let's take that as a prerequisite. This issue was resolved as of 2024-10-24, as it's now possible to log in with an email address.
  3. I am using Debian GNU/Linux Sid, which is the development version of Debian, but there are no Debian-specific parts within the scope of this article.
  4. Using nvm-sh/nvm: Node Version Manager - POSIX-compliant bash script to manage multiple active node.js versions.
  5. Managing multiple versions of Node.js in the user's home directory with nvm.

Install

Installing nvm.sh

Please read the content of nvm-sh/nvm: Node Version Manager - POSIX-compliant bash script to manage multiple active node.js versions carefully and install it.

The Node.js version used is as follows.

nvm install --lts

I am using lts/erbium, which is the LTS version as of 2020-09-19.

nvm ls
->     v12.18.4
         system
default -> lts/* (-> v12.18.4)
node -> stable (-> v12.18.4) (default)
stable -> 12.18 (-> v12.18.4) (default)
iojs -> N/A (default)
unstable -> N/A (default)
lts/* -> lts/erbium (-> v12.18.4)
lts/argon -> v4.9.1 (-> N/A)
lts/boron -> v6.17.1 (-> N/A)
lts/carbon -> v8.17.0 (-> N/A)
lts/dubnium -> v10.22.1 (-> N/A)
lts/erbium -> v12.18.4

Creating a GitHub Repository

When creating a GitHub repository now, it suggests names for you. I found the suggestion friendly-potato so amusing that I couldn't help but use that name for the integration.

Also, I enabled gh-pages and decided on a theme. I haven't tried what to do with this yet, so for now, I'm just setting it up.

Integrating with Zenn

I'll follow the instructions in this article. At this stage, only the gh-pages branch existed, so I'll integrate with that.

Cloning with Git

Since I keep my git repositories under ~/scm/git/, I'll execute the following:

git clone git@github.com:yabuki/friendly-potato.git

The only branch created was the gh-pages branch, so I'm using the following branch structure to create a staging environment:

* docs
  gh-pages
  remotes/origin/HEAD -> origin/gh-pages
  remotes/origin/gh-pages

Installing Zenn CLI

Instead of installing it globally, I will install it only for this repository.

Installing Zenn CLI | Zenn

I'll check the content of the link and follow the instructions to install Zenn CLI in the docs branch.

npm init --yes # Initialize the project with default settings
Wrote to /home/yabuki/scm/git/friendly-potato/package.json:

{
  "name": "friendly-potato",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/yabuki/friendly-potato.git"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/yabuki/friendly-potato/issues"
  },
  "homepage": "https://github.com/yabuki/friendly-potato#readme"
}

install log

npm install zenn-cli
npm WARN deprecated chokidar@2.1.8: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated mkdirp@0.5.3: Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x. (Note that the API surface has changed to use Promises in 1.x.)
npm WARN deprecated fsevents@1.2.13: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated

> @ampproject/toolbox-optimizer@2.6.0 postinstall /home/yabuki/scm/git/friendly-potato/node_modules/@ampproject/toolbox-optimizer
> node lib/warmup.js

AMP OPTIMIZER Downloaded latest AMP runtime data.
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.1.2 (node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.1.3: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules/next/node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN notsup Unsupported engine for watchpack-chokidar2@2.0.0: wanted: {"node":"<8.10.0"} (current: {"node":"12.18.4","npm":"6.14.6"})
npm WARN notsup Not compatible with your version of node/npm: watchpack-chokidar2@2.0.0
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules/watchpack-chokidar2/node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN friendly-potato@1.0.0 No description

+ zenn-cli@0.1.26
added 900 packages from 393 contributors and audited 903 packages in 107.328s

40 packages are looking for funding
  run `npm fund` for details

found 5 low severity vulnerabilities
  run `npm audit fix` to fix them, or `npm audit` for details
npx zenn init

  🎉Done!
  早速コンテンツを作成しましょう

  👇新しい記事を作成する
  $ zenn new:article

  👇新しい本を作成する
  $ zenn new:book

  👇表示をプレビューする
  $ zenn preview
  
 yabuki   docs … 6  ~  scm  git  friendly-potato  zenn new:article
bash: zenn: command not found

So, I specify the full path.

$ ls
README.md  _config.yml  articles  books  index.md  node_modules  package-lock.json  package.json
$ node_modules/zenn-cli/bin/zenn.js new:article
📄02430e87dd27b8bc82c4.md created.
$ node_modules/zenn-cli/bin/zenn.js preview
👀Preview on http://localhost:8000

I create the article like this and then write the article using my favorite editor.

Upgrading Zenn CLI to the latest version

Although the following error appeared, it successfully updated to a version that automatically reloads upon saving.

npm install zenn-cli@latest
npm WARN deprecated chokidar@2.1.8: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated mkdirp@0.5.3: Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x. (Note that the API surface has changed to use Promises in 1.x.)
npm WARN deprecated fsevents@1.2.13: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.1.2 (node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.1.3: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules/next/node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN notsup Unsupported engine for watchpack-chokidar2@2.0.0: wanted: {"node":"<8.10.0"} (current: {"node":"12.18.4","npm":"6.14.6"})
npm WARN notsup Not compatible with your version of node/npm: watchpack-chokidar2@2.0.0
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules/watchpack-chokidar2/node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

+ zenn-cli@0.1.29
added 5 packages from 3 contributors, removed 3 packages, updated 2 packages, moved 1 package and audited 905 packages in 31.792s
found 5 low severity vulnerabilities
  run `npm audit fix` to fix them, or `npm audit` for details

After Finishing the Article

Reviewing the Article

  • Change the slug string to something meaningful.

    • Follow the warnings from the Zenn Editor.
  • Fix Zenn Editor warnings.

    • I recall being scolded by the Zenn Editor that slug strings must be up to 50 characters, using only 0-9, hyphens, and lowercase English letters.
  • Refine the text.

    • Eventually, I'd like to implement automated text checks, such as running Redpen.

Publication

To publish, merge the docs branch into the gh-pages branch.

GitHubで編集を提案

Discussion